From d3a5a2c54b2222e570c23ef57d4957891730aa92 Mon Sep 17 00:00:00 2001 From: Martin Wright Date: Wed, 6 Apr 2016 14:50:32 +0100 Subject: Green used for status text now meets AA requirements for contrast ratio --- assets/stylesheets/responsive/custom.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'assets') diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index 7f0f51b..64948a5 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -22,12 +22,12 @@ $action-color: $color_green; $font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif; $form_input-bg: $color_white; -$button-bg: $action-color; +$button-bg: darken($color_green, 10%); $button-color: $color_white; -$status-success: $color_green; -$status-failure: $color_red; -$status-pending: $color_orange; +$status-success: darken($color_green, 18%); +$status-failure: darken($color_red, 10%); +$status-pending: darken($color_orange, 28%); $notice-color: $color_green; $error-color: $color_red; -- cgit v1.2.3 From 35f5c9d1a44987ace46963ac50ac81eafac5f963 Mon Sep 17 00:00:00 2001 From: lizconlan Date: Mon, 22 Aug 2016 11:27:07 +0100 Subject: Move scss settings to _settings.scss --- assets/stylesheets/responsive/_settings.scss | 49 ++++++++++++++++++++++++++++ assets/stylesheets/responsive/custom.scss | 38 ++------------------- 2 files changed, 51 insertions(+), 36 deletions(-) create mode 100644 assets/stylesheets/responsive/_settings.scss (limited to 'assets') diff --git a/assets/stylesheets/responsive/_settings.scss b/assets/stylesheets/responsive/_settings.scss new file mode 100644 index 0000000..466c902 --- /dev/null +++ b/assets/stylesheets/responsive/_settings.scss @@ -0,0 +1,49 @@ +$main_menu-mobile_menu_cutoff: 58em; +$row-width: 64em; +$body-font-family: "Helvetica Neue", Arial, Helvetica, Helmet, Freesans, sans-serif; +$base-font-size: 16px; + +// Specify the filename and dimensions of your logo file here +$logo-filename: 'logo.png'; +$logo-highdpi-filename: 'logo@2.png'; //Should be at least 2x the size, in the same proportions +$logo-width: 275px; +$logo-height: 44px; + +$color_sand: #f3f1eb; +$color_black: #333333; +$color_orange: #f4a140; +$color_blue: #4faded; +$color_green: #62b356; +$color_yellow: #ffd836; +$color_red: #e04b4b; +$color_violet: #a94ca6; +$color_purple: #5c377f; +$color_white: #ffffff; + +$color_neutral_light: $color_sand; +$color_neutral_dark: $color_black; +$color_primary: $color_violet; +$color_secondary: $color_orange; + +$body-bg: $color_neutral_light; + +$body-font-color: $color_neutral_dark; +$link-color: darken($color_blue, 20%); +$action-color: $color_green; +$font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif; +$form_input-bg: $color_white; +$form-label-font-color: $color_black; + +$button-bg: darken($color_green, 10%); +$button-color: $color_white; + +$status-success: darken($color_green, 18%); +$status-failure: darken($color_red, 10%); +$status-pending: darken($color_orange, 28%); + +$notice-color: $color_green; +$error-color: $color_red; +$action-color: $color_orange; + +$banner_inner_bg: $color_primary; +$topnav_bg: darken($color_primary, 10%); diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index 64948a5..bf6ee9b 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -1,37 +1,3 @@ -$color_sand: #f3f1eb; -$color_black: #333333; -$color_orange: #f4a140; -$color_blue: #4faded; -$color_green: #62b356; -$color_yellow: #ffd836; -$color_red: #e04b4b; -$color_violet: #a94ca6; -$color_purple: #5c377f; -$color_white: #ffffff; - -$color_neutral_light: $color_sand; -$color_neutral_dark: $color_black; -$color_primary: $color_violet; -$color_secondary: $color_orange; - -$body-bg: $color_neutral_light; - -$body-font-color: $color_neutral_dark; -$link-color: darken($color_blue, 20%); -$action-color: $color_green; -$font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif; -$form_input-bg: $color_white; - -$button-bg: darken($color_green, 10%); -$button-color: $color_white; - -$status-success: darken($color_green, 18%); -$status-failure: darken($color_red, 10%); -$status-pending: darken($color_orange, 28%); - -$notice-color: $color_green; -$error-color: $color_red; -$action-color: $color_orange; /* Mixin styles */ @@ -218,11 +184,11 @@ a.link_button_green_large { /* Header */ #banner_inner { - background-color: $color_primary; + background-color: $banner_inner_bg; } #topnav { - background-color: darken($color_primary, 10%); + background-color: $topnav_bg; } .site-title__logo { -- cgit v1.2.3 From cff69de96610dd5c525152ae069c8be0daef0d5b Mon Sep 17 00:00:00 2001 From: lizconlan Date: Mon, 22 Aug 2016 18:45:54 +0100 Subject: Remove #logo_wrapper from stylesheet --- assets/stylesheets/responsive/custom.scss | 17 ----------------- 1 file changed, 17 deletions(-) (limited to 'assets') diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index bf6ee9b..eb0da5f 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -508,23 +508,6 @@ a.link_button_green_large { right: 4px; } } - - /* Pad evenly top and bottom on smaller devices */ - #logo_wrapper{ - - @include respond-min( $main_menu-mobile_menu_cutoff ){ - @include lte-ie7 { - padding-bottom: 2em; - } - } - @media(max-width: $main_menu-mobile_menu_cutoff ){ - padding: 0.5em 0 0.5em 0.9375em; - img { - height: 30px; - } - } - } - } -- cgit v1.2.3 From b6a384949cc7d8a0a9b56aaf73cb57a4294b60dc Mon Sep 17 00:00:00 2001 From: Gareth Rees Date: Tue, 6 Dec 2016 13:26:05 +0000 Subject: Force correspondence date links to always be grey General link colour was overriding this. --- assets/stylesheets/responsive/custom.scss | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'assets') diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index eb0da5f..0fce13b 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -565,6 +565,11 @@ div.correspondence { } } +a.correspondence__header__date, +a.correspondence__header__date:visited { + color: #777; +} + .describe_state_form input[type="radio"] + label { display:inline; } -- cgit v1.2.3 From d5af540ce6b3e87e20fe264588a67f708748516f Mon Sep 17 00:00:00 2001 From: Gareth Rees Date: Tue, 6 Dec 2016 13:26:37 +0000 Subject: Tweak scope of incoming correspondence link colour Should only apply to links in the correspondence, not e.g. the "Admin" link. --- assets/stylesheets/responsive/custom.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'assets') diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index 0fce13b..b05e2ce 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -550,7 +550,7 @@ div.correspondence { .incoming.correspondence { border-top: 8px solid $color_secondary; - a { + .correspondence_text a { color: $color_secondary; } a.link_to_this { -- cgit v1.2.3 From 6f466b97c4dfbd5ee5480a2ea0f77a4cc82bb3ef Mon Sep 17 00:00:00 2001 From: Gareth Rees Date: Mon, 12 Dec 2016 16:48:25 +0000 Subject: Move hero CTA to homepage-hero scope Shouldn't be setting the sidebar CTA text to white. --- assets/stylesheets/responsive/custom.scss | 46 +++++++++++++++---------------- 1 file changed, 23 insertions(+), 23 deletions(-) (limited to 'assets') diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index b05e2ce..dc205f2 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -806,6 +806,29 @@ dt { } } + .intro__title { + color: $color_white; + text-shadow: 0 1px 2px transparentize($color_black, 0.7); + } + + .new-request__content { + background-color: $color_neutral_dark; + border-radius: 5px; + padding: 1.888888889em; + } + + .new-request__title { + color: $color_white; + font-size: 1.4375em; + margin: 0 0 0.5em; + } + + .new-request__description { + color: transparentize($color_white, 0.2); + @include ie8 { + color: $color_white; + } + } .new-request__make-new-requests { @include button-base; background-color: desaturate(darken($color_secondary, 10%), 5%); @@ -818,26 +841,3 @@ dt { } } -.intro__title { - color: $color_white; - text-shadow: 0 1px 2px transparentize($color_black, 0.7); -} - -.new-request__content { - background-color: $color_neutral_dark; - border-radius: 5px; - padding: 1.888888889em; -} - -.new-request__title { - color: $color_white; - font-size: 1.4375em; - margin: 0 0 0.5em; -} - -.new-request__description { - color: transparentize($color_white, 0.2); - @include ie8 { - color: $color_white; - } -} -- cgit v1.2.3 From 631a3f8223fd257375beb8fb5c0fc4042eadf911 Mon Sep 17 00:00:00 2001 From: Gareth Rees Date: Mon, 12 Dec 2016 17:10:58 +0000 Subject: Style sidebar CTA button MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Minimum viable styles – didn't add a background to the element as I think it would conflict with the new status bar. --- assets/stylesheets/responsive/custom.scss | 8 ++++++++ 1 file changed, 8 insertions(+) (limited to 'assets') diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index dc205f2..07ae01a 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -612,6 +612,14 @@ a.link_to_this { } } +.sidebar { + .new-request-cta { + .new-request__make-new-requests { + @include button-primary(); + } + } +} + .feed_link_sidebar .link_button_green { @include button-primary(); } -- cgit v1.2.3 From 09bb07cfba6a87b6dc1e97e6abb89398416283cb Mon Sep 17 00:00:00 2001 From: Gareth Rees Date: Mon, 12 Dec 2016 16:29:51 +0000 Subject: Make request status text black Otherwise there's not enough contrast between it and the new colour background. Fixes https://github.com/mysociety/alavetelitheme/issues/83. --- assets/stylesheets/responsive/custom.scss | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'assets') diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss index b05e2ce..036f758 100644 --- a/assets/stylesheets/responsive/custom.scss +++ b/assets/stylesheets/responsive/custom.scss @@ -650,6 +650,10 @@ a.link_to_this { color: $status-success; } +.request-status-message { + color: $color_black; +} + /* Attachments*/ .view_html_prefix { -- cgit v1.2.3