diff --git a/ds_judgements_public_ui/sass/includes/_basic_search_form.scss b/ds_judgements_public_ui/sass/includes/_basic_search_form.scss index 5e62288cf..b64c66942 100644 --- a/ds_judgements_public_ui/sass/includes/_basic_search_form.scss +++ b/ds_judgements_public_ui/sass/includes/_basic_search_form.scss @@ -88,19 +88,18 @@ font-size: $typography-md-text-size; font-weight: bold; color: colour-var("link"); - text-decoration: none; + text-decoration: underline; background: transparent; border: 0; - border-bottom: 1px solid $color-dark-blue; &:visited { - color: $color-dark-blue; + color: colour-var("link"); } &:hover { - color: colour-var("accent-link"); - text-decoration: underline; + color: colour-var("link"); + text-decoration: none; } } diff --git a/ds_judgements_public_ui/sass/includes/_buttons.scss b/ds_judgements_public_ui/sass/includes/_buttons.scss index 4b73a70cd..c69f6110b 100644 --- a/ds_judgements_public_ui/sass/includes/_buttons.scss +++ b/ds_judgements_public_ui/sass/includes/_buttons.scss @@ -1,7 +1,7 @@ .button-cta { @include call-to-action-button; - border: 2px solid colour-var("blue"); + border: 2px solid brand-colour("navy"); &:disabled, &[aria-disabled="true"] { @@ -23,12 +23,12 @@ .button-secondary { @include call-to-action-button; - color: colour-var("blue"); + color: brand-colour("navy"); background-color: colour-var("contrast-button-background"); - border: 2px solid colour-var("blue"); + border: 2px solid brand-colour("navy"); &:visited { - color: colour-var("blue"); + color: brand-colour("navy"); } &:focus, diff --git a/ds_judgements_public_ui/sass/includes/_judgment_text_toolbar.scss b/ds_judgements_public_ui/sass/includes/_judgment_text_toolbar.scss index 21dba074c..380bfdf20 100644 --- a/ds_judgements_public_ui/sass/includes/_judgment_text_toolbar.scss +++ b/ds_judgements_public_ui/sass/includes/_judgment_text_toolbar.scss @@ -113,7 +113,7 @@ display: inline-block; font-size: $typography-md-text-size; - color: colour-var("blue"); + color: colour-var("link"); text-decoration: underline; background: url($fa_chevron_down_link_blue) right no-repeat; diff --git a/ds_judgements_public_ui/sass/includes/_mixins.scss b/ds_judgements_public_ui/sass/includes/_mixins.scss index ed3dd823e..aac8cc9c6 100644 --- a/ds_judgements_public_ui/sass/includes/_mixins.scss +++ b/ds_judgements_public_ui/sass/includes/_mixins.scss @@ -72,19 +72,19 @@ color: colour-var("accent-button-text"); text-decoration: none; - background-color: colour-var("navy"); + background-color: brand-colour("navy"); border: 0; &:focus, &:hover { @include focus-default; - color: colour-var("accent-button-text") !important; + color: colour-var("accent-button-text"); text-decoration: underline; - background-color: transparent; - border-color: colour-var("navy"); - outline-color: colour-var("navy"); + background-color: brand-colour("navy"); + border-color: brand-colour("navy"); + outline-color: brand-colour("navy"); outline-offset: 0.2rem; } } @@ -93,20 +93,26 @@ @include call-to-action-button; padding: $space-3 $space-5; - color: colour-var("blue") !important; + color: brand-colour("navy"); background-color: transparent; - border: 2px solid colour-var("navy"); + border: 2px solid brand-colour("navy"); + + &:hover, + &:focus { + color: brand-colour("navy"); + background-color: transparent; + } } @mixin emphasised-block { padding: $space-4; background-color: colour-var("accent-background-light"); - border-left: 0.5rem solid $color-highlight-blue; + border-left: 0.5rem solid brand-colour("navy"); } @mixin focus-default { z-index: 999; - outline: 5px solid colour-var("focus-outline"); + outline: 5px solid brand-colour("navy"); outline-offset: 2px; } diff --git a/ds_judgements_public_ui/sass/includes/_notification_message.scss b/ds_judgements_public_ui/sass/includes/_notification_message.scss index 6a0b8c998..7b09e9836 100644 --- a/ds_judgements_public_ui/sass/includes/_notification_message.scss +++ b/ds_judgements_public_ui/sass/includes/_notification_message.scss @@ -17,8 +17,8 @@ &--success { @include page-notification; - color: colour-var("green"); - border-color: colour-var("green"); + color: brand-colour("green"); + border-color: brand-colour("green"); } &--failure { @@ -39,8 +39,8 @@ &--success { @include context-notification; - color: colour-var("green"); - border-color: colour-var("green"); + color: brand-colour("green"); + border-color: brand-colour("green"); } &--failure { diff --git a/ds_judgements_public_ui/sass/includes/_structured_search.scss b/ds_judgements_public_ui/sass/includes/_structured_search.scss index eb8400705..3e11fd933 100644 --- a/ds_judgements_public_ui/sass/includes/_structured_search.scss +++ b/ds_judgements_public_ui/sass/includes/_structured_search.scss @@ -193,18 +193,18 @@ margin: 0; font-size: $typography-sm-text-size; font-weight: $typography-bold-font-weight; - color: colour-var("red"); + color: colour-var("form-error-text"); } &__to-date-error-message { margin: 0; font-size: $typography-sm-text-size; font-weight: $typography-bold-font-weight; - color: colour-var("red"); + color: colour-var("form-error-text"); } input:invalid { - border-color: colour-var("red"); + border-color: colour-var("form-error-text"); } input:focus:invalid { @@ -334,7 +334,7 @@ box-sizing: border-box; width: 100% !important; margin-bottom: 0; - border-color: colour-var("red"); + border-color: colour-var("form-error-text"); } fieldset { @@ -346,7 +346,7 @@ &__multi-fields-panel { fieldset.with-errors { padding-left: $space-6; - border-left: 4px solid colour-var("red"); + border-left: 4px solid colour-var("form-error-text"); .structured-search__help-text { margin-bottom: $space-2; diff --git a/ds_judgements_public_ui/sass/includes/govuk_overrides/_details.scss b/ds_judgements_public_ui/sass/includes/govuk_overrides/_details.scss index f751de45a..44c0c8757 100644 --- a/ds_judgements_public_ui/sass/includes/govuk_overrides/_details.scss +++ b/ds_judgements_public_ui/sass/includes/govuk_overrides/_details.scss @@ -5,7 +5,7 @@ padding: $space-2; background-color: colour-var("background"); - border: 3px solid colour-var("blue"); + border: 3px solid brand-colour("navy"); } .govuk-details--compact { diff --git a/ds_judgements_public_ui/sass/includes/govuk_overrides/_grid.scss b/ds_judgements_public_ui/sass/includes/govuk_overrides/_grid.scss index a736f3a49..fff24d634 100644 --- a/ds_judgements_public_ui/sass/includes/govuk_overrides/_grid.scss +++ b/ds_judgements_public_ui/sass/includes/govuk_overrides/_grid.scss @@ -83,8 +83,7 @@ .govuk-grid-column-one-third__grid_info_card_text { color: colour-var("accent-font-base"); - text-decoration-color: colour-var("accent-background-light"); - text-decoration-line: underline; + text-decoration: underline; &:hover { text-decoration: none; diff --git a/ds_judgements_public_ui/sass/includes/govuk_overrides/_notification.scss b/ds_judgements_public_ui/sass/includes/govuk_overrides/_notification.scss index b2912bce6..c43a030cc 100644 --- a/ds_judgements_public_ui/sass/includes/govuk_overrides/_notification.scss +++ b/ds_judgements_public_ui/sass/includes/govuk_overrides/_notification.scss @@ -4,8 +4,8 @@ } .govuk-notification-banner_red { - background-color: colour-var("red"); - border: 5px solid colour-var("red"); + background-color: brand-colour("pastel-pink"); + border: 5px solid brand-colour("pastel-pink"); } .govuk-notification-banner__link { diff --git a/ds_judgements_public_ui/sass/main.scss b/ds_judgements_public_ui/sass/main.scss index 3f16a6b0f..4066efcd7 100644 --- a/ds_judgements_public_ui/sass/main.scss +++ b/ds_judgements_public_ui/sass/main.scss @@ -1,5 +1,8 @@ @use "@nationalarchives/frontend/nationalarchives/tools/colour" as *; +// Vendor imports +@import "@nationalarchives/ds-caselaw-frontend/src/main"; + // Setup @import "includes/variables"; @import "includes/mixins"; @@ -16,9 +19,6 @@ @import "includes/spacing"; @import "includes/typography"; -// Vendor imports -@import "@nationalarchives/ds-caselaw-frontend/src/main"; - $govuk-font-family: $font-open-sans; $govuk-focus-colour: colour-var("focus-outline");