diff --git a/.sass-lint.yml b/.sass-lint.yml index 7d6efe4da9..bd660f80db 100644 --- a/.sass-lint.yml +++ b/.sass-lint.yml @@ -1,5 +1,5 @@ files: - include: ./static/css/*.scss + include: ./static/**/*.scss options: merge-default-rules: true @@ -26,3 +26,4 @@ rules: space-after-comma: 2 url-quotes: 2 zero-unit: 2 + no-warn: 0 diff --git a/server/src/pages/homepage/view.js b/server/src/pages/homepage/view.js index 98729fbff0..173ec79037 100644 --- a/server/src/pages/homepage/view.js +++ b/server/src/pages/homepage/view.js @@ -2,448 +2,6 @@ const reactruntime = require("../../reactruntime"); const React = require("react"); const { Localized } = require("fluent-react/compat"); const { Footer } = require("../../footer-view.js"); -const style = ` - html, body { - padding: 0; - margin: 0; - font-family: -apple-system, BlinkMacSystemFont, "segoe ui", "helvetica neue", helvetica, ubuntu, roboto, noto, arial, sans-serif; - font-size: 12pt; - } - - .container { - max-width: 1160px; - padding: 40px 33px; - margin: 0 auto; - display: -ms-flexbox; - display: flex; - flex-basis: auto; - flex-grow: 1; - -ms-flex-align: center; - align-items: center; - -ms-flex-pack: end; - justify-content: space-between; - position: relative; - min-width: 0; - height: 100%; - } - - /* Navigation Bar */ - - nav { - height: 82px; - display: flex; - align-items: center; - background-color: #fff; - position: fixed; - width: 100%; - z-index: 1000; - box-shadow: rgba(0,0,0,0.09) 0px 3px 6px; - } - - .myshots-text { - cursor: pointer; - } - - .header-logo { - display: -ms-flexbox; - display: flex; - -ms-flex-align: end; - align-items: flex-end; - } - - .nav-links { - display: -ms-flexbox; - display: flex; - -ms-flex-align: end; - align-items: flex-end; - -ms-flex-pack: end; - justify-content: flex-end; - -ms-flex: 1; - flex: 1; - } - - .screenshots-logo { - background-image: url(../static/img/landing-Screenshot-logo.svg); - background-repeat: no-repeat; - background-size: contain; - height: 37px; - width: 390px; - position: relative; - } - - .nav-links a { - color: #4a4a4a; - text-decoration: none; - cursor: pointer; - } - - .nav-links a:first-child { - margin-right: 71px; - } - - /* Header Banner */ - - .banner { - background-color: #04d1e6; - background-image: url(../static/img/landing-screenshots_banner.svg); - background-repeat: no-repeat; - background-position: 60% 65%; - min-height: 587px; - display: flex; - align-items: center; - justify-content: flex-start; - padding-top: 82px; - } - - .banner-content { - width: 50%; - } - - .banner-content h1 { - color: #fff; - font-size: 3em; - font-weight: 400; - margin: 0 0 20px 0; - } - - .banner-content p { - color: #fff; - font-size: 1.3em; - padding-right: 80px; - line-height: 1.61; - margin: 0; - font-weight: 300; - } - - h2 { - color: #004c66; - font-size: 2.3em; - text-align: center; - margin: 29px 20px 22px 20px; - font-weight: 600; - line-height: 55px; - } - - .button { - border: 1px solid transparent; - border-radius: 3px; - cursor: pointer; - display: inline-block; - font-weight: 400; - height: 40px; - line-height: 40px; - outline: none; - position: relative; - text-align: center; - text-decoration: none; - transition: background .15s,width .15s; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - white-space: nowrap; - box-shadow: rgba(0,0,0,.09) 0px 6px 9px; - } - - .download-firefox { - display: -ms-flexbox; - -ms-flex-align: center; - align-items: center; - -ms-flex-pack: center; - justify-content: center; - color: #fff; - display: flex; - -ms-flex-direction: row; - flex-direction: row; - font-weight: 500; - height: 80px; - margin-top: 30px; - transition-duration: .25s; - transition-property: box-shadow,border; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - width: 260px; - } - - .button.primary { - background: #95E100; - color: #fff; - text-align: left; - } - - .download-firefox .button-icon { - background-image: url(../static/img/landing-small-firefox-logo.png); - background-position: 50%; - background-repeat: no-repeat; - background-size: 57px 59px; - -ms-flex: 0 0 57px; - flex: 0 0 57px; - height: 59px; - margin-right: 16px; - position: relative; - } - - .download-firefox .button-icon-badge { - background-image: url(../static/img/landing-download-icon.png); - background-size: 16px 16px; - background-color: #fff; - background-position: 50%; - background-repeat: no-repeat; - background-size: 16px; - border-radius: 50%; - bottom: 4px; - box-shadow: 0 2px 0 rgba(0,0,0,.2); - height: 16px; - padding: 6px; - position: absolute; - right: 2px; - transition-duration: .15s; - width: 16px; - } - - .download-firefox .button-title { - font-size: 24px; - font-weight: 600; - line-height: 1em; - margin-bottom: .25em; - } - - .download-firefox .button-description { - font-size: 18px; - font-weight: 300; - line-height: 1em; - } - - /* Instruction Sections */ - - section { - min-height: 650px; - display: flex; - align-items: center; - } - - section:nth-child(even) { - background-color: #f7fdfe; - } - - section .container{ - max-width: 1100px; - padding: 40px 63px; - } - - .section-content h3 { - font-size: 2.5em; - font-weight: 400; - margin: 0; - } - - .section-content .bold { - font-weight: 500; - } - - .section-content { - display: flex; - justify-content: flex-start; - width: 36%; - flex-direction: column; - color: #4a4a4a; - line-height: 1.61; - } - - .section-image { - display: flex; - justify-content: flex-end; - width: 50%; - height: auto; - background-size: contain; - } - - #section-1 .section-image { - background-image: url(../static/img/landing-screenshots_image_01.svg); - background-repeat: no-repeat; - background-position: 100% center; - height: 476px; - } - #section-2 .section-image { - background-image: url(../static/img/landing-screenshots_image_02.svg); - background-repeat: no-repeat; - background-position: 0% center; - height: 500px; - } - #section-3 .section-image { - background-image: url(../static/img/landing-screenshots_image_03.svg); - background-repeat: no-repeat; - background-position: 100% center; - height: 519px; - } - #section-4 .section-image { - background-image: url(../static/img/landing-screenshots_image_04.svg); - background-repeat: no-repeat; - background-position: 100% center; - height: 533px; - } - - #section-1 .section-content, - #section-2 .section-image, - #section-4 .section-content { - order: 1; - } - - #section-1 .section-image, - #section-2 .section-content, - #section-4 .section-image { - order: 2; - } - - /* Coming Soon Section */ - - #coming { - min-height: 350px; - } - - #coming .container{ - max-width: 840px; - padding: 40px 100px; - } - - .coming-content { - display: flex; - color: #4a4a4a; - flex-direction: column; - justify-content: flex-end; - width: 45%; - } - - .coming-content h3 { - font-size: 2em; - font-weight: 100; - margin: 0; - } - - .coming-content p { - font-size: .9em; - line-height: 1.61; - margin-bottom: 0; - } - - .coming-icons { - display: flex; - flex-direction: row; - justify-content: flex-start; - } - - .coming-icons span { - font-size: 2em; - margin: 0 33px; - color: #4a4a4a; - position: relative; - top: 16px; - } - - .coming-icons div { - width: 80px; - height: 80px; - background-repeat: no-repeat; - background-size: contain; - } - - .chrome-icon { - background-image: url(../static/img/landing-icon-chrome.svg); - } - - .screenshots-icon { - background-image: url(../static/img/landing-icon-screenshots.svg); - } - - /* Responsive */ - - @media (max-width: 768px) { - .nav-links { - display: none; - } - - .screenshots-logo { - max-width: 263px; - } - - .container { - text-align: center; - justify-content: center; - flex-direction: column; - } - - .banner { - background-image: url(../static/img/landing-screenshots_mobile.svg); - background-position: 100% 20%; - } - - .banner-content { - width: 100%; - max-width: 500px; - text-align: center; - } - - .banner-content p { - font-size: 1.2em; - padding-right: 0; - } - - .button { - margin-right: auto; - margin-left: auto; - } - - h2 { - font-size: 1.6em; - } - - section .container { - padding: 40px 33px; - } - - .section-content h3 { - font-size: 2em; - } - - .section-content { - order: 1 !important; - width: 100%; - max-width: 500px; - } - - .section-image { - order: 2 !important; - margin-top: 33px; - width: 90vw !important; - background-position: center center !important; - height: 90vw !important; - max-width: 500px; - max-height: 500px; - } - - #coming .container { - padding: 40px 33px; - } - - .coming-content { - width: 100%; - max-width: 300px; - margin-top: 40px; - } - - .coming-icons div { - width: 50px; - height: 50px; - } - - .coming-icons span { - top: 3px; - margin: 0 16px; - } - } -` class Head extends React.Component { @@ -467,8 +25,7 @@ class Head extends React.Component { - - + ); } @@ -527,6 +84,7 @@ class Body extends React.Component { +
@@ -537,6 +95,7 @@ class Body extends React.Component { { this.renderGetFirefox() }
+
diff --git a/static/css/frame.scss b/static/css/frame.scss index 00372bae90..152d500b56 100644 --- a/static/css/frame.scss +++ b/static/css/frame.scss @@ -160,7 +160,7 @@ @include flex-container(row, flex-start, center); select { - -moz-appearance: none; + -moz-appearance: none; //sass-lint:disable-line no-vendor-prefixes appearance: none; background-color: $light-default; background-image: url("/static/img/icon-dropdown.svg"); diff --git a/static/css/home.scss b/static/css/home.scss new file mode 100644 index 0000000000..f5cc629c2a --- /dev/null +++ b/static/css/home.scss @@ -0,0 +1,507 @@ +@import "partials/partials"; + +html, +body { + padding: 0; + margin: 0; + font-family: -apple-system, BlinkMacSystemFont, "segoe ui", "helvetica neue", helvetica, ubuntu, roboto, noto, arial, sans-serif; + font-size: 12pt; +} + +.container { + -ms-flex-align: center; + -ms-flex-pack: end; + align-items: center; + display: -ms-flexbox; + display: flex; + flex-basis: auto; + flex-grow: 1; + height: 100%; + justify-content: space-between; + margin: 0 auto; + max-width: 1160px; + min-width: 0; + padding: 40px 33px; + position: relative; +} + +/* Navigation Bar */ + +nav { + align-items: center; + background-color: #fff; + box-shadow: rgba(0, 0, 0, 0.09) 0 3px 6px; + display: flex; + height: 82px; + position: fixed; + width: 100%; + z-index: 1000; +} + +.myshots-text { + cursor: pointer; +} + +.header-logo { + -ms-flex-align: end; + align-items: flex-end; + display: -ms-flexbox; + display: flex; +} + +.nav-links { + -ms-flex-align: end; + -ms-flex-pack: end; + -ms-flex: 1; + align-items: flex-end; + display: -ms-flexbox; + display: flex; + flex: 1; + justify-content: flex-end; +} + +.screenshots-logo { + background-image: url("../img/landing-Screenshot-logo.svg"); + background-repeat: no-repeat; + background-size: contain; + height: 37px; + position: relative; + width: 390px; +} + +.nav-links a { + color: #4a4a4a; + cursor: pointer; + text-decoration: none; +} + +.nav-links a:first-child { + margin-right: 71px; +} + +/* Header Banner */ + +.banner-spacer { + height: 82px; +} + +.banner { + align-items: center; + background-color: #04d1e6; + display: flex; + justify-content: flex-start; + min-height: 587px; + position: relative; +} + +.banner .container { + z-index: 1; +} + +.banner-image { + background-image: url("../img/landing-screenshots_banner.svg"); + background-position: 75% center; + background-repeat: no-repeat; + position: absolute; + top: 0; + right: 0; + left: 0; + bottom: 0; + z-index: 0; +} + +.banner-content { + width: 50%; + min-width: 380px; +} + +.banner-content h1 { + color: #fff; + font-size: 3em; + font-weight: 400; + margin: 0 0 20px; +} + +.banner-content p { + color: #fff; + font-size: 1.3em; + font-weight: 300; + line-height: 1.61; + margin: 0; + padding-right: 80px; +} + +h2 { + color: #004c66; + font-size: 2.3em; + font-weight: 600; + line-height: 55px; + margin: 29px 20px 22px; + text-align: center; +} + +.button { + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + border-radius: 3px; + border: 1px solid transparent; + box-shadow: rgba(0, 0, 0, 0.09) 0 6px 9px; + cursor: pointer; + display: inline-block; + font-weight: 400; + height: 40px; + line-height: 40px; + outline: none; + position: relative; + text-align: center; + text-decoration: none; + transition: background 0.15s, width 0.15s; + user-select: none; + white-space: nowrap; +} + +.download-firefox { + -moz-user-select: none; + -ms-flex-align: center; + -ms-flex-direction: row; + -ms-flex-pack: center; + -ms-user-select: none; + -webkit-user-select: none; + align-items: center; + color: #fff; + display: -ms-flexbox; + display: flex; + flex-direction: row; + font-weight: 500; + height: 80px; + justify-content: center; + margin-top: 30px; + transition-duration: 0.25s; + transition-property: box-shadow, border; + user-select: none; + width: 260px; +} + +.button.primary { + background: #30e60b; + color: #fff; + text-align: left; + + &:hover { + background: #20c60b; + } + + &:active { + background: #10b60b; + box-shadow: rgba(0, 0, 0, 0.09) 0 3px 4px; + } + +} + +.download-firefox .button-icon { + -ms-flex: 0 0 57px; + background-image: url("../img/landing-small-firefox-logo@2x.png"); + background-position: 50%; + background-repeat: no-repeat; + background-size: 57px 59px; + flex: 0 0 57px; + height: 59px; + margin-right: 16px; + position: relative; +} + +.download-firefox .button-icon-badge { + background-color: #fff; + background-image: url("../img/landing-download-icon@2x.png"); + background-position: 50%; + background-repeat: no-repeat; + background-size: 14px 14px; + border-radius: 50%; + bottom: 4px; + box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2); + height: 16px; + padding: 6px; + position: absolute; + right: 2px; + transition-duration: 0.15s; + width: 16px; +} + +.download-firefox .button-title { + font-size: 24px; + font-weight: 600; + line-height: 1em; + margin-bottom: 0.25em; +} + +.download-firefox .button-description { + font-size: 18px; + font-weight: 300; + line-height: 1em; +} + +/* Instruction Sections */ + +section { + align-items: center; + display: flex; + min-height: 600px; +} + +section:nth-child(even) { + background-color: #f7fdfe; +} + +section .container { + max-width: 1100px; + padding: 40px 63px; +} + +.section-content h3 { + font-size: 2.5em; + font-weight: 400; + margin: 0; +} + +.section-content .bold { + font-weight: 500; +} + +.section-content { + color: #4a4a4a; + display: flex; + flex-direction: column; + justify-content: flex-start; + line-height: 1.61; + width: 36%; +} + +.section-image { + background-size: contain; + display: flex; + height: auto; + justify-content: flex-end; + width: 50%; +} + +#section-1 .section-image { + background-image: url("../img/landing-screenshots_image_01.svg"); + background-position: 100% center; + background-repeat: no-repeat; + height: 476px; +} + +#section-2 .section-image { + background-image: url("../img/landing-screenshots_image_02.svg"); + background-position: 0% center; + background-repeat: no-repeat; + height: 500px; +} + +#section-3 .section-image { + background-image: url("../img/landing-screenshots_image_03.svg"); + background-position: 100% center; + background-repeat: no-repeat; + height: 519px; +} + +#section-4 .section-image { + background-image: url("../img/landing-screenshots_image_04.svg"); + background-position: 100% center; + background-repeat: no-repeat; + height: 533px; +} + +#section-1 .section-content, +#section-2 .section-image, +#section-4 .section-content { + order: 1; +} + +#section-1 .section-image, +#section-2 .section-content, +#section-4 .section-image { + order: 2; +} + + +/* Coming Soon Section */ + +#coming { + min-height: 350px; +} + +#coming .container { + max-width: 840px; + padding: 40px 100px; +} + +.coming-content { + color: #4a4a4a; + display: flex; + flex-direction: column; + justify-content: flex-end; + width: 45%; +} + +.coming-content h3 { + font-size: 2em; + font-weight: 100; + margin: 0; +} + +.coming-content p { + font-size: 0.9em; + line-height: 1.61; + margin-bottom: 0; +} + +.coming-icons { + display: flex; + flex-direction: row; + justify-content: flex-start; +} + +.coming-icons span { + color: #4a4a4a; + font-size: 2em; + margin: 0 33px; + position: relative; + top: 16px; +} + +.coming-icons div { + background-repeat: no-repeat; + background-size: contain; + height: 80px; + width: 80px; +} + + + +/* Responsive */ + +@media (max-width: 1120px) and (min-width: 769px) { + + .banner { + min-height: 500px; + } + + .banner-image { + top: 0; + background-size: 90% auto; + left: 0; + bottom: 0; + right: -10%; + } + + section { + min-height: 500px; + } +} + +@media (max-width: 768px) { + + .nav-links { + display: none; + } + + .screenshots-logo { + max-width: 90%; + margin: 0 auto; + position: relative; + top: 20px; + } + + .container { + flex-direction: column; + justify-content: center; + text-align: center; + } + + .banner { + background-image: url("../img/landing-screenshots_mobile.svg"); + background-repeat: no-repeat; + background-position: 100% 20%; + height: 320px; + } + + .banner-image { + display: none; + } + + .banner-spacer { + height: 60px; + } + + .banner-content { + max-width: 500px; + text-align: center; + width: 100%; + margin-top: 80px; + } + + .banner-content p { + font-size: 1.2em; + padding-right: 0; + } + + .button { + margin-right: auto; + margin-left: auto; + } + + h2 { + font-size: 1.6em; + } + + section { + min-height: 550px; + } + + section .container { + padding: 40px 33px; + } + + .section-content h3 { + font-size: 2em; + } + + .section-content { + max-width: 500px; + + order: 1 !important; + width: 100%; + } + + .section-image { + background-position: center center !important; + height: 90vw !important; + margin-top: 33px; + max-height: 500px; + max-width: 500px; + order: 2 !important; + width: 90vw !important; + } + + #coming .container { + padding: 40px 33px; + } + + .coming-content { + margin-top: 40px; + max-width: 300px; + width: 100%; + } + + .coming-icons div { + height: 50px; + width: 50px; + } + + .coming-icons span { + margin: 0 16px; + top: 3px; + } +} diff --git a/static/css/partials/_animations.scss b/static/css/partials/_animations.scss index 78f7950947..2023fbbd1d 100644 --- a/static/css/partials/_animations.scss +++ b/static/css/partials/_animations.scss @@ -24,6 +24,7 @@ 0% { transform: translateX(-40px); } + 100% { transform: translate(190px); } @@ -55,31 +56,31 @@ @keyframes pulse { 0% { - opacity: .3; + opacity: 0.3; transform: scale(1); } 70% { - opacity: .25; + opacity: 0.25; transform: scale(1.04); } 100% { - opacity: .3; + opacity: 0.3; transform: scale(1); } } @keyframes slide-left { - 0% { - opacity: 0; - transform: translate3d(160px, 0, 0); - } - - 100% { - opacity: 1; - transform: translate3d(0, 0, 0); - } + 0% { + opacity: 0; + transform: translate3d(160px, 0, 0); + } + + 100% { + opacity: 1; + transform: translate3d(0, 0, 0); + } } @keyframes bounce-in { diff --git a/static/css/partials/_base.scss b/static/css/partials/_base.scss index 42c2a9664d..0c33aec5f5 100644 --- a/static/css/partials/_base.scss +++ b/static/css/partials/_base.scss @@ -3,9 +3,8 @@ html { } *, -*:before, - -*:after { +*::before, +*::after { box-sizing: inherit; } @@ -34,5 +33,5 @@ blockquote { font-size: 12px; line-height: 16px; margin: 5px 0; - opacity: .7; + opacity: 0.7; } diff --git a/static/css/partials/_buttons.scss b/static/css/partials/_buttons.scss index 4be4317f5c..2afeeb597e 100644 --- a/static/css/partials/_buttons.scss +++ b/static/css/partials/_buttons.scss @@ -41,19 +41,19 @@ &.block-button { - @include respond-to("small") { - justify-content: flex-start; - font-size: 16px; - height: 72px; - margin-right: 10px; - padding: 0 5px; - } + @include respond-to("small") { + justify-content: flex-start; + font-size: 16px; + height: 72px; + margin-right: 10px; + padding: 0 5px; + } @include flex-container(row, center, center); box-sizing: border-box; - border: none; + border: 0; border-right: 1px solid $light-border; - box-shadow: none; + box-shadow: 0; border-radius: 0; flex-shrink: 0; font-size: 20px; diff --git a/static/css/partials/_footer.scss b/static/css/partials/_footer.scss index f0b60922e5..28971110f5 100644 --- a/static/css/partials/_footer.scss +++ b/static/css/partials/_footer.scss @@ -9,10 +9,11 @@ a { - font-size: $grid-unit * .75; + font-size: $grid-unit * 0.75; } - + .legal-links { + @include respond-to("small") { @include flex-container(column, space-between, stretch); } @@ -21,13 +22,13 @@ .legal-links a { @include respond-to("small") { - margin-top: $grid-unit * .25; + margin-top: $grid-unit * 0.25; } font-size: 12px; - margin-right: $grid-unit * .75; + margin-right: $grid-unit * 0.75; } - + .mozilla-logo { background-image: url("../img/mozilla.svg"); background-repeat: no-repeat; diff --git a/static/css/partials/_layout.scss b/static/css/partials/_layout.scss index bd7b60a7bf..9611f29659 100644 --- a/static/css/partials/_layout.scss +++ b/static/css/partials/_layout.scss @@ -1,14 +1,14 @@ .responsive-wrapper { - @include respond-to('small') { + @include respond-to("small") { width: 480px; } - @include respond-to('medium') { + @include respond-to("medium") { width: 720px; } - @include respond-to('large') { + @include respond-to("large") { width: 960px; } @@ -34,7 +34,7 @@ .wrapper { width: 100%; - + &.row-wrap { @include flex-container(row, flex-start, stretch, wrap); } diff --git a/static/css/partials/_mixins.scss b/static/css/partials/_mixins.scss index a007420ba5..642f9a23d2 100644 --- a/static/css/partials/_mixins.scss +++ b/static/css/partials/_mixins.scss @@ -1,23 +1,23 @@ @mixin flex-container($direction, $justification, $alignment, $wrap: nowrap) { display: flex; - @if $alignment != 'stretch' { + @if $alignment != "stretch" { align-items: $alignment; } - @if $direction != 'row' { + @if $direction != "row" { flex-direction: $direction; } - @if $justification != 'flex-start' { + @if $justification != "flex-start" { justify-content: $justification; } - @if $wrap != 'nowrap' { + @if $wrap != "nowrap" { flex-wrap: $wrap; } } $breakpoints: ( - large: '(min-width: 960px)', - medium: '(min-width: 720px)', - small: '(max-width: 719px)', + large: "(min-width: 960px)", + medium: "(min-width: 720px)", + small: "(max-width: 719px)", ); @mixin respond-to($breakpoint) { @@ -26,7 +26,7 @@ $breakpoints: ( @content; } } @else { - @warn 'Unfortunately, no value could be retrieved from `#{$breakpoint}`. ' - + 'Please make sure it is defined in `$breakpoints` map.'; + @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. " + + "Please make sure it is defined in `$breakpoints` map."; } } diff --git a/static/css/partials/_theme.scss b/static/css/partials/_theme.scss index 1945d7ee7c..b6bce486e1 100644 --- a/static/css/partials/_theme.scss +++ b/static/css/partials/_theme.scss @@ -64,7 +64,7 @@ background-color: $light-hover; } - &:hover { + &:active { background-color: $light-active; } } diff --git a/static/css/partials/_variables.scss b/static/css/partials/_variables.scss index 12cf4b8137..d3830019b7 100644 --- a/static/css/partials/_variables.scss +++ b/static/css/partials/_variables.scss @@ -13,13 +13,12 @@ $light-hover: #ebebeb; $light-active: #dedede; $light-default: #f6f6f8; $link-blue: #009ec0; -$active-blue: #00D1E6; +$active-blue: #00d1e6; $link-light: #e1e1e6; $link-medium: #858585; $warning: #d92215; -$alt-dark: #31365A; -$alt-dark-title: #6F7FB6; - +$alt-dark: #31365a; +$alt-dark-title: #6f7fb6; // BASE GRID $grid-unit: 20px; diff --git a/static/img/landing-Screenshot-logo.svg b/static/img/landing-Screenshot-logo.svg index 96372b9217..abd276e89b 100644 --- a/static/img/landing-Screenshot-logo.svg +++ b/static/img/landing-Screenshot-logo.svg @@ -1,19 +1 @@ - - - - Screenshot logo - Created with Sketch. - - - - - - - \ No newline at end of file +landing-Screenshot-logo \ No newline at end of file diff --git a/static/img/landing-download-icon.png b/static/img/landing-download-icon.png deleted file mode 100644 index 04f431b985..0000000000 Binary files a/static/img/landing-download-icon.png and /dev/null differ diff --git a/static/img/landing-icon-screenshots.svg b/static/img/landing-icon-screenshots.svg index 36ee680949..7a6ecd8b08 100644 --- a/static/img/landing-icon-screenshots.svg +++ b/static/img/landing-icon-screenshots.svg @@ -1,16 +1 @@ - - - - Combined Shape - Created with Sketch. - - - - - - - - - - - \ No newline at end of file +Shape \ No newline at end of file diff --git a/static/img/landing-screenshots_image_01.svg b/static/img/landing-screenshots_image_01.svg index 2f3c2560ac..c52a2c9f95 100644 --- a/static/img/landing-screenshots_image_01.svg +++ b/static/img/landing-screenshots_image_01.svg @@ -1,116 +1 @@ - - - - Image - Created with Sketch. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file +landing-screenshots_image_01 \ No newline at end of file diff --git a/static/img/landing-small-firefox-logo.png b/static/img/landing-small-firefox-logo.png deleted file mode 100644 index 20e0bba23a..0000000000 Binary files a/static/img/landing-small-firefox-logo.png and /dev/null differ