From ebcfb8a5138b7155fa71445d42d4d2fbfdee5f51 Mon Sep 17 00:00:00 2001 From: Oleksii Verbytskyi Date: Tue, 15 Aug 2023 10:05:16 +0300 Subject: [PATCH] optimize styles --- src/sass/layout/_about.scss | 48 +++++++++++++------------------ src/sass/layout/_footer.scss | 17 +++-------- src/sass/layout/_hero.scss | 3 +- src/sass/layout/_testimonial.scss | 3 +- 4 files changed, 26 insertions(+), 45 deletions(-) diff --git a/src/sass/layout/_about.scss b/src/sass/layout/_about.scss index b49f4e7..fe52dc4 100644 --- a/src/sass/layout/_about.scss +++ b/src/sass/layout/_about.scss @@ -16,14 +16,14 @@ &__btn { border-radius: 15px; background: #00A0B1; - padding: 14px 19px; + padding: 14px 18px; margin-top: 26px; - } - &__btn:hover { - box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.1), - 0px 1px 2px rgba(0, 0, 0, 0.08), - 0px 2px 2px rgba(0, 0, 0, 0.12); + &:hover { + box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.1), + 0px 1px 2px rgba(0, 0, 0, 0.08), + 0px 2px 2px rgba(0, 0, 0, 0.12); + } } } @@ -32,18 +32,18 @@ border-radius: 15px; box-shadow: 0px 60px 100px -39px rgba(0, 0, 0, 0.15); overflow: hidden; -} -.img__item:first-child { - min-width: 394px; -} + &:first-child { + min-width: 394px; + } -.img__item:last-child { - min-width: 259px; -} + &:last-child { + min-width: 259px; + } -.img__item:not(:last-child) { - margin-right: 41px; + &:not(:last-child) { + margin-right: 41px; + } } .content { @@ -53,12 +53,10 @@ &__title { color: #363636; - /* Headings/H2 600 */ font-family: Montserrat, sans-serif; font-size: 67px; - font-style: normal; font-weight: 600; - line-height: calc(72 / 67); /* 107.463% */ + line-height: 1.074; margin-top: 24px; } @@ -66,20 +64,16 @@ color: #00A0B1; font-family: Montserrat, sans-serif; font-size: 28px; - font-style: normal; font-weight: 600; - line-height: calc(32 / 28); /* 114.286% */ + line-height: 1.143; } &__text { color: #767681; - font-feature-settings: 'clig' off, 'liga' off; - /* Main Text/P1 400 */ font-family: Lato, sans-serif; font-size: 16px; - font-style: normal; font-weight: 400; - line-height: calc(24 / 16); /* 150% */ + line-height: 1.5; margin-top: 24px; } } @@ -87,11 +81,9 @@ .btn { width: 143px; color: #FFF; - font-feature-settings: 'clig' off, 'liga' off; font-family: Montserrat, sans-serif; font-size: 16px; - font-style: normal; font-weight: 600; - line-height: calc(24 / 16); /* 150% */ + line-height: 1.5; cursor: pointer; -} \ No newline at end of file +} diff --git a/src/sass/layout/_footer.scss b/src/sass/layout/_footer.scss index a393ba7..aab0d37 100644 --- a/src/sass/layout/_footer.scss +++ b/src/sass/layout/_footer.scss @@ -1,23 +1,19 @@ .footer { - &__container { + &__container, + &__list, + &__item, + &__subscribe { width: 100%; } &__list { - width: 100%; display: flex; flex-direction: column; background-color: #00A0B1; - //align-items: center; - //justify-content: center; padding: 0; margin: 0; } - &__item { - width: 100%; - } - &__subscribe { margin: 0 auto; display: flex; @@ -100,7 +96,6 @@ min-width: 106px; color: #FFF; font-feature-settings: 'clig' off, 'liga' off; - /* Main Text/P1 400 */ font-family: Lato, sans-serif; font-size: 16px; font-style: normal; @@ -144,15 +139,11 @@ box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.08), 0px 2px 2px rgba(0, 0, 0, 0.12); - } &__btn:active { box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.08), 0px 2px 2px rgba(0, 0, 0, 0.12); - } - - } \ No newline at end of file diff --git a/src/sass/layout/_hero.scss b/src/sass/layout/_hero.scss index 626bfe6..6d9ff2f 100644 --- a/src/sass/layout/_hero.scss +++ b/src/sass/layout/_hero.scss @@ -1,7 +1,6 @@ .main { margin: 0 auto; - //background-color: collection-color(banner-bg-color); - background-image: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), url("../images/hero/background.jpg"); + background-image: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), url("../images/hero/background.jpg"); @include background-pos(); height: 890px; diff --git a/src/sass/layout/_testimonial.scss b/src/sass/layout/_testimonial.scss index a8d77f1..d1e519d 100644 --- a/src/sass/layout/_testimonial.scss +++ b/src/sass/layout/_testimonial.scss @@ -1,5 +1,6 @@ .testimonial { margin-top: 120px; + &__list { display: flex; flex-wrap: wrap; @@ -12,7 +13,6 @@ flex-basis: calc(100% / 3 - 30px); margin-left: 30px; margin-top: 30px; - } &__container { @@ -43,5 +43,4 @@ margin-top: 12px; padding: 0 140px; } - } \ No newline at end of file