Текст программы — различия между версиями

Материал из didactis
Перейти к: навигация, поиск
Строка 1: Строка 1:
−
import pygame
+
<!DOCTYPE html>
−
pygame.init()
+
<html>
 +
    <head>
 +
    <title>Albion</title>
 +
        <meta charset="UTF-8">
 +
    <link rel="preconnect" href="https://fonts.googleapis.com">
 +
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 +
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">   
 +
   
 +
    <link rel="stylesheet" href="css/style.css">
 +
    <link rel="preconnect" href="https://fonts.googleapis.com">
 +
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 +
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">
 +
    <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"/>
 +
    </head>
 +
    <body>
 +
   
 +
    <header class="header">
 +
        <div class="container">
 +
            <div class="header__inner">
 +
                <div class="header__logo">Привет :D</div>
 +
                <nav class="nav">
 +
                    <a class="nav__link" href="https://vk.com/noemotionthatpeace" target="_blank">Группа ВК</a>
 +
                    <a class="nav__link" href="https://www.donationalerts.com/r/forgottenshadow" target="_blank">Написать заявку в клан</a>
 +
                    <a class="nav__link" href="https://www.youtube.com/channel/UC2b4MQv4mjOBbzpFtDEC8wQ" target="_blank">Ютуб-канал нашего лидера</a>
 +
                </nav>
 +
            </div>
 +
        </div>
 +
    </header>
 +
   
 +
    <div class="intro">
 +
        <div class="container"></div>
 +
            <div class="intro__inner">
 +
                <h2 class="intro__suptitle">Добро пожаловать!</h2>
 +
                <h1 class="intro__title">Welcome to Albion</h1>
  
−
win = pygame.display.set_mode((500,500))
+
                <a class="btn" href="#" target="_blank">Узнать о нас больше</a>
−
pygame.display.set_caption("First Game")
+
            </div>
 +
    </div>
 +
        <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
 +
        <script src="app.js"></script>
 +
    </body>
 +
</html>
  
−
x = 50
 
−
y = 425
 
−
width = 40
 
−
height = 60
 
−
vel = 5
 
  
−
isJump = False
+
body {
−
JumpCount = 10
+
    margin: 0;
 +
    font-family: 'Montserrat', sans-serif;
  
−
run = True
+
    font-size: 15px;
 +
    line-height: 1.6;
 +
    color: #333;
 +
}
  
−
while run:
+
*,
−
     pygame.time.delay(50)
+
*::before,
 +
*:after{
 +
     box-sizing: border-box;
 +
}
  
−
     for event in pygame.event.get():
+
h1, h2, h3, h4, h5, h6 {
−
        if event.type == pygame.QUIT:
+
     margin: 0;
−
            run = False
+
}
  
−
     keys = pygame.key.get_pressed()
+
/* Контейнер */
 +
.container {
 +
     width: 100%;
 +
    max-width: 1200px;
 +
    margin: 0 auto;
 +
}
  
−
    if keys[pygame.K_LEFT] and x > 5:
+
/* Интро */
−
        x -= vel
 
  
−
     if keys[pygame.K_RIGHT] and x < 500 - width - 5:
+
.intro {
−
        x += vel
+
    display: flex;
 +
    flex-direction: column;
 +
    justify-content: center;
 +
    width: 100%;
 +
    height: 100vh;
 +
      
 +
    background:
 +
    url("../images/intro.jpg") center no-repeat;
 +
    -webkit-background-size: cover;
 +
    background-size: cover;
 +
}
  
−
     if not(isJump):
+
.intro__inner {
 +
     width: 100%;
 +
    max-width: 880px;
 +
    margin: 0 auto;
  
−
      if keys[pygame.K_UP] and y > 5:
+
    text-align: center;
−
        y -= vel
+
}
  
−
      if keys[pygame.K_DOWN] and y < 500 - height - 15:
+
.intro__title {
−
        y += vel
+
    color: #fff;
 +
    font-size: 150px;
 +
    font-weight: 700;
 +
    text-transform: uppercase;
 +
    line-height: 1;
 +
   
 +
}
  
−
      if keys[pygame.K_SPACE]:
+
.intro__title:after {
−
        isJump = True
+
    content: "";
−
     else:
+
     display: block;
−
    if JumpCount >= -10:
+
    width: 80px;
−
        y -= JumpCount * 2
+
    height: 3px;
−
        JumpCount -= 1
+
    margin: 60px auto 60px;
  
−
    else:
+
    background-color: #fff;
−
        isJump = False
+
}
−
        JumpCount = 10
 
  
−
    win.fill((0,0,0))
+
.intro__suptitle {
−
     pygame.draw.rect(win, (0,0,255), (x, y, width, height))
+
     margin-bottom: 75px;
−
    pygame.display.update()
 
  
−
pygame.quit()
+
    font-family: 'Kaushan Script';
 +
    font-size: 72px;
 +
    color: #fff;
 +
}
 +
 
 +
/* Шапка */
 +
.header {
 +
    width: 100%;
 +
    padding-top: 30px;
 +
 
 +
    position: absolute;
 +
    top: 0;
 +
    left: 0;
 +
    right: 0;
 +
    z-index: 1000;
 +
}
 +
 
 +
.header__inner {
 +
    display: flex;
 +
    justify-content: space-between;
 +
    align-items: center;
 +
}
 +
 
 +
.header__logo {
 +
    font-size: 45px;
 +
    font-weight: 700;
 +
    color: #fff;
 +
}
 +
 
 +
/* Навигация */
 +
.nav {
 +
    font-size: 14px;
 +
    text-transform: uppercase;
 +
}
 +
 
 +
.nav__link {
 +
    display: inline-block;
 +
    vertical-align: top;
 +
    margin: 0 10px;
 +
    position: relative;
 +
 
 +
    color: #fff;
 +
    text-decoration: none;
 +
 
 +
    transition: color .1s linear;
 +
}
 +
 
 +
.nav__link:after {
 +
    content: "";
 +
    display: block;
 +
    width: 100%;
 +
    height: 3px;
 +
    display: none;
 +
 
 +
    background-color: #fce38a;
 +
 
 +
    position: absolute;
 +
    top: 100%;
 +
    left: 0;
 +
    z-index: 1;
 +
}
 +
 
 +
.nav__link:hover {
 +
    color: #fce38a;
 +
}
 +
 
 +
.nav__link:hover:after {
 +
    display: block;
 +
}
 +
 
 +
/* Кнопки */
 +
.btn {
 +
    display: inline-block;
 +
    vertical-align: top;
 +
    padding: 8px 30px;
 +
 
 +
    border: 3px solid #fff;
 +
 
 +
    font-size: 17px;
 +
    font-weight: 700;
 +
    color: #fff;
 +
    text-transform: uppercase;
 +
    text-decoration: none;
 +
}
 +
 
 +
.btn:hover {
 +
    background-color: #fff;
 +
    color: #333;
 +
}

Версия 20:45, 19 февраля 2022

<!DOCTYPE html> <html> 

   <head>
   <title>Albion</title>
       <meta charset="UTF-8">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">    
   
   <link rel="stylesheet" href="css/style.css">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"/>
   </head>
   <body>
   
   <header class="header">

               <nav class="nav">
                   <a class="nav__link" href="https://vk.com/noemotionthatpeace" target="_blank">Группа ВК</a>
                   <a class="nav__link" href="https://www.donationalerts.com/r/forgottenshadow" target="_blank">Написать заявку в клан</a>
                   <a class="nav__link" href="https://www.youtube.com/channel/UC2b4MQv4mjOBbzpFtDEC8wQ" target="_blank">Ютуб-канал нашего лидера</a>
               </nav>

   </header>

Добро пожаловать!

Welcome to Albion

               <a class="btn" href="#" target="_blank">Узнать о нас больше</a>

       <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
       <script src="app.js"></script> 
   </body>

</html>


body { 

   margin: 0;
   font-family: 'Montserrat', sans-serif;

   font-size: 15px;
   line-height: 1.6;
   color: #333;

}

  • ,
    before,
    after{
   box-sizing: border-box;

}

h1, h2, h3, h4, h5, h6 { 

   margin: 0;

}

/* Контейнер */ .container { 

   width: 100%;
   max-width: 1200px;
   margin: 0 auto;

}

/* Интро */

.intro { 

   display: flex;
   flex-direction: column;
   justify-content: center;
   width: 100%;
   height: 100vh;
   
   background: 
   url("../images/intro.jpg") center no-repeat;
   -webkit-background-size: cover;
   background-size: cover;

}

.intro__inner { 

   width: 100%;
   max-width: 880px;
   margin: 0 auto;

   text-align: center;

}

.intro__title { 

   color: #fff;
   font-size: 150px;
   font-weight: 700;
   text-transform: uppercase;
   line-height: 1;

}

.intro__title:after { 

   content: "";
   display: block;
   width: 80px;
   height: 3px;
   margin: 60px auto 60px;

   background-color: #fff;

}

.intro__suptitle { 

   margin-bottom: 75px;

   font-family: 'Kaushan Script';
   font-size: 72px;
   color: #fff;

}

/* Шапка */ .header { 

   width: 100%;
   padding-top: 30px;

   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   z-index: 1000;

}

.header__inner { 

   display: flex;
   justify-content: space-between;
   align-items: center;

}

.header__logo { 

   font-size: 45px;
   font-weight: 700;
   color: #fff;

}

/* Навигация */ .nav { 

   font-size: 14px;
   text-transform: uppercase;

}

.nav__link { 

   display: inline-block;
   vertical-align: top;
   margin: 0 10px;
   position: relative;

   color: #fff;
   text-decoration: none;

   transition: color .1s linear;

}

.nav__link:after { 

   content: "";
   display: block;
   width: 100%;
   height: 3px;
   display: none;

   background-color: #fce38a;

   position: absolute;
   top: 100%;
   left: 0;
   z-index: 1;

}

.nav__link:hover { 

   color: #fce38a;

}

.nav__link:hover:after { 

   display: block;

}

/* Кнопки */ .btn { 

   display: inline-block;
   vertical-align: top;
   padding: 8px 30px;

   border: 3px solid #fff;

   font-size: 17px;
   font-weight: 700;
   color: #fff;
   text-transform: uppercase;
   text-decoration: none;

}

.btn:hover { 

   background-color: #fff;
   color: #333;

}

Источник — «http://c91028cm.beget.tech/index.php?title=Текст_программы&oldid=366»