@nationalarchives/frontend 0.1.32 → 0.1.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (86) hide show
  1. package/nationalarchives/all.css +11 -9
  2. package/nationalarchives/all.css.map +1 -1
  3. package/nationalarchives/all.scss +9 -7
  4. package/nationalarchives/assets/fonts/OpenSans-Italic.ttf +0 -0
  5. package/nationalarchives/components/breadcrumbs/breadcrumbs.css +1 -1
  6. package/nationalarchives/components/breadcrumbs/breadcrumbs.css.map +1 -1
  7. package/nationalarchives/components/breadcrumbs/breadcrumbs.stories.js +1 -2
  8. package/nationalarchives/components/button/button.css +1 -1
  9. package/nationalarchives/components/button/button.css.map +1 -1
  10. package/nationalarchives/components/button/button.scss +17 -18
  11. package/nationalarchives/components/card/card.css +1 -1
  12. package/nationalarchives/components/card/card.css.map +1 -1
  13. package/nationalarchives/components/card/card.stories.js +7 -7
  14. package/nationalarchives/components/card/fixtures.json +2 -2
  15. package/nationalarchives/components/card/macro-options.json +1 -1
  16. package/nationalarchives/components/card/template.njk +1 -1
  17. package/nationalarchives/components/checkboxes/checkboxes.css +1 -1
  18. package/nationalarchives/components/checkboxes/checkboxes.css.map +1 -1
  19. package/nationalarchives/components/cookie-banner/cookie-banner.css +1 -1
  20. package/nationalarchives/components/cookie-banner/cookie-banner.css.map +1 -1
  21. package/nationalarchives/components/cookie-banner/cookie-banner.scss +12 -2
  22. package/nationalarchives/components/cookie-banner/cookie-banner.stories.js +11 -2
  23. package/nationalarchives/components/cookie-banner/macro-options.json +6 -0
  24. package/nationalarchives/components/cookie-banner/template.njk +7 -0
  25. package/nationalarchives/components/date-input/date-input.css +1 -1
  26. package/nationalarchives/components/date-input/date-input.css.map +1 -1
  27. package/nationalarchives/components/date-search/date-search.css +1 -1
  28. package/nationalarchives/components/date-search/date-search.css.map +1 -1
  29. package/nationalarchives/components/featured-records/featured-records.css +1 -1
  30. package/nationalarchives/components/featured-records/featured-records.css.map +1 -1
  31. package/nationalarchives/components/filters/filters.css +1 -1
  32. package/nationalarchives/components/filters/filters.css.map +1 -1
  33. package/nationalarchives/components/footer/fixtures.json +2 -2
  34. package/nationalarchives/components/footer/footer.css +1 -1
  35. package/nationalarchives/components/footer/footer.css.map +1 -1
  36. package/nationalarchives/components/footer/template.njk +2 -2
  37. package/nationalarchives/components/gallery/gallery.css +1 -1
  38. package/nationalarchives/components/gallery/gallery.css.map +1 -1
  39. package/nationalarchives/components/grid/grid.css +1 -1
  40. package/nationalarchives/components/grid/grid.css.map +1 -1
  41. package/nationalarchives/components/header/header.css +1 -1
  42. package/nationalarchives/components/header/header.css.map +1 -1
  43. package/nationalarchives/components/header/header.stories.js +1 -2
  44. package/nationalarchives/components/header/template.njk +1 -1
  45. package/nationalarchives/components/hero/hero.css +1 -1
  46. package/nationalarchives/components/hero/hero.css.map +1 -1
  47. package/nationalarchives/components/hero/hero.stories.js +1 -2
  48. package/nationalarchives/components/index-grid/index-grid.css +1 -1
  49. package/nationalarchives/components/index-grid/index-grid.css.map +1 -1
  50. package/nationalarchives/components/message/message.css +1 -1
  51. package/nationalarchives/components/message/message.css.map +1 -1
  52. package/nationalarchives/components/pagination/pagination.css +1 -1
  53. package/nationalarchives/components/pagination/pagination.css.map +1 -1
  54. package/nationalarchives/components/phase-banner/phase-banner.css +1 -1
  55. package/nationalarchives/components/phase-banner/phase-banner.css.map +1 -1
  56. package/nationalarchives/components/picture/picture.css +1 -1
  57. package/nationalarchives/components/picture/picture.css.map +1 -1
  58. package/nationalarchives/components/picture/picture.scss +15 -1
  59. package/nationalarchives/components/radios/radios.css +1 -1
  60. package/nationalarchives/components/radios/radios.css.map +1 -1
  61. package/nationalarchives/components/search-field/search-field.css +1 -1
  62. package/nationalarchives/components/search-field/search-field.css.map +1 -1
  63. package/nationalarchives/components/select/select.css +1 -1
  64. package/nationalarchives/components/select/select.css.map +1 -1
  65. package/nationalarchives/components/select/select.scss +1 -1
  66. package/nationalarchives/components/sensitive-image/sensitive-image.css +1 -1
  67. package/nationalarchives/components/sensitive-image/sensitive-image.css.map +1 -1
  68. package/nationalarchives/components/sensitive-image/sensitive-image.stories.js +1 -2
  69. package/nationalarchives/components/skip-link/skip-link.css +1 -1
  70. package/nationalarchives/components/skip-link/skip-link.css.map +1 -1
  71. package/nationalarchives/components/skip-link/skip-link.stories.js +1 -2
  72. package/nationalarchives/components/tabs/tabs.css +1 -1
  73. package/nationalarchives/components/tabs/tabs.css.map +1 -1
  74. package/nationalarchives/components/tabs/tabs.stories.js +1 -2
  75. package/nationalarchives/components/text-input/text-input.css +1 -1
  76. package/nationalarchives/components/text-input/text-input.css.map +1 -1
  77. package/nationalarchives/components/textarea/textarea.css +1 -1
  78. package/nationalarchives/components/textarea/textarea.css.map +1 -1
  79. package/nationalarchives/prototype-kit.css +11 -9
  80. package/nationalarchives/prototype-kit.css.map +1 -1
  81. package/nationalarchives/stories/utilities/colour-schemes/colour-combinations.stories.js +3 -1
  82. package/nationalarchives/stories/utilities/colour-schemes/colour-themes.stories.js +2 -2
  83. package/nationalarchives/templates/layouts/_generic.njk +6 -1
  84. package/nationalarchives/utilities/_typography.scss +15 -8
  85. package/nationalarchives/variables/_typography.scss +2 -1
  86. package/package.json +11 -12
@@ -87,9 +87,10 @@ const Template = () => {
87
87
  </ul>
88
88
  ${TextInput({
89
89
  params: {
90
+ label: "Input",
90
91
  id: `name-${theme}-${block}-${accent}`,
91
92
  name: `name-${theme}-${block}-${accent}`,
92
- value: `name-${theme}-${block}-${accent}`,
93
+ value: `Lorem ipsum`,
93
94
  },
94
95
  })}
95
96
  ${Checkboxes({
@@ -132,6 +133,7 @@ const Template = () => {
132
133
  })}
133
134
  ${Select({
134
135
  params: {
136
+ label: "Select",
135
137
  id: `sort-${theme}-${block}-${accent}`,
136
138
  name: `sort-${theme}-${block}-${accent}`,
137
139
  items: [
@@ -472,7 +472,7 @@ const Template = ({ theme, accent }) => {
472
472
  ${Card({
473
473
  params: {
474
474
  ...cardDefaultOptions,
475
- style: "boxed",
475
+ style: "contrast",
476
476
  classes: "tna-!--margin-bottom-m",
477
477
  },
478
478
  })}
@@ -505,7 +505,7 @@ const Template = ({ theme, accent }) => {
505
505
  params: {
506
506
  ...cardDefaultOptions,
507
507
  horizontal: true,
508
- style: "boxed",
508
+ style: "contrast",
509
509
  classes: "tna-!--margin-bottom-m",
510
510
  },
511
511
  })}
@@ -1,13 +1,18 @@
1
1
  {# Based on https://github.com/alphagov/govuk-frontend/blob/8b6bf304b9fc891f64459c25a08f3d623f3fea72/packages/govuk-frontend/src/govuk/template.njk #}
2
+
2
3
  {% from "nationalarchives/components/cookie-banner/macro.njk" import tnaCookieBanner -%}
3
4
  {% from "nationalarchives/components/footer/macro.njk" import tnaFooter -%}
4
5
  {% from "nationalarchives/components/header/macro.njk" import tnaHeader -%}
5
6
  {% from "nationalarchives/components/skip-link/macro.njk" import tnaSkipLink -%}
7
+
8
+ {% set siteTitle = 'The National Archives' %}
9
+ {% set pageTitle = '' %}
10
+
6
11
  <!DOCTYPE html>
7
12
  <html lang="{{ htmlLang | default('en-GB') }}" class="tna-template tna-template--{{ theme | default('system') }}-theme tna-template--{{ themeAccent | default('black') }}-accent {{ htmlClasses }}">
8
13
  <head>
9
14
  <meta charset="utf-8">
10
- <title>{% block pageTitle %}The National Archives{% endblock %}</title>
15
+ <title>{% block pageTitle %}{% if pageTitle %}{{ pageTitle }} - {{ siteTitle }}{% else %}{{ siteTitle }}{% endif %}{% endblock %}</title>
11
16
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
12
17
  <meta name="theme-color" content="{{ themeColor | default('#000000') }}">
13
18
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -17,6 +17,14 @@
17
17
  // font-display: swap;
18
18
  }
19
19
 
20
+ @font-face {
21
+ font-family: "Open Sans";
22
+ src: url("#{assets.$tna-font-path}/OpenSans-Italic.ttf");
23
+ font-weight: typographyVars.$main-font-weight;
24
+ font-style: italic;
25
+ // font-display: swap;
26
+ }
27
+
20
28
  @font-face {
21
29
  font-family: "Open Sans";
22
30
  src: url("#{assets.$tna-font-path}/OpenSans-Bold.ttf");
@@ -41,7 +49,7 @@
41
49
  // font-display: swap;
42
50
  }
43
51
  } @else {
44
- @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@#{typographyVars.$main-font-weight};#{typographyVars.$main-font-weight-bold}&family=Roboto+Mono:wght@#{typographyVars.$detail-font-weight};#{typographyVars.$detail-font-weight-bold}&display=swap"); /* stylelint-disable-line */
52
+ @import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,#{typographyVars.$main-font-weight};0,#{typographyVars.$main-font-weight-bold};1,#{typographyVars.$main-font-weight}&family=Roboto+Mono:wght@#{typographyVars.$detail-font-weight};#{typographyVars.$detail-font-weight-bold}&display=swap"); /* stylelint-disable-line */
45
53
  }
46
54
 
47
55
  .tna-template {
@@ -208,13 +216,12 @@ small {
208
216
 
209
217
  %heading {
210
218
  @include colour.colour-font("font-dark");
219
+ text-wrap: pretty;
211
220
 
212
221
  &:not(.tna-heading--no-link-arrow) {
213
222
  a {
214
223
  display: inline-block;
215
224
 
216
- // text-wrap: balance;
217
-
218
225
  &::after {
219
226
  padding-left: 0.25rem;
220
227
 
@@ -225,11 +232,11 @@ small {
225
232
  content: "\203A";
226
233
  }
227
234
 
228
- // &:hover {
229
- // &::after {
230
- // padding-left: 0.5rem;
231
- // }
232
- // }
235
+ &:hover {
236
+ &::after {
237
+ padding-left: 0.5rem;
238
+ }
239
+ }
233
240
  }
234
241
  }
235
242
  }
@@ -10,7 +10,8 @@ $body-line-height: #{math.div($relative-1rem-px, $body-font-size-px) * 2} !defau
10
10
 
11
11
  $interactive-text-decoration-thickness: 3.5px !default;
12
12
 
13
- $main-font-family: "Open Sans", sans-serif !default;
13
+ $main-font: "Open Sans" !default;
14
+ $main-font-family: $main-font, sans-serif !default;
14
15
  $main-font-weight: 400 !default;
15
16
  $main-font-weight-bold: 700 !default;
16
17
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nationalarchives/frontend",
3
- "version": "0.1.32",
3
+ "version": "0.1.33",
4
4
  "description": "The National Archives frontend styles",
5
5
  "scripts": {
6
6
  "start": "storybook dev -p 6006",
@@ -40,17 +40,16 @@
40
40
  "@babel/preset-env": "^7.23.2",
41
41
  "@chromaui/addon-visual-tests": "^0.0.124",
42
42
  "@mdx-js/react": "^3.0.0",
43
- "@storybook/addon-a11y": "^7.6.4",
44
- "@storybook/addon-docs": "^7.6.4",
45
- "@storybook/addon-essentials": "^7.6.4",
46
- "@storybook/addon-interactions": "^7.6.4",
47
- "@storybook/addon-links": "^7.6.4",
48
- "@storybook/addon-mdx-gfm": "^7.6.4",
49
- "@storybook/html": "^7.6.4",
50
- "@storybook/html-webpack5": "^7.6.4",
51
- "@storybook/jest": "^0.2.3",
43
+ "@storybook/addon-a11y": "^7.6.6",
44
+ "@storybook/addon-docs": "^7.6.6",
45
+ "@storybook/addon-essentials": "^7.6.6",
46
+ "@storybook/addon-interactions": "^7.6.6",
47
+ "@storybook/addon-links": "^7.6.6",
48
+ "@storybook/addon-mdx-gfm": "^7.6.6",
49
+ "@storybook/html": "^7.6.6",
50
+ "@storybook/html-webpack5": "^7.6.6",
51
+ "@storybook/test": "^8.0.0-alpha.5",
52
52
  "@storybook/test-runner": "^0.16.0",
53
- "@storybook/testing-library": "^0.2.2",
54
53
  "axe-playwright": "^1.2.3",
55
54
  "babel-jest": "^29.7.0",
56
55
  "babel-loader": "^9.0.1",
@@ -72,7 +71,7 @@
72
71
  "sass": "^1.69.4",
73
72
  "sass-loader": "^13.0.2",
74
73
  "simple-nunjucks-loader": "^3.2.0",
75
- "storybook": "^7.6.4",
74
+ "storybook": "^7.6.6",
76
75
  "style-loader": "^3.3.1",
77
76
  "stylelint": "^16.0.2",
78
77
  "stylelint-config-standard-scss": "^12.0.0",