diff --git a/public/sass/main.scss b/public/sass/main.scss index d15dcc9..0f20c25 100644 --- a/public/sass/main.scss +++ b/public/sass/main.scss @@ -28,7 +28,6 @@ @import "partials/best-way"; @import "partials/paragraphs"; -@import "partials/headings"; @import "partials/nav"; diff --git a/public/sass/modules/_icon-styles.scss b/public/sass/modules/_icon-styles.scss index 8964d70..18b16f1 100644 --- a/public/sass/modules/_icon-styles.scss +++ b/public/sass/modules/_icon-styles.scss @@ -8,16 +8,6 @@ font-weight: normal; font-style: normal; } -@font-face { - font-family: 'icomoon'; - src:url('fonts/icomoon.eot?log50y'); - src:url('fonts/icomoon.eot?#iefixlog50y') format('embedded-opentype'), - url('fonts/icomoon.ttf?log50y') format('truetype'), - url('fonts/icomoon.woff?log50y') format('woff'), - url('fonts/icomoon.svg?log50y#icomoon') format('svg'); - font-weight: normal; - font-style: normal; -} %icon-fonts { font-family: 'icomoon'; @@ -115,10 +105,7 @@ $icons: (box "\e600") (flask "\e601") (phone "\e603") (mail "\e604") (location " font-size: 2em; } // // App Reviews -.icon-quotes { - // margin: 0 auto; - color: $color-text-light; -} + // // App Support // .icon-location:before { // content: "\e605"; @@ -129,14 +116,7 @@ $icons: (box "\e600") (flask "\e601") (phone "\e603") (mail "\e604") (location " // .icon-mail:before { // content: "\e604"; // } -.focus-arrow:before { - content: " "; - display: inline-block; - width: 42px; - height: 83px; - background-image: url("../assets/arrow.svg"); - background-repeat: no-repeat; -} + diff --git a/public/sass/partials/_carousel.scss b/public/sass/partials/_carousel.scss index bcdd6d9..dc89c41 100644 --- a/public/sass/partials/_carousel.scss +++ b/public/sass/partials/_carousel.scss @@ -11,9 +11,9 @@ // carousel dots ol { position: absolute; - width: 20%; + width: 30%; top: 0; - right: 40%; + right: 32%; text-align: center; @media screen and (min-width: 50em) { width: 1%; @@ -22,13 +22,19 @@ } .dot { display: inline-block; - margin: 0.25em; + margin: 0.25em 0.5em; padding: 0; border: 1px solid $color-link-button-background; border-radius: 50%; height: 0.5em; width: 0.5em; background-color: transparent; + &:first-child { + margin-left: 0.75em; + @media screen and (min-width: 50em) { + margin-left: 0; + } + } &.active { background-color: $color-link-button-background; } diff --git a/public/sass/partials/_headings.scss b/public/sass/partials/_headings.scss deleted file mode 100644 index 804f498..0000000 --- a/public/sass/partials/_headings.scss +++ /dev/null @@ -1,20 +0,0 @@ -h2 { - .why-choose & { - font: $head-big-light-font; - text-align: center; - font-size: 150%; - color: $color-text-light; - } -} -h4 { - .why-choose & { - font: $head-x-small-light-font; - padding-top: 0.5em; - padding-bottom: 1em; - text-align: center; - color: $color-text-light; - @media screen and (min-width: 50em) { - padding-bottom: 3em; - } - } -} \ No newline at end of file diff --git a/public/sass/partials/_paragraphs.scss b/public/sass/partials/_paragraphs.scss index 819d3a5..920ce64 100644 --- a/public/sass/partials/_paragraphs.scss +++ b/public/sass/partials/_paragraphs.scss @@ -18,10 +18,6 @@ h1 { } h2 { - .why-choose & { - text-align: center; - font-size: 150%; - } .feature-image-wrapper & { color: $color-text-light; font: $head-big-medium-font; diff --git a/public/sass/partials/_section.scss b/public/sass/partials/_section.scss index 631aa6a..4d632d3 100644 --- a/public/sass/partials/_section.scss +++ b/public/sass/partials/_section.scss @@ -1,21 +1,60 @@ .why-choose { - // position: relative; + padding-bottom: 2em; h2 { margin-top: 1em; + font: $head-big-light-font; + font-size: 150%; + color: $color-text-light; + text-align: center; } - .img-carousel { - position: relative; - margin: 0 auto; + h4 { + padding-top: 0.5em; + padding-bottom: 1em; + font: $head-x-small-light-font; + color: $color-text-light; + text-align: center; @media screen and (min-width: 50em) { - width: 80%; + padding-bottom: 3em; } } + .icon-quotes { + color: $color-text-light; + } .sm-semicircular-eclipse-border { margin: 0 auto; .icon-quotes { margin-top: 1em; } } + .arrow-position-wrapper { + position: relative; + width: 50%; + margin: 0 25%; + } + .focus-arrow { + position: absolute; + bottom: 0; + right: -3em; + @media screen and (min-width: 50em) { + bottom: 1.5em; + right: 5em; + } + } + .focus-arrow:before { + content: " "; + display: inline-block; + width: 42px; + height: 83px; + background-image: url("../assets/arrow.svg"); + background-repeat: no-repeat; + } + .img-carousel { + position: relative; + margin: 0 auto; + @media screen and (min-width: 50em) { + width: 80%; + } + } } .amazing-features { @@ -36,18 +75,4 @@ } } -.arrow-position-wrapper { - position: relative; - width: 50%; - margin: 0 25%; - .focus-arrow { - position: absolute; - bottom: 0; - right: -3em; - @media screen and (min-width: 50em) { - bottom: 1.5em; - right: 5em; - } - } -}