Fix missing CSS and background class names

nationalarchives · Nov 6, 2023 · 2dcd6ed · 2dcd6ed
1 parent 1b00d16
commit 2dcd6ed
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 4 deletions.
diff --git a/layouts/layout-example-site.njk b/layouts/layout-example-site.njk
@@ -2,6 +2,7 @@
 
 {% block stylesheets %}
   <link rel="stylesheet" href="/design-system/css/index.css">
+  <link rel="stylesheet" href="https://use.typekit.net/hkj3kuz.css">
 {% endblock %}
 
 {%- set theme = "light" -%}

diff --git a/layouts/layout-example.njk b/layouts/layout-example.njk
@@ -2,6 +2,7 @@
 
 {% block stylesheets %}
   <link rel="stylesheet" href="/design-system/css/index.css">
+  <link rel="stylesheet" href="https://use.typekit.net/hkj3kuz.css">
   <style>
   .tna-template__body {
     min-height: 0;

diff --git a/src/styles/colours/index.md b/src/styles/colours/index.md
@@ -129,10 +129,10 @@ Elements that can follow the accent colour such as `tna-phase-banner--accent`, `
 
 The colours of all elements in an element can be controlled with background classes:
 
-- `tna-background--tint` &mdash; a light, neutral background colour to highlight an area of the page
-- `tna-background--contrast` &mdash; a contrasting background and text colour
-- `tna-background--accent` &mdash; a background colour based on the current template accent colour
-- `tna-background--accent-light` &mdash; a lighter background colour based on the current template accent colour
+- `tna-background-tint` &mdash; a light, neutral background colour to highlight an area of the page
+- `tna-background-contrast` &mdash; a contrasting background and text colour
+- `tna-background-accent` &mdash; a background colour based on the current template accent colour
+- `tna-background-accent-light` &mdash; a lighter background colour based on the current template accent colour
 
 For component design, you can also use the SCSS mixins from the `tools/colour` module to acheve the same results: