Skip to content

Commit

Permalink
Merge pull request #1635 from nationalarchives/FCL-152/use-tna-colours
Browse files Browse the repository at this point in the history
Fcl 152/use tna colours
  • Loading branch information
jlhdxw authored Nov 29, 2024
2 parents 1773448 + bbee81b commit e0c9f31
Show file tree
Hide file tree
Showing 58 changed files with 284 additions and 880 deletions.
1 change: 0 additions & 1 deletion config/views/style_guide.py
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,6 @@ def get_context_data(self, **kwargs):
context["feedback_survey_type"] = "support"
context["search_form"] = AdvancedSearchForm()
context["menu_items"] = [
{"label": "Colours", "href": "#colours"},
{
"label": "Components",
"href": "#components",
Expand Down
2 changes: 1 addition & 1 deletion ds_judgements_public_ui/sass/document_pdf.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
@import "includes/variables";
@import "includes/mixins";
@import "../../node_modules/@nationalarchives/ds-caselaw-frontend/src/main";
@import "@nationalarchives/ds-caselaw-frontend/src/main";

html {
font-size: 12px;
Expand Down
4 changes: 2 additions & 2 deletions ds_judgements_public_ui/sass/includes/_animations.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
@keyframes emphasis {
from {
background-color: $color-emphasis-background;
background-color: brand-colour("pastel-blue");
}

to {
Expand All @@ -10,7 +10,7 @@

@keyframes emphasis-border {
from {
background-color: ($color-light-grey, 30);
background-color: colour-var("accent-background-light");
}

to {
Expand Down
23 changes: 11 additions & 12 deletions ds_judgements_public_ui/sass/includes/_basic_search_form.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
.search-component {
background-color: $color-light-grey;
background-color: colour-var("accent-background-light");

&__container {
@include container;
Expand Down Expand Up @@ -36,7 +36,7 @@
font-size: $typography-md-text-size;
font-weight: $typography-normal-font-weight;
line-height: 2.8rem;
color: $color-almost-black;
color: colour-var("font-dark");

&--sr-only {
@include sr-only;
Expand All @@ -56,19 +56,19 @@
font-family: $font-roboto;
font-size: $typography-md-text-size;
font-weight: $typography-bold-font-weight;
color: $color-black;
color: colour-var("accent-link");
text-decoration: none;

background: transparent;
border: 0;
border-bottom: 0.125rem solid $color-black;
border-bottom: 0.125rem solid colour-var("accent-link");

&:visited {
color: $color-black;
color: colour-var("accent-link");
}

&:hover {
color: $color-black;
color: colour-var("accent-link");
text-decoration: underline;
}
}
Expand All @@ -87,20 +87,19 @@
font-family: $font-roboto;
font-size: $typography-md-text-size;
font-weight: bold;
color: $color-dark-blue;
text-decoration: none;
color: colour-var("link");
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: $color-black;
text-decoration: underline;
color: colour-var("link");
text-decoration: none;
}
}

Expand Down
6 changes: 3 additions & 3 deletions ds_judgements_public_ui/sass/includes/_breadcrumbs.scss
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
padding: 0;

line-height: 1.3rem;
color: $color-white;
color: colour-var("contrast-link");
letter-spacing: 0.3px;

&:not(:nth-child(1)) {
Expand All @@ -51,7 +51,7 @@
margin: auto 0;

border: solid;
border-color: $color-white;
border-color: colour-var("contrast-link");
border-width: 0.125rem 0.125rem 0 0;
}
}
Expand All @@ -64,7 +64,7 @@

&__prefix {
margin-right: $space-2;
color: $color-white;
color: colour-var("contrast-link");
}

@media only screen and (max-width: $grid-breakpoint-medium) {
Expand Down
4 changes: 2 additions & 2 deletions ds_judgements_public_ui/sass/includes/_browse_by_court.scss
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,11 @@
}

&__court-link {
color: $color-black;
color: colour-var("accent-link");
text-decoration: none;

&:hover {
color: $color-black;
color: colour-var("accent-link");
text-decoration: underline;
}
}
Expand Down
24 changes: 12 additions & 12 deletions ds_judgements_public_ui/sass/includes/_buttons.scss
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
.button-cta {
@include call-to-action-button;

border: 2px solid $color-cta-background;
border: 2px solid brand-colour("navy");

&:disabled,
&[aria-disabled="true"] {
background-color: $color-dark-grey;
background-color: colour-var("button-background");

&:focus,
&:hover {
cursor: not-allowed;

color: $color-white;
color: colour-var("button-text");
text-decoration: none;

background-color: $color-dark-grey;
background-color: colour-var("button-background");
outline: none;
}
}
Expand All @@ -23,30 +23,30 @@
.button-secondary {
@include call-to-action-button;

color: $color-cta-background;
background-color: $color-white;
border: 2px solid $color-cta-background;
color: brand-colour("navy");
background-color: colour-var("contrast-button-background");
border: 2px solid brand-colour("navy");

&:visited {
color: $color-cta-background;
color: brand-colour("navy");
}

&:focus,
&:hover {
color: white;
color: colour-var("contrast-font-base");
}

&:disabled,
&[aria-disabled="true"] {
color: $color-dark-grey;
color: colour-var("font-base");
background-color: transparent;
border-color: $color-grey;
border-color: colour-var("accent-border");

&:focus,
&:hover {
cursor: not-allowed;

color: $color-dark-grey;
color: colour-var("font-base");
text-decoration: none;

background-color: transparent;
Expand Down
6 changes: 3 additions & 3 deletions ds_judgements_public_ui/sass/includes/_cards_homepage.scss
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
font-weight: $typography-bold-font-weight;

a {
color: $color-aqua-blue;
color: colour-var("link");
}

@media only screen and (max-width: $grid-breakpoint-medium) {
Expand Down Expand Up @@ -76,14 +76,14 @@

text-wrap: balance;

background-color: $color-light-grey;
background-color: colour-var("accent-background-light");
}
}

@media (max-width: $grid-breakpoint-medium) {
gap: $space-4;
margin: 0;
background-color: $color-light-grey;
background-color: colour-var("accent-background-light");
}

@media (min-width: $grid-breakpoint-small) {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
#ds-cookie-consent-banner a {
color: $color-white;
color: colour-var("contrast-link");
}

#ds-cookie-consent-banner .container #btn_preferences:hover,
Expand Down
4 changes: 2 additions & 2 deletions ds_judgements_public_ui/sass/includes/_court_or_tribunal.scss
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@

&__judgment-meta {
margin-top: 0;
color: $color-dark-grey;
color: colour-var("font-base");
}

&__pagination-links {
Expand Down Expand Up @@ -74,7 +74,7 @@
&.prev {
margin-bottom: $space-4;
padding-bottom: $space-4;
border-bottom: 1px solid $color-grey;
border-bottom: 1px solid colour-var("accent-border");
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
width: 100vw;
padding: $spacer-unit 0 0;

background-color: $color-white;
box-shadow: $color-dark-grey 1px 1px 6px;
background-color: colour-var("background");
box-shadow: colour-var("font-base") 1px 1px 6px;

&__summary {
display: flex;
Expand Down Expand Up @@ -61,7 +61,7 @@
padding: $space-4;
padding: $spacer-unit;

border-bottom: 1px solid $color-dark-grey;
border-bottom: 1px solid colour-var("font-base");
border-bottom: none;

&__query-wrapper {
Expand Down Expand Up @@ -223,7 +223,7 @@
}

&.document-navigation-links__link-left {
color: $color-link-disabled;
color: colour-var("grey");
text-decoration: none;

&::before {
Expand All @@ -244,7 +244,7 @@
}

&.document-navigation-links__link-right {
color: $color-link-disabled;
color: colour-var("grey");
text-decoration: none;

&::after {
Expand All @@ -266,7 +266,7 @@

&:visited,
&:link {
color: $color-link-blue;
color: colour-var("link");
text-decoration: underline;

&.document-navigation-links__link-left {
Expand All @@ -284,15 +284,15 @@

&:hover {
&.document-navigation-links__link-up {
color: $color-link-blue-hover;
color: colour-var("link");

&::before {
background-image: url($fa_chevron_up_link_hover_blue);
}
}

&.document-navigation-links__link-down {
color: $color-link-blue-hover;
color: colour-var("link");

&::after {
background-image: url($fa_chevron_down_link_hover_blue);
Expand All @@ -301,7 +301,7 @@
}

&:link:hover {
color: $color-link-blue-hover;
color: colour-var("link");

&.document-navigation-links__link-left {
&::before {
Expand Down
16 changes: 8 additions & 8 deletions ds_judgements_public_ui/sass/includes/_environment_banner.scss
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
.environment-banner {
color: $color-black;
background-color: $color-information;
color: colour-var("font-dark");
background-color: brand-colour("pastel-blue");

&__notice {
padding: 0;

a {
font-weight: $typography-bold-font-weight;
color: $color-black;
color: colour-var("accent-link");

&:focus {
color: $color-black;
background-color: $color-white;
outline: 0.125rem solid $color-black;
color: colour-var("accent-link");
background-color: colour-var("accent-background");
outline: 0.125rem solid colour-var("accent-link");
}
}
}
Expand All @@ -22,10 +22,10 @@
padding: 0 $space-1;

font-weight: $typography-bold-font-weight;
color: $color-black;
color: colour-var("font-dark");
text-transform: uppercase;

background-color: $color-white;
background-color: colour-var("background");
}

&__message {
Expand Down
Loading

0 comments on commit e0c9f31

Please sign in to comment.