diff --git a/app/styles/app/pages/home-pro.sass b/app/styles/app/pages/home-pro.sass index 7d837021..772785a7 100644 --- a/app/styles/app/pages/home-pro.sass +++ b/app/styles/app/pages/home-pro.sass @@ -1,8 +1,3 @@ -$teal: #40A3AD -$green: #39A85B -$red: #DB4242 -$yellow: #E5C025 -$grey: #858585 .landing-pro @@ -44,10 +39,10 @@ $grey: #858585 border-radius: 2px font-size: 27px text-decoration: none - background-color: $green + background-color: $turf-green &:hover color: white - background-color: #73c78d + background-color: lighten($turf-green, .2) .hero-button @extend .landing-button @@ -199,22 +194,22 @@ $grey: #858585 .h1--grey @extend %h1 @include linkStyle - color: $grey !important + color: $asphalt-grey !important a - color: $grey + color: $asphalt-grey .h1--teal @extend %h1 font-size: 64px - color: #408692 !important + color: $oxide-blue !important .h1--green @extend %h1 - color: $green !important + color: $turf-green !important .h1--red @extend %h1 - color: $red !important + color: $brick-red !important %h2 margin: 0 0 .5em @@ -224,19 +219,19 @@ $grey: #858585 .h2--grey @extend %h2 - color: $grey + color: $asphalt-grey .h2--green @extend %h2 - color: $green + color: $turf-green .h2--red @extend %h2 - color: $red + color: $brick-red .h2--teal @extend %h2 - color: $teal + color: $oxide-blue %h3 margin: .5em 0 @@ -254,19 +249,19 @@ $grey: #858585 .h3--teal @extend %h3 - color: $teal + color: $oxide-blue .h3--red @extend %h3 - color: $red + color: $brick-red .h3--green @extend %h3 - color: $green + color: $turf-green .h3--yellow @extend %h3 - color: $yellow + color: $dozer-yellow .text-big @include linkStyle diff --git a/app/styles/app/pages/logo.sass b/app/styles/app/pages/logo.sass index b3185b6e..4fa8ccb0 100644 --- a/app/styles/app/pages/logo.sass +++ b/app/styles/app/pages/logo.sass @@ -19,13 +19,13 @@ margin: .5em 0 0 .font-light font-weight: 300 - color: $teal + color: $oxide-blue .font-regular font-weight: 400 - color: #D3B01E + color: $dozer-yellow .font-semibold font-weight: 600 - color: $grey + color: $asphalt-grey .list--colors @extend %list @@ -39,15 +39,15 @@ height: 3em margin-bottom: .5em .colors-sample--teal - background-color: $teal + background-color: $oxide-blue .colors-sample--green - background-color: $green + background-color: $turf-green .colors-sample--yellow - background-color: $yellow + background-color: $canary-yellow .colors-sample--red - background-color: $red + background-color: $brick-red .colors-sample--grey - background-color: #666 + background-color: $asphalt-grey .list--mascot @extend %list @@ -91,3 +91,6 @@ margin-bottom: 3em @media #{$medium-up} margin-bottom: 0 + + .text-logo + margin: 0 auto 3em diff --git a/app/styles/app/pages/plans.sass b/app/styles/app/pages/plans.sass index f5c750a1..d3366136 100644 --- a/app/styles/app/pages/plans.sass +++ b/app/styles/app/pages/plans.sass @@ -12,7 +12,7 @@ margin-bottom: 2em border: width: 2px - color: #E8E8E8 + color: rgba($cement-grey, .2) style: solid @media #{$medium-up} @@ -52,19 +52,19 @@ color: $color .plan--red - +colorPlans($red, #FCF0F0, false) + +colorPlans($brick-red, lighten($brick-red, 40), false) .list--check li:before background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGcgaWQ9IlBhc3NlZCI+Cgk8Zz4KCQk8cGF0aCBmaWxsPSIjREI0MjQyIiBkPSJNOS42LDE0LjRjLTAuMSwwLTAuMy0wLjEtMC40LTAuMWwtNC0zLjNjLTAuMy0wLjItMC4zLTAuNi0wLjEtMC45UzUuOCw5LjgsNi4xLDEwbDMuNCwyLjhsNC45LTcuNQoJCQlDMTQuNiw1LDE1LDQuOSwxNS4zLDUuMWMwLjMsMC4yLDAuNCwwLjYsMC4yLDAuOWwtNS4zLDguMUMxMC4xLDE0LjMsOS45LDE0LjQsOS42LDE0LjRDOS43LDE0LjQsOS43LDE0LjQsOS42LDE0LjR6Ii8+Cgk8L2c+CjwvZz4KPC9zdmc+") .plan--green - +colorPlans($green, #73c78d) + +colorPlans($turf-green, lighten($turf-green, 10)) .list--check li:before background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGcgaWQ9IlBhc3NlZCI+Cgk8Zz4KCQk8cGF0aCBmaWxsPSIjMzlBODVCIiBkPSJNOS42LDE0LjRjLTAuMSwwLTAuMy0wLjEtMC40LTAuMWwtNC0zLjNjLTAuMy0wLjItMC4zLTAuNi0wLjEtMC45UzUuOCw5LjgsNi4xLDEwbDMuNCwyLjhsNC45LTcuNQoJCQlDMTQuNiw1LDE1LDQuOSwxNS4zLDUuMWMwLjMsMC4yLDAuNCwwLjYsMC4yLDAuOWwtNS4zLDguMUMxMC4xLDE0LjMsOS45LDE0LjQsOS42LDE0LjRDOS43LDE0LjQsOS43LDE0LjQsOS42LDE0LjR6Ii8+Cgk8L2c+CjwvZz4KPC9zdmc+") .plan--teal - +colorPlans($teal, #8CC8CE) + +colorPlans($oxide-blue, lighten($oxide-blue, 10)) .list--check li:before background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGcgaWQ9IlBhc3NlZCI+Cgk8Zz4KCQk8cGF0aCBmaWxsPSIjNDBBM0FEIiBkPSJNOS42LDE0LjRjLTAuMSwwLTAuMy0wLjEtMC40LTAuMWwtNC0zLjNjLTAuMy0wLjItMC4zLTAuNi0wLjEtMC45UzUuOCw5LjgsNi4xLDEwbDMuNCwyLjhsNC45LTcuNQoJCQlDMTQuNiw1LDE1LDQuOSwxNS4zLDUuMWMwLjMsMC4yLDAuNCwwLjYsMC4yLDAuOWwtNS4zLDguMUMxMC4xLDE0LjMsOS45LDE0LjQsOS42LDE0LjRDOS43LDE0LjQsOS43LDE0LjQsOS42LDE0LjR6Ii8+Cgk8L2c+CjwvZz4KPC9zdmc+") .plan--yellow - +colorPlans($yellow, #EFD97C) + +colorPlans($dozer-yellow, lighten($dozer-yellow, 10)) .list--check li:before background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGcgaWQ9IlBhc3NlZCI+Cgk8Zz4KCQk8cGF0aCBmaWxsPSIjRTVDMDI1IiBkPSJNOS42LDE0LjRjLTAuMSwwLTAuMy0wLjEtMC40LTAuMWwtNC0zLjNjLTAuMy0wLjItMC4zLTAuNi0wLjEtMC45UzUuOCw5LjgsNi4xLDEwbDMuNCwyLjhsNC45LTcuNQoJCQlDMTQuNiw1LDE1LDQuOSwxNS4zLDUuMWMwLjMsMC4yLDAuNCwwLjYsMC4yLDAuOWwtNS4zLDguMUMxMC4xLDE0LjMsOS45LDE0LjQsOS42LDE0LjRDOS43LDE0LjQsOS43LDE0LjQsOS42LDE0LjR6Ii8+Cgk8L2c+CjwvZz4KPC9zdmc+") @@ -129,7 +129,7 @@ flex: 0 0 100% padding: 1em 1.5em 1.7em margin-bottom: 2em - border: solid 1px #E8E8E8 + border: solid 1px rgba($cement-grey, .2) @media #{$medium-up} flex: 0 0 48% diff --git a/app/templates/logo.hbs b/app/templates/logo.hbs index b60428de..42607bb0 100644 --- a/app/templates/logo.hbs +++ b/app/templates/logo.hbs @@ -46,19 +46,19 @@
Turbo Teal #40A3AD
+Oxide blue #3EAAAF
Passing green #44A662
+Turf green #39AA56
Building yellow #E5DA3F
+Canary yellow #EDDE3F
Failing red #D94341
+Brick red #DB4545