diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index e96a34cfd..65f44bbfb 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -204,8 +204,8 @@ $table-header: #ecf1f6; line-height: $line-height * 2; .button { + @include brand-text; background: #fff; - color: $brand; } } } @@ -677,7 +677,7 @@ code { display: block; &.is-active { - color: $brand; + @include brand-text; font-weight: bold; text-decoration: underline; } diff --git a/app/assets/stylesheets/dashboard.scss b/app/assets/stylesheets/dashboard.scss index 30f59e6bb..f674ce45b 100644 --- a/app/assets/stylesheets/dashboard.scss +++ b/app/assets/stylesheets/dashboard.scss @@ -320,7 +320,7 @@ } .is-active { - color: $brand; + @include brand-text; position: relative; &::before { @@ -335,7 +335,7 @@ } a { - color: $brand; + @include brand-text; ~ a { color: $text; @@ -343,7 +343,7 @@ } [class^="icon-"] { - color: $brand; + @include brand-text; } } @@ -358,7 +358,7 @@ border-bottom: 2px solid $brand; .has-tip { - color: $brand; + @include brand-text; font-weight: bold; } } diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index c1f11ff35..7c8abf7d5 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -29,8 +29,8 @@ // 01. Global styles // ----------------- -::selection { - @include brand-background($invert-selection: false); +* { + @include normal-selection; } html, @@ -96,6 +96,7 @@ a { } .button.hollow { + @include normal-selection; border: 1px solid $link; color: $link; } @@ -248,12 +249,12 @@ a { } &.is-active { + @include brand-text; border-bottom: 2px solid $brand; - color: $brand; padding-bottom: rem-calc(1); h2 a { - color: $brand; + @include brand-text; } } @@ -279,8 +280,8 @@ a { padding: 0; &.is-active { + @include brand-text; font-weight: bold; - color: $brand; } } @@ -289,8 +290,8 @@ a { } &.is-active { + @include brand-text; border-bottom: 2px solid $brand; - color: $brand; } } @@ -352,15 +353,15 @@ a { position: relative; &:hover { + @include brand-text; background: none; - color: $brand; text-decoration: none; } &[aria-selected="true"], &.is-active { + @include brand-text; border-bottom: 0; - color: $brand; font-weight: bold; &::after { @@ -527,11 +528,11 @@ body > header, padding: rem-calc(6); [type="submit"] { + @include brand-text; background: none; border: 0; cursor: pointer; font-weight: bold; - color: $brand; &:hover { text-decoration: underline; @@ -615,8 +616,8 @@ body > header, text-align: left; @include breakpoint(medium) { + @include brand-text; background: #fff; - color: $brand; text-align: center; } } @@ -776,8 +777,8 @@ body > header, color: #fff; @include breakpoint(medium) { + @include brand-text; border-bottom: 2px solid $brand; - color: $brand; } } } @@ -848,8 +849,8 @@ body > header, } .is-active { + @include brand-text; border-bottom: 2px solid $brand; - color: $brand; &:hover { text-decoration: none; @@ -1638,7 +1639,7 @@ table { text-decoration: none; &:hover { - color: $brand; + @include brand-text; } } } diff --git a/app/assets/stylesheets/legislation_process.scss b/app/assets/stylesheets/legislation_process.scss index b1bc9c0d8..03c58399a 100644 --- a/app/assets/stylesheets/legislation_process.scss +++ b/app/assets/stylesheets/legislation_process.scss @@ -144,8 +144,8 @@ margin-bottom: rem-calc(40); .debate-type { + @include brand-text; text-transform: uppercase; - color: $brand; font-weight: 700; font-size: $small-font-size; @@ -155,7 +155,7 @@ } .debate-title a { - color: $brand; + @include brand-text; } } @@ -208,7 +208,7 @@ } h4 a { - color: $brand; + @include brand-text; &:hover { text-decoration: none; @@ -225,8 +225,8 @@ } .quiz-next { + @include brand-text; background: #ccdbe5; - color: $brand; font-size: $small-font-size; font-weight: bold; text-align: right; diff --git a/app/assets/stylesheets/mixins/buttons.scss b/app/assets/stylesheets/mixins/buttons.scss index 83c7fc394..5974a418d 100644 --- a/app/assets/stylesheets/mixins/buttons.scss +++ b/app/assets/stylesheets/mixins/buttons.scss @@ -15,6 +15,7 @@ @mixin hollow-button($color: $link) { @include button($style: hollow, $background: $color); + @include normal-selection; @extend %button; margin-bottom: 0; } diff --git a/app/assets/stylesheets/mixins/colors.scss b/app/assets/stylesheets/mixins/colors.scss index d65f555cd..ead4fdaf8 100644 --- a/app/assets/stylesheets/mixins/colors.scss +++ b/app/assets/stylesheets/mixins/colors.scss @@ -7,6 +7,19 @@ } } +@mixin brand-text { + @include normal-selection; + color: $brand; +} + +@mixin normal-selection { + + &::selection, + *::selection { + @include brand-background($invert-selection: false); + } +} + @mixin inverted-selection { &::selection, @@ -19,3 +32,7 @@ %brand-background { @include brand-background; } + +%brand-text { + @include brand-text; +} diff --git a/app/assets/stylesheets/pages.scss b/app/assets/stylesheets/pages.scss index 3df5ac3c1..eea332e34 100644 --- a/app/assets/stylesheets/pages.scss +++ b/app/assets/stylesheets/pages.scss @@ -52,7 +52,7 @@ .more-info-content { h3 { - color: $brand; + @include brand-text; } .additional-info { diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss index 579a8a08e..2b9313af6 100644 --- a/app/assets/stylesheets/participation.scss +++ b/app/assets/stylesheets/participation.scss @@ -991,7 +991,7 @@ } .is-active { - color: $brand; + @include brand-text; &::after { content: "\6c"; @@ -1211,15 +1211,15 @@ } .button { + @include brand-text; background: #fff; - color: $brand; margin-bottom: rem-calc(3); text-decoration: none; } } .current-phase { - color: $brand; + @include brand-text; } .progress-votes {