hero

ElizabethBil · Oct 4, 2023 · d71a9f3 · d71a9f3
1 parent ad05344
commit d71a9f3
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 9 deletions.
diff --git a/src/css/base.css b/src/css/base.css
@@ -117,7 +117,7 @@ main {
   font-family: 'Manrope', sans-serif;
   font-size: 32px;
   font-weight: 500;
-  line-height: 1.38em;
+  line-height: 1.38;
   letter-spacing: -0.03em;
 }
 

diff --git a/src/css/hero.css b/src/css/hero.css
@@ -50,6 +50,10 @@
   text-transform: uppercase;
 }
 
+.hero-button-link {
+  display: flex;
+}
+
 .hero-svg {
   margin-left: 10px;
 }
@@ -143,15 +147,40 @@
     margin-top: 94px;
 }
 
+.hero-title {
+  width: 518px;
+}
+
 .hero-img {
   margin: 0;
 }
 
 .hero-svg-star {
-
+  top: 14px;
+}
+
+.hero-elipse {
+
 }
 
 }
 
 @media screen and (min-width: 1440px) {
+
+.hero-picture-btn {
+  margin-top: 66px;
+}
+
+.hero-title {
+        font-size: 64px;
+        line-height: 1.16;
+        letter-spacing: -0.03em;
+        width: 626px;
+  }
+
+    .hero-svg-star {
+      top: 66px;
+    }
+
+
 }
diff --git a/src/partials/hero.html b/src/partials/hero.html
@@ -8,13 +8,15 @@ <h1 class="hero-title">
           >artistry in every stitch.
         </h1>
         <button class="hero-button">
-          <p class="hero-btn-text">Order</p>
-          <svg class="hero-svg" width="26px" height="13px">
-            <use
-              class="hero-send-arrow"
-              href="./img/icons.svg#icon-arrow"
-            ></use>
-          </svg>
+          <a href="./index.html#order-section" class="hero-button-link">
+            <p class="hero-btn-text">Order</p>
+            <svg class="hero-svg" width="26px" height="13px">
+              <use
+                class="hero-send-arrow"
+                href="./img/icons.svg#icon-arrow"
+              ></use>
+            </svg>
+          </a>
         </button>
       </div>