diff --git a/src/images/icons/arrow-down.svg b/src/images/icons/arrow-down.svg new file mode 100644 index 00000000..bab9203a --- /dev/null +++ b/src/images/icons/arrow-down.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/styles/main.scss b/src/styles/main.scss index 28d6193a..39f0d371 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -16,6 +16,7 @@ html { width: 100vw; + scroll-padding-top: 57px; } body { @@ -85,5 +86,6 @@ body { @import "pages/survey_thanks"; @import 'pages/user_view'; @import "pages/unsubscribe_thanks"; +@import "pages/after_actions_survey"; @import "mo-components/fixes"; -@import "trumps/flickity"; \ No newline at end of file +@import "trumps/flickity"; diff --git a/src/styles/pages/_after_actions_survey.scss b/src/styles/pages/_after_actions_survey.scss new file mode 100644 index 00000000..f8b09d25 --- /dev/null +++ b/src/styles/pages/_after_actions_survey.scss @@ -0,0 +1,84 @@ +body.survey-page +{ + .aa_makeover { + h1 { + font-size: 2.25rem; + text-transform: uppercase; + } + h2 { + font-size: 28px; + @include font(roboto); + font-weight:bold; + } + a { + color: $dark-blue; + display: inline; + } + label { + font-weight:normal; + } + #known_user { + text-align:center; + h3 { + @include font(roboto); + font-size: 16px; + } + } + + #survey-questions { + // Placeholder + ::placeholder { + color: $placeholder-gray; + // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526. + opacity: 1; + } + } + + .known_user_firstname { + font-weight: 700; + } + .btn.cta { + display: inline-flex; + justify-content: center; + align-items: center; + @include btn--azure; + padding: 10px 20px; + color: $white; + padding: 13px 19px; + @include font(roboto-condensed); + font-size: 1.8rem; + font-weight: 700; + text-transform: uppercase; + width: 100%; + background-color:$azure; + } + + // RADIO + .radio-input { + //font-size:20px; + + input[type=radio] { + border: 1px solid #000000; + margin-right:0.25em; + + &:checked { + border: 0px; + background-color: $azure; + opacity: 1; + box-shadow: none; + } + } + } + + label { + color:inherit; + @include respond(( + line-height: 1, + )); + } + + ul#ak-errors { + margin-left: 0px; + } + } +} diff --git a/src/styles/settings/_colors.scss b/src/styles/settings/_colors.scss index 3de40bf4..863d5c3a 100644 --- a/src/styles/settings/_colors.scss +++ b/src/styles/settings/_colors.scss @@ -3,6 +3,7 @@ $thin-air: #caf4ff; $white: #ffffff; $off-white: #f3f3f3; $gray: #cacaca; +$placeholder-gray: #c2c2c2; $light-gray: #a7a7a7; $slate-gray: #696a6a; $dark-gray: #222222; @@ -19,6 +20,7 @@ $azure: #00abff; $logo-blue: #1298FE; $light-blue: #99ddff; $ice-blue: #e5f5ff; +$dark-blue: #006394; $red: #ea1c24; $muted-red: #c3645c; $orange: #dbad54; @@ -34,4 +36,4 @@ $moriginal-green-medium: #37b34a; $moriginal-blue-dark: #193f92; $moriginal-blue-medium: #296ecb; $c-facebook: #3B5998; -$c-twitter: #1DA8E2; \ No newline at end of file +$c-twitter: #1DA8E2; diff --git a/src/styles/settings/_typography.scss b/src/styles/settings/_typography.scss index dbeec8e1..be0d7d28 100644 --- a/src/styles/settings/_typography.scss +++ b/src/styles/settings/_typography.scss @@ -17,7 +17,7 @@ $weights: ( ); @mixin font( $name) { - @if ( map-has-key($fonts, $name) && map-has-key($weights, $name)) { + @if ( map-has-key($fonts, $name) and map-has-key($weights, $name)) { font-family: map-get($fonts, $name); font-weight: map-get($weights, $name); }