small fixes

mate-academy · Oct 21, 2024 · fded13c · fded13c
1 parent 13a9ad0
commit fded13c
Show file tree

Hide file tree

Showing 20 changed files with 106 additions and 103 deletions.
diff --git a/src/index.html b/src/index.html
@@ -11,15 +11,35 @@
       content="width=device-width, initial-scale=1.0"
     />
     <title>Strategic Agency - Air</title>
-    <link rel="icon" type="image/png"
-    href="./images/icons/favicon/favicon-48x48.png" sizes="48x48" />
-    <link rel="icon" type="image/svg+xml"
-    href="./images/icons/favicon/favicon.svg" />
-    <link rel="shortcut icon" href="./images/icons/favicon/favicon.ico" />
-    <link rel="apple-touch-icon" sizes="180x180"
-    href="./images/icons/favicon/apple-touch-icon.png" />
-    <meta name="apple-mobile-web-app-title" content="Air" />
-    <link rel="manifest" href="./images/icons/favicon/site.webmanifest" />
+    <link
+      rel="icon"
+      type="image/png"
+      href="./images/icons/favicon/favicon-48x48.png"
+      sizes="48x48"
+    />
+    <link
+      rel="icon"
+      type="image/svg+xml"
+      href="./images/icons/favicon/favicon.svg"
+    />
+    <link
+      rel="shortcut icon"
+      href="./images/icons/favicon/favicon.ico"
+    />
+    <link
+      rel="apple-touch-icon"
+      sizes="180x180"
+      href="./images/icons/favicon/apple-touch-icon.png"
+    />
+    <meta
+      name="apple-mobile-web-app-title"
+      content="Air"
+    />
+
+    <link
+      rel="manifest"
+      href="./images/icons/favicon/site.webmanifest"
+    />
 
     <link
       rel="preconnect"
@@ -128,7 +148,7 @@ <h1 class="header__title">Strategic Agency</h1>
               challenges.
             </p>
             <a
-              href="#"
+              href="#expertise"
               class="button header__button"
             >
               Learn more

diff --git a/src/styles/blocks/about.scss b/src/styles/blocks/about.scss
@@ -2,12 +2,7 @@
   &__content {
     @include page-grid;
 
-    padding-block: 120px;
-
-    // display: flex;
-    // flex-direction: column;
-    // align-items: center;
-    // justify-content: center;
+    padding-block: 7.5rem;
   }
 
   &__title {
@@ -16,15 +11,14 @@
 
   &__descr {
     grid-column: 1/-1;
-
     font-size: 22px;
     line-height: 33px;
     font-weight: 600;
     text-align: center;
     color: $text-regular-color;
 
     @include on-tablet {
-      font-size: 24px;
+      font-size: 1.5rem;
       line-height: 36px;
     }
 

diff --git a/src/styles/blocks/aside.scss b/src/styles/blocks/aside.scss
@@ -27,17 +27,15 @@
     top: 0;
     z-index: 1;
     background-color: $bg-dark;
-    margin-bottom: 32px;
-    padding: 48px 0;
+    margin-bottom: 2rem;
+    padding: 1.5rem 0;
     display: flex;
     justify-content: flex-start;
-    gap: 32px;
+    gap: 2rem;
     align-items: center;
 
-    &__icons {
-      display: flex;
-      flex-direction: row;
-      gap: 24px;
+    @include on-tablet {
+      padding-block: 3rem;
     }
 
     &__logo {
@@ -46,28 +44,16 @@
   }
 
   &__nav {
-    margin-bottom: 40px;
+    margin-bottom: 2.5rem;
   }
 
   &__phone-number {
     display: block;
-    margin-bottom: 16px;
-    color: $text-light-color;
-    text-decoration: none;
-    font-size: 16px;
-    line-height: 27px;
-  }
 
-  &__book-a-test {
     color: $text-light-color;
     text-decoration: none;
-    display: block;
-    width: fit-content;
-    font-size: 12px;
-    line-height: 16px;
-    letter-spacing: 2px;
-    padding-bottom: 7px;
-    border-bottom: 1px solid $text-light-color;
+    font-size: 1rem;
+    line-height: 27px;
   }
 }
 

diff --git a/src/styles/blocks/contact-info.scss b/src/styles/blocks/contact-info.scss
@@ -1,19 +1,19 @@
 .contact-info {
   display: flex;
   flex-direction: column;
-  gap: 40px;
+  gap: 2.5rem;
 
   &__title {
     text-transform: uppercase;
     opacity: 0.5;
     font-size: 13px;
     font-weight: 700;
     letter-spacing: $letter-spacing;
-    margin-bottom: 8px;
+    margin-bottom: 0.5rem;
   }
 
   &__link {
-    font-size: 24px;
+    font-size: 1.5rem;
     line-height: 36px;
     transition: color $effect-duration;
     &:hover {
@@ -26,7 +26,7 @@
     align-items: center;
     flex-direction: row;
     gap: 2rem;
-    padding-top: 8px;
+    padding-top: 0.5rem;
   }
 
   &__icon {

diff --git a/src/styles/blocks/expertise.scss b/src/styles/blocks/expertise.scss
@@ -1,6 +1,6 @@
 .expertise {
   background-color: #fff;
-  padding-block: 72px;
+  padding-block: 4.5rem;
   border-radius: $border-radius-big;
 
   &__content {
@@ -11,7 +11,7 @@
 
   &__cards {
     display: flex;
-    gap: 56px;
+    gap: 3.5rem;
     flex-direction: column;
     justify-content: center;
 

diff --git a/src/styles/blocks/footer.scss b/src/styles/blocks/footer.scss
@@ -1,8 +1,8 @@
 .footer {
   background-color: $bg-dark;
   color: $text-light-color;
-  padding-top: 72px;
-  padding-bottom: 80px;
+  padding-top: 4.5rem;
+  padding-bottom: 5rem;
   margin-top: -$border-radius-big;
   border-top-right-radius: $border-radius-big;
   border-top-left-radius: $border-radius-big;
@@ -15,13 +15,13 @@
 
   &__title {
     color: $text-light-color;
-    font-size: 32px;
+    font-size: 2rem;
     line-height: 42px;
     font-weight: 600;
-    margin-bottom: 48px;
+    margin-bottom: 3rem;
 
     @include on-tablet {
-      line-height: 48px;
+      line-height: 3rem;
     }
   }
 
@@ -30,7 +30,7 @@
     display: flex;
     flex-direction: column;
     align-items: flex-start;
-    margin-bottom: 80px;
+    margin-bottom: 5rem;
 
     @include on-tablet {
       grid-column: 1/5;
@@ -48,22 +48,22 @@
   &__form {
     display: flex;
     flex-direction: column;
-    margin-bottom: 80px;
+    margin-bottom: 5rem;
 
     @include on-tablet {
-      margin-bottom: 120px;
+      margin-bottom: 7.5rem;
     }
 
     @include on-desktop {
       grid-column: 1/6;
-      margin-bottom: 104px;
+      margin-bottom: 6.5rem;
     }
   }
 
   &__contacts {
     @include on-desktop {
       grid-column: 7/12;
-      margin-bottom: 104px;
+      margin-bottom: 6.5rem;
     }
   }
 
@@ -72,10 +72,10 @@
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    gap: 48px;
+    gap: 3rem;
 
     @include on-tablet {
-      gap: 24px;
+      gap: 1.5rem;
     }
 
     @include on-desktop {

diff --git a/src/styles/blocks/form.scss b/src/styles/blocks/form.scss
@@ -2,8 +2,8 @@
   &__inputs {
     display: flex;
     flex-direction: column;
-    gap: 40px;
-    margin-bottom: 56px;
+    gap: 2.5rem;
+    margin-bottom: 3.5rem;
   }
 
   &__input {

diff --git a/src/styles/blocks/header.scss b/src/styles/blocks/header.scss
@@ -11,13 +11,13 @@
 
       grid-column: 1/-1;
       padding-bottom: 205px;
-      padding-top: 112px;
+      padding-top: 7rem;
     }
   }
 
   &__info {
-    padding-top: 48px;
-    padding-bottom: calc(48px);
+    padding-top: 3rem;
+    padding-bottom: 3rem;
 
     @include on-desktop {
       grid-column: 1/5;
@@ -29,14 +29,14 @@
     font-weight: 600;
     line-height: 62px;
     letter-spacing: -2px;
-    margin-bottom: 32px;
+    margin-bottom: 2rem;
   }
 
   &__descr {
     font-size: 18px;
     line-height: 27px;
     font-weight: 400;
-    margin-bottom: 72px;
+    margin-bottom: 4.5rem;
   }
 
   & .menu__nav {

diff --git a/src/styles/blocks/icon.scss b/src/styles/blocks/icon.scss
@@ -1,17 +1,14 @@
 .icon {
   display: block;
-  width: 24px;
-  height: 24px;
+  width: 1.5rem;
+  height: 1.5rem;
   background-size: cover;
   background-position: center;
   transition: transform $effect-duration;
 
   &--menu {
     background-image: url('../images/icons/icon-menu.svg');
 
-    // &:hover {
-    //   background-image: url("../images/icons/icon-menu-hover.svg");
-    // }
     @include on-desktop {
       display: none;
     }

diff --git a/src/styles/blocks/menu.scss b/src/styles/blocks/menu.scss
@@ -2,21 +2,21 @@
   &__list {
     display: flex;
     flex-direction: row;
-    gap: 48px;
+    gap: 3rem;
   }
 
   &__list--footer {
     flex-direction: column;
-    gap: 24px;
+    gap: 1.5rem;
 
     @include on-tablet {
       flex-direction: row;
-      gap: 40px;
+      gap: 2.5rem;
     }
 
     @include on-desktop {
       flex-direction: row;
-      gap: 64px;
+      gap: 4rem;
     }
   }
 

diff --git a/src/styles/blocks/page.scss b/src/styles/blocks/page.scss
@@ -1,5 +1,6 @@
 html {
   scroll-behavior: smooth;
+  font-size: 16px;
 }
 
 .page__body {

diff --git a/src/styles/blocks/section-title.scss b/src/styles/blocks/section-title.scss
@@ -1,6 +1,6 @@
 .section-title {
   margin: 0;
-  margin-bottom: 24px;
+  margin-bottom: 1.5rem;
   font-size: 44px;
   line-height: 53px;
   font-weight: 600;
@@ -9,8 +9,8 @@
   font-family: $headers-font;
 
   &--small {
-    font-size: 32px;
-    line-height: 48px;
+    font-size: 2rem;
+    line-height: 3rem;
   }
 
   &--align--left {
@@ -27,5 +27,5 @@
   letter-spacing: $letter-spacing;
   color: $text-subheaders-color;
   font-weight: 700;
-  margin-bottom: 16px;
+  margin-bottom: 1rem;
 }