2 Commits f31566860c ... 8ede43f816

Author SHA1 Message Date
  123 8ede43f816 Merge remote-tracking branch 'refs/remotes/origin/master' 7 months ago
  123 6b2e0f1cb3 фотки сломались, нужно починить! 7 months ago
3 changed files with 273 additions and 63 deletions
  1. BIN
      .DS_Store
  2. 202 11
      index.html
  3. 71 52
      style.css

BIN
.DS_Store


+ 202 - 11
index.html

@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 
+
 <head>
     <link rel="stylesheet" href="style.css">
     <meta charset="UTF-8">
@@ -9,17 +10,18 @@
     <title>Document</title>
 </head>
 
+
 <body>
     <section id="cover">
         <header>
             <div class="container header">
-                <img src="images/logo 1.svg" alt="">
+                <img src="FitoNyashki/images/logo 1.svg" alt="">
                 <nav>
                     <ul class="nav_menu">
                         <li class="nav_item"><a href="">О нас</a></li>
-                        <li class="nav_item"><a href="">Блог</a></li>
+                        <li class="nav_item"><a href="">Блок</a></li>
                         <li class="nav_item"><a href="">Каталог</a></li>
-                        <li class="nav_item"><a href="">Контакт</a></li>
+                        <li class="nav_item"><a href="">Контакты</a></li>
 
                     </ul>
                 </nav>
@@ -39,15 +41,204 @@
             </div>
         </div>
     </section>
-
-    <section id="second">
-        <div class="v10_52">
-            <div class="v4_8"></div><span class="v5_7">О нас</span><span class="v10_7">Наша команда из опытных специалистов
-                выращивает здоровые растения, которые будут радовать вас долгие года. Сопровождаем каждого клиента по
-                вопросам ухода, а при покупке даем памятку по растению</span>
+    <section>
+        <div class="container us">
+            <img src="FitoNyashki/images/about.png" alt="О нас">
+            <div class="content">
+                <h2>
+                    О нас
+                </h2>
+                <p>
+                    Наша команда 
+                </p>
+            </div>
         </div>
     </section>
-
+    <section id="cotolog">
+        <div class="container">
+            <div class="cotolog_d">
+                <h2>
+                    Каталог
+                </h2>
+            </div>
+            <div class="cards">
+                <div class="card">
+                    <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
+                    <div class="card_d">
+                        <p>
+                            Растение 1
+                        </p>
+                        <p>
+                            1000₽
+                        </p>
+                    </div>
+                    <button>
+                        Заказать
+                    </button>
+                </div>
+                <div class="card">
+                    <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
+                    <div class="card_d">
+                        <p>
+                            Растение 2
+                        </p>
+                        <p>
+                            1000₽
+                        </p>
+                    </div>
+                    <button>
+                        Заказать
+                    </button>
+                </div>
+                <div class="card">
+                    <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
+                    <div class="card_d">
+                        <p>
+                            Растение 3
+                        </p>
+                        <p>
+                            1000₽
+                        </p>
+                    </div>
+                    <button>
+                        Заказать
+                    </button>
+                </div>
+                <div class="card">
+                    <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
+                    <div class="card_d">
+                        <p>
+                            Растеня 4
+                        </p>
+                        <p>
+                            1000₽
+                        </p>
+                    </div>
+                    <button>
+                        Заказать
+                    </button>
+                </div>
+                <div class="card">
+                    <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
+                    <div class="card_d">
+                        <p>
+                            Растение 5
+                        </p>
+                        <p>
+                            1000₽
+                        </p>
+                    </div>
+                    <button>
+                        Заказать
+                    </button>
+                </div>
+                <div class="card">
+                    <img src="FitoNyashki/images/chris-lee-70l1tDAI6rM-unsplash 1.png" alt="">
+                    <div class="card_d">
+                        <p>
+                            Растение 6
+                        </p>
+                        <p>
+                            1000₽
+                        </p>
+                    </div>
+                    <button>
+                        Заказать
+                    </button>
+                </div>
+                
+        </div>
+    </section>
+    <section id="guide">
+        <div class="container">
+            <div class="guide_content">
+                <div class="guide_form">
+                    <h2>
+                        Получите гайд по любому растению бесплатно
+                    </h2>
+                    <form action="">
+                        <input type="text" placeholder="Имя"> 
+                        <input type="text" placeholder="Номер"> 
+                    </form>
+                    <button>Получить</button>
+                </div>
+            </div>
+        </div>
+    </section>
+    <section id="block blockom">
+        <div class="container">
+            <div class="block_d">
+                <h2>
+                    Блок
+                </h2>
+                <p>
+                    Узнайте 
+                </p>
+            </div>
+            <div class="blocks">
+                <div class="block">
+                    <img src="FitoNyashki/images/news_card.png" alt="">
+                        <div class="block_d">
+                            <p>
+                                Как выбрать растение
+                            </p>
+                        </div>
+                </div>
+                <div class="block">
+                    <img src="FitoNyashki/images/news_card.png" alt="">
+                        <div class="block_d">
+                            <p>
+                                Как выбрать растение
+                            </p>
+                        </div>
+                </div>
+                <div class="block">
+                    <img src="FitoNyashki/images/news_card.png" alt="">
+                        <div class="block_d">
+                            <p>
+                                Как выбрать растение
+                            </p>
+                        </div>
+                </div>
+                <div class="block">
+                    <img src="FitoNyashki/images/news_card.png" alt="">
+                        <div class="block_d">
+                            <p>
+                                Как выбрать растение
+                            </p>
+                        </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <section id="svaz">
+        <div class="svaz1">
+            <div class="svaz_txt">
+                <h2>
+                    Оставайтесь с нами на связи
+                </h2>
+                <p>
+                    +79999999999
+                </p>
+                <p>
+                    Телеграм
+                </p>
+                <p>
+                    ВКонтакте
+                </p>
+            </div>
+        </div>
+    </section>
+    <footer>
+        <img src="FitoNyashki/images/logo 1.svg" alt="" style="width: 50px;">
+        <p>
+            Home plants
+        </p>
+        <p>
+            2024
+        </p>
+    </footer>
 </body>
 
-</html>
+
+</html>

+ 71 - 52
style.css

@@ -61,59 +61,78 @@ button:hover{
     align-items: center;
 }
 #cover{
-    background-image: url(images/main.png);
+    background-image: url(FitoNyashki/images/main.png);
     background-repeat: no-repeat;
     background-size: cover;
 }
-
-  .v10_52 {
+.us{
+    display:flex;
+    align-items: center;
+}
+.content{
+    margin-left: 70px;
+}
+h2{
+    font-size: 48px;
+}
+.card_d{
+    display: flex;
+    justify-content: space-between;
     width: 100%;
-    height: 669px;
-    background: url("../images/v10_52.png");
-    background-repeat: no-repeat;
-    background-position: center center;
-    background-size: cover;
-    opacity: 1;
-    position: absolute;
-    top: 900px;
-    left: 370px;
-    overflow: hidden;
-  }
-  .v4_8 {
-    width: 492px;
-    height: 669px;
-    background: url("images/v4_8.png");
-    background-repeat: no-repeat;
-    background-position: center center;
-    background-size: cover;
-    opacity: 1;
-    position: absolute;
-    top: 0px;
-    left: 0px;
-    overflow: hidden;
-  }
-  .v5_7 {
-    width: 166px;
-    color: rgba(0,0,0,1);
-    position: absolute;
-    top: 215px;
-    left: 570px;
-    font-family: Playfair Display;
-    font-weight: Regular;
-    font-size: 64px;
-    opacity: 1;
-    text-align: left;
-  }
-  .v10_7 {
-    width: 520px;
-    color: rgba(0,0,0,0.800000011920929);
-    position: absolute;
-    top: 317px;
-    left: 570px;
-    font-family: Inter;
-    font-weight: Regular;
-    font-size: 24px;
-    opacity: 1;
-    text-align: left;
-  }
-  
+}
+.cards{
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+.card{
+    width: 300px;
+    margin-bottom: 60px;
+}
+#guide{
+    background-image: url(FitoNyashki/images/form_bg.png);
+}
+.guide_content{
+    height: 40vh;
+}
+.guide_content{
+    display: flex;
+    align-items: center;
+}
+input{
+    height: 30px;
+    width: 240px;
+}
+.blocks{
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+.block{
+    margin-bottom: 60px;
+}
+
+.block_d:h2{
+    margin: 0px;
+}
+
+#svaz{
+    margin: 0;
+}
+.svaz1{
+    background-image: url(FitoNyashki/images/contact_img.png);
+    height: 52vh;
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+
+}
+.svaz_txt{
+    width: 650px;
+}
+footer{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}