@nationalarchives/frontend 0.2.7 → 0.2.9

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 (123) hide show
  1. package/nationalarchives/all.css +1 -1
  2. package/nationalarchives/all.css.map +1 -1
  3. package/nationalarchives/all.js +1 -1
  4. package/nationalarchives/all.js.map +1 -1
  5. package/nationalarchives/analytics.js +1 -1
  6. package/nationalarchives/analytics.js.map +1 -1
  7. package/nationalarchives/analytics.mjs +2 -4
  8. package/nationalarchives/components/accordion/accordion.css.map +1 -1
  9. package/nationalarchives/components/accordion/accordion.scss +1 -3
  10. package/nationalarchives/components/breadcrumbs/breadcrumbs.css +1 -1
  11. package/nationalarchives/components/breadcrumbs/breadcrumbs.css.map +1 -1
  12. package/nationalarchives/components/breadcrumbs/breadcrumbs.scss +3 -3
  13. package/nationalarchives/components/button/button.css +1 -1
  14. package/nationalarchives/components/button/button.css.map +1 -1
  15. package/nationalarchives/components/button/button.scss +43 -8
  16. package/nationalarchives/components/card/card.css +1 -1
  17. package/nationalarchives/components/card/card.css.map +1 -1
  18. package/nationalarchives/components/card/card.scss +3 -1
  19. package/nationalarchives/components/card/fixtures.json +25 -1
  20. package/nationalarchives/components/card/macro-options.json +6 -0
  21. package/nationalarchives/components/card/template.njk +3 -3
  22. package/nationalarchives/components/checkboxes/checkboxes.css +1 -1
  23. package/nationalarchives/components/checkboxes/checkboxes.css.map +1 -1
  24. package/nationalarchives/components/checkboxes/checkboxes.scss +1 -1
  25. package/nationalarchives/components/compound-filters/compound-filters.css.map +1 -1
  26. package/nationalarchives/components/cookie-banner/cookie-banner.css +1 -1
  27. package/nationalarchives/components/cookie-banner/cookie-banner.css.map +1 -1
  28. package/nationalarchives/components/cookie-banner/cookie-banner.scss +3 -3
  29. package/nationalarchives/components/date-input/date-input.css +1 -1
  30. package/nationalarchives/components/date-input/date-input.css.map +1 -1
  31. package/nationalarchives/components/date-search/date-search.css +1 -1
  32. package/nationalarchives/components/date-search/date-search.css.map +1 -1
  33. package/nationalarchives/components/details/details.css +1 -1
  34. package/nationalarchives/components/details/details.css.map +1 -1
  35. package/nationalarchives/components/details/details.scss +5 -1
  36. package/nationalarchives/components/error-summary/error-summary.css +1 -1
  37. package/nationalarchives/components/error-summary/error-summary.css.map +1 -1
  38. package/nationalarchives/components/error-summary/error-summary.scss +3 -1
  39. package/nationalarchives/components/files-list/files-list.css +1 -1
  40. package/nationalarchives/components/files-list/files-list.css.map +1 -1
  41. package/nationalarchives/components/files-list/files-list.scss +2 -1
  42. package/nationalarchives/components/footer/fixtures.json +1 -1
  43. package/nationalarchives/components/footer/footer.css.map +1 -1
  44. package/nationalarchives/components/footer/template.njk +1 -1
  45. package/nationalarchives/components/gallery/fixtures.json +31 -1
  46. package/nationalarchives/components/gallery/gallery.css +1 -1
  47. package/nationalarchives/components/gallery/gallery.css.map +1 -1
  48. package/nationalarchives/components/gallery/gallery.js +1 -1
  49. package/nationalarchives/components/gallery/gallery.js.map +1 -1
  50. package/nationalarchives/components/gallery/gallery.mjs +12 -3
  51. package/nationalarchives/components/gallery/gallery.scss +9 -11
  52. package/nationalarchives/components/gallery/macro-options.json +3 -3
  53. package/nationalarchives/components/gallery/template.njk +4 -5
  54. package/nationalarchives/components/global-header/global-header.css.map +1 -1
  55. package/nationalarchives/components/header/header.css.map +1 -1
  56. package/nationalarchives/components/hero/fixtures.json +7 -7
  57. package/nationalarchives/components/hero/hero.css +1 -1
  58. package/nationalarchives/components/hero/hero.css.map +1 -1
  59. package/nationalarchives/components/hero/hero.scss +2 -0
  60. package/nationalarchives/components/hero/template.njk +1 -1
  61. package/nationalarchives/components/index-grid/fixtures.json +9 -9
  62. package/nationalarchives/components/index-grid/index-grid.css +1 -1
  63. package/nationalarchives/components/index-grid/index-grid.css.map +1 -1
  64. package/nationalarchives/components/index-grid/index-grid.scss +2 -0
  65. package/nationalarchives/components/index-grid/template.njk +1 -1
  66. package/nationalarchives/components/phase-banner/phase-banner.css.map +1 -1
  67. package/nationalarchives/components/picture/fixtures.json +6 -3
  68. package/nationalarchives/components/picture/macro-options.json +6 -0
  69. package/nationalarchives/components/picture/picture.css +1 -1
  70. package/nationalarchives/components/picture/picture.css.map +1 -1
  71. package/nationalarchives/components/picture/picture.js +1 -1
  72. package/nationalarchives/components/picture/picture.js.map +1 -1
  73. package/nationalarchives/components/picture/picture.mjs +27 -12
  74. package/nationalarchives/components/picture/picture.scss +19 -10
  75. package/nationalarchives/components/picture/template.njk +7 -2
  76. package/nationalarchives/components/quick-filters/quick-filters.css +1 -1
  77. package/nationalarchives/components/quick-filters/quick-filters.css.map +1 -1
  78. package/nationalarchives/components/radios/radios.css +1 -1
  79. package/nationalarchives/components/radios/radios.css.map +1 -1
  80. package/nationalarchives/components/radios/radios.scss +1 -1
  81. package/nationalarchives/components/records-list/records-list.css.map +1 -1
  82. package/nationalarchives/components/search-field/search-field.css +1 -1
  83. package/nationalarchives/components/search-field/search-field.css.map +1 -1
  84. package/nationalarchives/components/select/select.css +1 -1
  85. package/nationalarchives/components/select/select.css.map +1 -1
  86. package/nationalarchives/components/sidebar/sidebar.css +1 -1
  87. package/nationalarchives/components/sidebar/sidebar.css.map +1 -1
  88. package/nationalarchives/components/sidebar/sidebar.scss +34 -7
  89. package/nationalarchives/components/skip-link/skip-link.css.map +1 -1
  90. package/nationalarchives/components/tabs/fixtures.json +5 -5
  91. package/nationalarchives/components/tabs/macro-options.json +6 -6
  92. package/nationalarchives/components/tabs/tabs.css +1 -1
  93. package/nationalarchives/components/tabs/tabs.css.map +1 -1
  94. package/nationalarchives/components/tabs/tabs.js +1 -1
  95. package/nationalarchives/components/tabs/tabs.js.map +1 -1
  96. package/nationalarchives/components/tabs/tabs.mjs +51 -135
  97. package/nationalarchives/components/tabs/tabs.scss +67 -79
  98. package/nationalarchives/components/tabs/template.njk +9 -2
  99. package/nationalarchives/components/text-input/text-input.css +1 -1
  100. package/nationalarchives/components/text-input/text-input.css.map +1 -1
  101. package/nationalarchives/components/textarea/textarea.css +1 -1
  102. package/nationalarchives/components/textarea/textarea.css.map +1 -1
  103. package/nationalarchives/components/warning/warning.css +1 -1
  104. package/nationalarchives/components/warning/warning.css.map +1 -1
  105. package/nationalarchives/global-header-package.css +1 -1
  106. package/nationalarchives/global-header-package.css.map +1 -1
  107. package/nationalarchives/global-header-package.scss +1 -1
  108. package/nationalarchives/print.css.map +1 -1
  109. package/nationalarchives/prototype-kit.css +1 -1
  110. package/nationalarchives/prototype-kit.css.map +1 -1
  111. package/nationalarchives/templates/fixtures.json +1 -1
  112. package/nationalarchives/tools/_a11y.scss +9 -3
  113. package/nationalarchives/tools/_colour.scss +67 -8
  114. package/nationalarchives/utilities/_a11y.scss +17 -12
  115. package/nationalarchives/utilities/_animations.scss +10 -0
  116. package/nationalarchives/utilities/_index.scss +1 -0
  117. package/nationalarchives/utilities/grid/_index.scss +28 -24
  118. package/nationalarchives/utilities/grid/macro-options.json +1 -1
  119. package/nationalarchives/utilities/grid/template.njk +2 -2
  120. package/nationalarchives/utilities/lists/_index.scss +13 -2
  121. package/nationalarchives/utilities/typography/_index.scss +30 -4
  122. package/nationalarchives/variables/_features.scss +1 -0
  123. package/package.json +1 -1
@@ -45,7 +45,7 @@
45
45
  "name": "index grid",
46
46
  "template": "index-grid.njk",
47
47
  "options": {},
48
- "html": "<!DOCTYPE html><html lang=\"en\" class=\"tna-template tna-template--blue-accent\"><head><meta charset=\"utf-8\"><title>Index list page - The National Archives</title><meta name=\"viewport\" content=\"width=device-width, initial-scale=1, viewport-fit=cover\"><meta name=\"theme-color\" content=\"#010101\"><meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"><link rel=\"shortcut icon\" sizes=\"16x16 32x32 48x48\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/favicon.ico\" type=\"image/x-icon\"><link rel=\"mask-icon\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/mask-icon.svg\" color=\"#010101\"><link rel=\"apple-touch-icon\" sizes=\"48x48\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-48x48.png\"><link rel=\"apple-touch-icon\" sizes=\"72x72\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-72x72.png\"><link rel=\"apple-touch-icon\" sizes=\"96x96\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-96x96.png\"><link rel=\"apple-touch-icon\" sizes=\"120x120\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-120x120.png\"><link rel=\"apple-touch-icon\" sizes=\"144x144\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-144x144.png\"><link rel=\"apple-touch-icon\" sizes=\"152x152\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-152x152.png\"><link rel=\"apple-touch-icon\" sizes=\"167x167\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-167x167.png\"><link rel=\"apple-touch-icon\" sizes=\"180x180\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-180x180.png\"><link rel=\"apple-touch-icon\" sizes=\"192x192\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-192x192.png\"><link rel=\"apple-touch-icon\" sizes=\"256x256\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-256x256.png\"><link rel=\"apple-touch-icon\" sizes=\"512x512\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-512x512.png\"><link rel=\"apple-touch-icon\" sizes=\"1024x1024\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-1024x1024.png\"><link rel=\"stylesheet\" type=\"text/css\" href=\"https://use.typekit.net/hkj3kuz.css\"></head><body class=\"tna-template__body\"><section class=\"tna-cookie-banner\" data-module=\"tna-cookie-banner\" data-policies=\"\" data-preferenceskey=\"\" data-policieskey=\"\" data-domain=\"\" data-path=\"\" data-insecure=\"false\" aria-label=\"Cookies on \" hidden><div class=\"tna-container\"><div class=\"tna-column tna-column--full tna-cookie-banner__message tna-cookie-banner__message--prompt\"><h2 class=\"tna-heading-m\">This website uses cookies</h2><p>We use some essential cookies to make this service work.</p><p>We'd also like to use analytics cookies so we can understand how you use the service and make improvements.</p><div class=\"tna-button-group\"><button class=\"tna-button\" type=\"button\" value=\"accept\">Accept cookies</button><button class=\"tna-button\" type=\"button\" value=\"reject\">Reject cookies</button><a href=\"#/cookies\" class=\"tna-button tna-button--plain\">Set cookie preferences</a></div></div><div class=\"tna-column tna-column--full tna-cookie-banner__message tna-cookie-banner__message--accepted\" tabindex=\"0\" hidden><p>You have accepted optional cookies. You can change your cookie settings on the <a href=\"#/cookies\">cookies page</a>.</p><div class=\"tna-button-group\"><button class=\"tna-button\" type=\"button\" value=\"close\">Close this message</button></div></div><div class=\"tna-column tna-column--full tna-cookie-banner__message tna-cookie-banner__message--rejected\" tabindex=\"0\" hidden><p>You have rejected optional cookies. You can change your cookie settings on the <a href=\"#/cookies\">cookies page</a>.</p><div class=\"tna-button-group\"><button class=\"tna-button\" type=\"button\" value=\"close\">Close this message</button></div></div></div></section><a href=\"#main-content\" class=\"tna-skip-link\" data-module=\"tna-skip-link\">Skip to main content</a><header class=\"tna-header\" data-module=\"tna-header\"><div class=\"tna-container tna-header__contents\"><div class=\"tna-column tna-header__logo\"><span class=\"tna-header__logo-contents\"><svg xmlns=\"http://www.w3.org/2000/svg\" xml:space=\"preserve\" class=\"tna-logo\" viewBox=\"0 0 160 160\" width=\"96\" height=\"96\"><title>The National Archives</title><path fill=\"transparent\" d=\"M0 0h160v160H0z\" class=\"tna-logo__background\"/><g class=\"tna-logo__foreground\" fill=\"currentColor\"><path d=\"M1.9 107.2h156.3V158H1.9v-50.8zm0-52.7h156.3v50.8H1.9V54.5zm0-52.6h77.2v50.8H1.9V1.9zm79 0h77.2v50.8H80.9V1.9zm0-1.9H0v160h160V0H80.9z\"/><path d=\"M21.3 19.5h-5.4v-3h14.3v3h-5.4v18.4h-3.5zM31.6 16.5H35v9h8.4v-9h3.4v21.4h-3.4v-9.3H35v9.3h-3.4zM50.9 16.5h12.2v3h-8.8v6.1h7.4v3h-7.4v6.3h8.8v3H50.9zM19.7 69.2h3.8l6.4 12.5c.6 1.1 1.1 2.7 1.6 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.5v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2H23c.2 1.4.3 3.3.3 5v11.5h-3.5c-.1 0-.1-21.4-.1-21.4zM47.8 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8H45c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zM43 69.2h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6L43 69.2zM57.2 72.3h-5.4v-3.1H66v3.1h-5.4v18.4h-3.4zM67.8 69.2h3.5v21.4h-3.5zM87.5 80c0-5.3-1.7-8-4.8-8-3.2 0-4.8 2.7-4.8 8 0 5.2 1.6 7.9 4.8 7.9 3.2 0 4.8-2.7 4.8-7.9m-13.3 0c0-7 3-11.1 8.5-11.1 5.4 0 8.4 4.1 8.4 11.1 0 6.9-3 11-8.4 11s-8.5-4.1-8.5-11M94.3 69.2H98l6.4 12.5c.6 1.1 1.2 2.7 1.7 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.4v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2h-.2c.2 1.4.3 3.3.3 5v11.5h-3.5V69.2zM122.4 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM129.9 69.2h3.5v18.4h8.4v3.1h-11.9zM26.9 135.2l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4H29l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM39.9 132.5c2.5 0 3.4-1.6 3.4-3.9 0-2.2-1-3.8-3.4-3.8h-2.7v7.7h2.7zm-6.1-10.7h6.4c4.5 0 6.7 2.4 6.7 6.6 0 3.1-1.5 5.6-3.7 6.3v.2c1 1.1 4 7.5 4.8 7.9v.5h-3.8c-1-.6-3.6-7.2-4.4-7.8h-2.5v7.8h-3.5v-21.5zM52.9 132.5c0 5.3 1.9 8 4.8 8s4-2 4-5.2l3.5.1c0 .2.1.4.1.6 0 4.4-2.1 7.5-7.5 7.5-5.2 0-8.5-3.9-8.5-11.1 0-7.1 3.3-11 8.5-11 6.4 0 7.5 4.6 7.5 7.2 0 .3 0 .7-.1.9l-3.5.1c0-3.3-1.2-5.2-4-5.2-2.9.2-4.8 2.9-4.8 8.1M68 121.8h3.5v9.1h8.3v-9.1h3.5v21.5h-3.5v-9.4h-8.3v9.4H68zM87.9 121.8h3.5v21.4h-3.5zM94.2 121.8h3.6l3.2 12.3c.5 1.9.8 3.6 1.1 5.6h.2c.3-2 .6-3.7 1.1-5.6l3.2-12.3h3.6l-6.1 21.4H100l-5.8-21.4zM112.7 121.8H125v3.1h-8.8v6h7.4v3h-7.4v6.3h8.8v3.1h-12.3zM130.4 136c0 .2-.1.5-.1.8 0 1.9.8 3.7 3.4 3.7 2.1 0 3.3-1.2 3.3-2.9 0-1.6-.7-2.4-2.2-3l-3.4-1.3c-2.4-.9-4.2-2.4-4.2-5.7 0-3.5 2.3-6.1 6.6-6.1 5.5 0 6.4 3.6 6.4 5.9 0 .3 0 .7-.1 1.1l-3.4.1c0-.2.1-.5.1-.7 0-1.7-.6-3.2-3-3.2-2.1 0-3 1.2-3 2.8 0 1.7.9 2.5 2.2 2.9l3.5 1.3c2.6 1 4.3 2.6 4.3 5.8 0 3.6-2.4 6.1-7 6.1-5.9 0-6.8-3.9-6.8-6.5 0-.3 0-.6.1-1l3.3-.1z\"/></g></svg></span></div></div></header><div class=\"tna-background-accent\"><div class=\"tna-container\"><div class=\"tna-column tna-column--full\"><nav class=\"tna-breadcrumbs\" data-module=\"tna-breadcrumbs\" aria-label=\"Breadcrumb\"><ol class=\"tna-breadcrumbs__list\"><li class=\"tna-breadcrumbs__item\"><a href=\"/\" class=\"tna-breadcrumbs__link\">Home</a></li></ol></nav></div></div></div><main class=\"tna-main\" id=\"main-content\"><div class=\"tna-background-accent tna-!--padding-vertical-xl\"><div class=\"tna-container\"><div class=\"tna-column tna-column--width-2-3 tna-column--width-5-6-medium tna-column--full-small tna-column--full-tiny\"><h1 class=\"tna-heading-xl\">Index list page</h1><p class=\"tna-large-paragraph\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam sit amet luctus libero. Cras nec mauris ex. Fusce nisl erat, efficitur sed auctor ornare, varius fermentum arcu.</p></div></div></div><section class=\"tna-section\"><nav class=\"tna-index-grid\" aria-label=\"Topics\"><ul class=\"tna-index-grid__items tna-container\"><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\" title=\"Topic\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li></ul></nav></section></main><footer class=\"tna-footer\" data-module=\"tna-footer\"><div class=\"tna-footer__inner\"><div class=\"tna-container\"><div class=\"tna-column tna-column--flex-1 tna-column--width-1-2-medium tna-column--full-small tna-column--full-tiny tna-column--order-1\"><svg xmlns=\"http://www.w3.org/2000/svg\" xml:space=\"preserve\" class=\"tna-logo\" viewBox=\"0 0 160 160\" width=\"96\" height=\"96\"><title>The National Archives</title><path fill=\"transparent\" d=\"M0 0h160v160H0z\" class=\"tna-logo__background\" /><g class=\"tna-logo__foreground\" fill=\"currentColor\"><path d=\"M1.9 107.2h156.3V158H1.9v-50.8zm0-52.7h156.3v50.8H1.9V54.5zm0-52.6h77.2v50.8H1.9V1.9zm79 0h77.2v50.8H80.9V1.9zm0-1.9H0v160h160V0H80.9z\" /><path d=\"M21.3 19.5h-5.4v-3h14.3v3h-5.4v18.4h-3.5zM31.6 16.5H35v9h8.4v-9h3.4v21.4h-3.4v-9.3H35v9.3h-3.4zM50.9 16.5h12.2v3h-8.8v6.1h7.4v3h-7.4v6.3h8.8v3H50.9zM19.7 69.2h3.8l6.4 12.5c.6 1.1 1.1 2.7 1.6 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.5v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2H23c.2 1.4.3 3.3.3 5v11.5h-3.5c-.1 0-.1-21.4-.1-21.4zM47.8 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8H45c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zM43 69.2h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6L43 69.2zM57.2 72.3h-5.4v-3.1H66v3.1h-5.4v18.4h-3.4zM67.8 69.2h3.5v21.4h-3.5zM87.5 80c0-5.3-1.7-8-4.8-8-3.2 0-4.8 2.7-4.8 8 0 5.2 1.6 7.9 4.8 7.9 3.2 0 4.8-2.7 4.8-7.9m-13.3 0c0-7 3-11.1 8.5-11.1 5.4 0 8.4 4.1 8.4 11.1 0 6.9-3 11-8.4 11s-8.5-4.1-8.5-11M94.3 69.2H98l6.4 12.5c.6 1.1 1.2 2.7 1.7 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.4v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2h-.2c.2 1.4.3 3.3.3 5v11.5h-3.5V69.2zM122.4 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM129.9 69.2h3.5v18.4h8.4v3.1h-11.9zM26.9 135.2l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4H29l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM39.9 132.5c2.5 0 3.4-1.6 3.4-3.9 0-2.2-1-3.8-3.4-3.8h-2.7v7.7h2.7zm-6.1-10.7h6.4c4.5 0 6.7 2.4 6.7 6.6 0 3.1-1.5 5.6-3.7 6.3v.2c1 1.1 4 7.5 4.8 7.9v.5h-3.8c-1-.6-3.6-7.2-4.4-7.8h-2.5v7.8h-3.5v-21.5zM52.9 132.5c0 5.3 1.9 8 4.8 8s4-2 4-5.2l3.5.1c0 .2.1.4.1.6 0 4.4-2.1 7.5-7.5 7.5-5.2 0-8.5-3.9-8.5-11.1 0-7.1 3.3-11 8.5-11 6.4 0 7.5 4.6 7.5 7.2 0 .3 0 .7-.1.9l-3.5.1c0-3.3-1.2-5.2-4-5.2-2.9.2-4.8 2.9-4.8 8.1M68 121.8h3.5v9.1h8.3v-9.1h3.5v21.5h-3.5v-9.4h-8.3v9.4H68zM87.9 121.8h3.5v21.4h-3.5zM94.2 121.8h3.6l3.2 12.3c.5 1.9.8 3.6 1.1 5.6h.2c.3-2 .6-3.7 1.1-5.6l3.2-12.3h3.6l-6.1 21.4H100l-5.8-21.4zM112.7 121.8H125v3.1h-8.8v6h7.4v3h-7.4v6.3h8.8v3.1h-12.3zM130.4 136c0 .2-.1.5-.1.8 0 1.9.8 3.7 3.4 3.7 2.1 0 3.3-1.2 3.3-2.9 0-1.6-.7-2.4-2.2-3l-3.4-1.3c-2.4-.9-4.2-2.4-4.2-5.7 0-3.5 2.3-6.1 6.6-6.1 5.5 0 6.4 3.6 6.4 5.9 0 .3 0 .7-.1 1.1l-3.4.1c0-.2.1-.5.1-.7 0-1.7-.6-3.2-3-3.2-2.1 0-3 1.2-3 2.8 0 1.7.9 2.5 2.2 2.9l3.5 1.3c2.6 1 4.3 2.6 4.3 5.8 0 3.6-2.4 6.1-7 6.1-5.9 0-6.8-3.9-6.8-6.5 0-.3 0-.6.1-1l3.3-.1z\" /></g></svg><h2 class=\"tna-heading-m tna-footer__title\">The National Archives</h2><address class=\"tna-footer__address\">Kew, Richmond<br>TW9 4DU</address></div></div><div class=\"tna-container\"><div class=\"tna-column--full\"><hr></div></div><div class=\"tna-container tna-footer__licence\"><div class=\"tna-column tna-column--full-tiny\"><svg class=\"tna-footer__licence-logo\" xmlns=\"http://www.w3.org/2000/svg\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 483.2 195.7\" width=\"60\" height=\"24\"><title>Open Government Licence</title><path fill=\"currentColor\" d=\"M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145\" /></svg></div><div class=\"tna-column tna-column--flex-1\"><p>All content is available under the <a href=\"https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/\" class=\"tna-footer__link\">Open Government Licence v3.0</a>, except where otherwise stated</p></div><div class=\"tna-column tna-column--full-small tna-column--full-tiny tna-footer__govuk\"><a href=\"https://www.gov.uk/\" class=\"tna-footer__govuk-link\"><svg aria-hidden=\"true\" class=\"tna-footer__govuk-logotype-crown\" width=\"32\" height=\"30\" focusable=\"false\" viewBox=\"0 0 32 30\" xmlns=\"http://www.w3.org/2000/svg\"><title>GOV.UK</title><path d=\"M22.6 10.4c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m-5.9 6.7c-.9.4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m10.8-3.7c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s0 2-1 2.4m3.3 4.8c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4M17 4.7l2.3 1.2V2.5l-2.3.7-.2-.2.9-3h-3.4l.9 3-.2.2c-.1.1-2.3-.7-2.3-.7v3.4L15 4.7c.1.1.1.2.2.2l-1.3 4c-.1.2-.1.4-.1.6 0 1.1.8 2 1.9 2.2h.7c1-.2 1.9-1.1 1.9-2.1 0-.2 0-.4-.1-.6l-1.3-4c-.1-.2 0-.2.1-.3m-7.6 5.7c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m-5 3c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s.1 2 1 2.4m-3.2 4.8c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m14.8 11c4.4 0 8.6.3 12.3.8 1.1-4.5 2.4-7 3.7-8.8l-2.5-.9c.2 1.3.3 1.9 0 2.7-.4-.4-.8-1.1-1.1-2.3l-1.2 4c.7-.5 1.3-.8 2-.9-1.1 2.5-2.6 3.1-3.5 3-1.1-.2-1.7-1.2-1.5-2.1.3-1.2 1.5-1.5 2.1-.1 1.1-2.3-.8-3-2-2.3 1.9-1.9 2.1-3.5.6-5.6-2.1 1.6-2.1 3.2-1.2 5.5-1.2-1.4-3.2-.6-2.5 1.6.9-1.4 2.1-.5 1.9.8-.2 1.1-1.7 2.1-3.5 1.9-2.7-.2-2.9-2.1-2.9-3.6.7-.1 1.9.5 2.9 1.9l.4-4.3c-1.1 1.1-2.1 1.4-3.2 1.4.4-1.2 2.1-3 2.1-3h-5.4s1.7 1.9 2.1 3c-1.1 0-2.1-.2-3.2-1.4l.4 4.3c1-1.4 2.2-2 2.9-1.9-.1 1.5-.2 3.4-2.9 3.6-1.9.2-3.4-.8-3.5-1.9-.2-1.3 1-2.2 1.9-.8.7-2.3-1.2-3-2.5-1.6.9-2.2.9-3.9-1.2-5.5-1.5 2-1.3 3.7.6 5.6-1.2-.7-3.1 0-2 2.3.6-1.4 1.8-1.1 2.1.1.2.9-.3 1.9-1.5 2.1-.9.2-2.4-.5-3.5-3 .6 0 1.2.3 2 .9l-1.2-4c-.3 1.1-.7 1.9-1.1 2.3-.3-.8-.2-1.4 0-2.7l-2.9.9C1.3 23 2.6 25.5 3.7 30c3.7-.5 7.9-.8 12.3-.8\" fill=\"currentColor\" fill-rule=\"evenodd\" /></svg>GOV.UK</a></div></div></div></footer><script>if (window.TNAFrontend && window.TNAFrontend.initAll) {\n document.addEventListener(\"DOMContentLoaded\", function() {\n window.TNAFrontend.initAll();\n var cookies = new TNAFrontend.Cookies()\n var theme = cookies.get(\"theme\") || \"light\"\n var $tnaTemplate = document.querySelector(\".tna-template\");\n if (theme === \"light\") {\n $tnaTemplate.classList.remove(\n \"tna-template--system-theme\",\n \"tna-template--dark-theme\",\n );\n } else if (theme === \"dark\") {\n $tnaTemplate.classList.remove(\"tna-template--system-theme\");\n $tnaTemplate.classList.add(`tna-template--dark-theme`);\n } else if (theme === \"system\") {\n $tnaTemplate.classList.remove(\"tna-template--dark-theme\");\n $tnaTemplate.classList.add(`tna-template--system-theme`);\n }\n });\n }</script></body></html>"
48
+ "html": "<!DOCTYPE html><html lang=\"en\" class=\"tna-template tna-template--blue-accent\"><head><meta charset=\"utf-8\"><title>Index list page - The National Archives</title><meta name=\"viewport\" content=\"width=device-width, initial-scale=1, viewport-fit=cover\"><meta name=\"theme-color\" content=\"#010101\"><meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"><link rel=\"shortcut icon\" sizes=\"16x16 32x32 48x48\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/favicon.ico\" type=\"image/x-icon\"><link rel=\"mask-icon\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/mask-icon.svg\" color=\"#010101\"><link rel=\"apple-touch-icon\" sizes=\"48x48\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-48x48.png\"><link rel=\"apple-touch-icon\" sizes=\"72x72\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-72x72.png\"><link rel=\"apple-touch-icon\" sizes=\"96x96\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-96x96.png\"><link rel=\"apple-touch-icon\" sizes=\"120x120\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-120x120.png\"><link rel=\"apple-touch-icon\" sizes=\"144x144\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-144x144.png\"><link rel=\"apple-touch-icon\" sizes=\"152x152\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-152x152.png\"><link rel=\"apple-touch-icon\" sizes=\"167x167\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-167x167.png\"><link rel=\"apple-touch-icon\" sizes=\"180x180\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-180x180.png\"><link rel=\"apple-touch-icon\" sizes=\"192x192\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-192x192.png\"><link rel=\"apple-touch-icon\" sizes=\"256x256\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-256x256.png\"><link rel=\"apple-touch-icon\" sizes=\"512x512\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-512x512.png\"><link rel=\"apple-touch-icon\" sizes=\"1024x1024\" href=\"/plugin-assets/%40nationalarchives%2Ffrontend/nationalarchives/assets/images/icon-1024x1024.png\"><link rel=\"stylesheet\" type=\"text/css\" href=\"https://use.typekit.net/hkj3kuz.css\"></head><body class=\"tna-template__body\"><section class=\"tna-cookie-banner\" data-module=\"tna-cookie-banner\" data-policies=\"\" data-preferenceskey=\"\" data-policieskey=\"\" data-domain=\"\" data-path=\"\" data-insecure=\"false\" aria-label=\"Cookies on \" hidden><div class=\"tna-container\"><div class=\"tna-column tna-column--full tna-cookie-banner__message tna-cookie-banner__message--prompt\"><h2 class=\"tna-heading-m\">This website uses cookies</h2><p>We use some essential cookies to make this service work.</p><p>We'd also like to use analytics cookies so we can understand how you use the service and make improvements.</p><div class=\"tna-button-group\"><button class=\"tna-button\" type=\"button\" value=\"accept\">Accept cookies</button><button class=\"tna-button\" type=\"button\" value=\"reject\">Reject cookies</button><a href=\"#/cookies\" class=\"tna-button tna-button--plain\">Set cookie preferences</a></div></div><div class=\"tna-column tna-column--full tna-cookie-banner__message tna-cookie-banner__message--accepted\" tabindex=\"0\" hidden><p>You have accepted optional cookies. You can change your cookie settings on the <a href=\"#/cookies\">cookies page</a>.</p><div class=\"tna-button-group\"><button class=\"tna-button\" type=\"button\" value=\"close\">Close this message</button></div></div><div class=\"tna-column tna-column--full tna-cookie-banner__message tna-cookie-banner__message--rejected\" tabindex=\"0\" hidden><p>You have rejected optional cookies. You can change your cookie settings on the <a href=\"#/cookies\">cookies page</a>.</p><div class=\"tna-button-group\"><button class=\"tna-button\" type=\"button\" value=\"close\">Close this message</button></div></div></div></section><a href=\"#main-content\" class=\"tna-skip-link\" data-module=\"tna-skip-link\">Skip to main content</a><header class=\"tna-header\" data-module=\"tna-header\"><div class=\"tna-container tna-header__contents\"><div class=\"tna-column tna-header__logo\"><span class=\"tna-header__logo-contents\"><svg xmlns=\"http://www.w3.org/2000/svg\" xml:space=\"preserve\" class=\"tna-logo\" viewBox=\"0 0 160 160\" width=\"96\" height=\"96\"><title>The National Archives</title><path fill=\"transparent\" d=\"M0 0h160v160H0z\" class=\"tna-logo__background\"/><g class=\"tna-logo__foreground\" fill=\"currentColor\"><path d=\"M1.9 107.2h156.3V158H1.9v-50.8zm0-52.7h156.3v50.8H1.9V54.5zm0-52.6h77.2v50.8H1.9V1.9zm79 0h77.2v50.8H80.9V1.9zm0-1.9H0v160h160V0H80.9z\"/><path d=\"M21.3 19.5h-5.4v-3h14.3v3h-5.4v18.4h-3.5zM31.6 16.5H35v9h8.4v-9h3.4v21.4h-3.4v-9.3H35v9.3h-3.4zM50.9 16.5h12.2v3h-8.8v6.1h7.4v3h-7.4v6.3h8.8v3H50.9zM19.7 69.2h3.8l6.4 12.5c.6 1.1 1.1 2.7 1.6 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.5v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2H23c.2 1.4.3 3.3.3 5v11.5h-3.5c-.1 0-.1-21.4-.1-21.4zM47.8 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8H45c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zM43 69.2h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6L43 69.2zM57.2 72.3h-5.4v-3.1H66v3.1h-5.4v18.4h-3.4zM67.8 69.2h3.5v21.4h-3.5zM87.5 80c0-5.3-1.7-8-4.8-8-3.2 0-4.8 2.7-4.8 8 0 5.2 1.6 7.9 4.8 7.9 3.2 0 4.8-2.7 4.8-7.9m-13.3 0c0-7 3-11.1 8.5-11.1 5.4 0 8.4 4.1 8.4 11.1 0 6.9-3 11-8.4 11s-8.5-4.1-8.5-11M94.3 69.2H98l6.4 12.5c.6 1.1 1.2 2.7 1.7 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.4v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2h-.2c.2 1.4.3 3.3.3 5v11.5h-3.5V69.2zM122.4 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM129.9 69.2h3.5v18.4h8.4v3.1h-11.9zM26.9 135.2l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4H29l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM39.9 132.5c2.5 0 3.4-1.6 3.4-3.9 0-2.2-1-3.8-3.4-3.8h-2.7v7.7h2.7zm-6.1-10.7h6.4c4.5 0 6.7 2.4 6.7 6.6 0 3.1-1.5 5.6-3.7 6.3v.2c1 1.1 4 7.5 4.8 7.9v.5h-3.8c-1-.6-3.6-7.2-4.4-7.8h-2.5v7.8h-3.5v-21.5zM52.9 132.5c0 5.3 1.9 8 4.8 8s4-2 4-5.2l3.5.1c0 .2.1.4.1.6 0 4.4-2.1 7.5-7.5 7.5-5.2 0-8.5-3.9-8.5-11.1 0-7.1 3.3-11 8.5-11 6.4 0 7.5 4.6 7.5 7.2 0 .3 0 .7-.1.9l-3.5.1c0-3.3-1.2-5.2-4-5.2-2.9.2-4.8 2.9-4.8 8.1M68 121.8h3.5v9.1h8.3v-9.1h3.5v21.5h-3.5v-9.4h-8.3v9.4H68zM87.9 121.8h3.5v21.4h-3.5zM94.2 121.8h3.6l3.2 12.3c.5 1.9.8 3.6 1.1 5.6h.2c.3-2 .6-3.7 1.1-5.6l3.2-12.3h3.6l-6.1 21.4H100l-5.8-21.4zM112.7 121.8H125v3.1h-8.8v6h7.4v3h-7.4v6.3h8.8v3.1h-12.3zM130.4 136c0 .2-.1.5-.1.8 0 1.9.8 3.7 3.4 3.7 2.1 0 3.3-1.2 3.3-2.9 0-1.6-.7-2.4-2.2-3l-3.4-1.3c-2.4-.9-4.2-2.4-4.2-5.7 0-3.5 2.3-6.1 6.6-6.1 5.5 0 6.4 3.6 6.4 5.9 0 .3 0 .7-.1 1.1l-3.4.1c0-.2.1-.5.1-.7 0-1.7-.6-3.2-3-3.2-2.1 0-3 1.2-3 2.8 0 1.7.9 2.5 2.2 2.9l3.5 1.3c2.6 1 4.3 2.6 4.3 5.8 0 3.6-2.4 6.1-7 6.1-5.9 0-6.8-3.9-6.8-6.5 0-.3 0-.6.1-1l3.3-.1z\"/></g></svg></span></div></div></header><div class=\"tna-background-accent\"><div class=\"tna-container\"><div class=\"tna-column tna-column--full\"><nav class=\"tna-breadcrumbs\" data-module=\"tna-breadcrumbs\" aria-label=\"Breadcrumb\"><ol class=\"tna-breadcrumbs__list\"><li class=\"tna-breadcrumbs__item\"><a href=\"/\" class=\"tna-breadcrumbs__link\">Home</a></li></ol></nav></div></div></div><main class=\"tna-main\" id=\"main-content\"><div class=\"tna-background-accent tna-!--padding-vertical-xl\"><div class=\"tna-container\"><div class=\"tna-column tna-column--width-2-3 tna-column--width-5-6-medium tna-column--full-small tna-column--full-tiny\"><h1 class=\"tna-heading-xl\">Index list page</h1><p class=\"tna-large-paragraph\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam sit amet luctus libero. Cras nec mauris ex. Fusce nisl erat, efficitur sed auctor ornare, varius fermentum arcu.</p></div></div></div><section class=\"tna-section\"><nav class=\"tna-index-grid\" aria-label=\"Topics\"><ul class=\"tna-index-grid__items tna-container\"><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li><li class=\"tna-index-grid__item-wrapper tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--width-1-2-small tna-column--full-tiny\"><a href=\"#\" class=\"tna-index-grid__item\"><img src=\"https://fakeimg.pl/600x400/e4e4e4/343338?text=Topic%20image&amp;font=museo&amp;font_size=48\" class=\"tna-index-grid__item-image\" width=\"600\" height=\"400\" alt=\"Topic image\"><span class=\"tna-index-grid__item-content\"><span class=\"tna-index-grid__item-title\">Topic</span></span></a></li></ul></nav></section></main><footer class=\"tna-footer\" data-module=\"tna-footer\"><div class=\"tna-footer__inner\"><div class=\"tna-container\"><div class=\"tna-column tna-column--flex-1 tna-column--width-1-2-medium tna-column--full-small tna-column--full-tiny tna-column--order-1\"><svg xmlns=\"http://www.w3.org/2000/svg\" xml:space=\"preserve\" class=\"tna-logo\" viewBox=\"0 0 160 160\" width=\"96\" height=\"96\"><title>The National Archives</title><path fill=\"transparent\" d=\"M0 0h160v160H0z\" class=\"tna-logo__background\" /><g class=\"tna-logo__foreground\" fill=\"currentColor\"><path d=\"M1.9 107.2h156.3V158H1.9v-50.8zm0-52.7h156.3v50.8H1.9V54.5zm0-52.6h77.2v50.8H1.9V1.9zm79 0h77.2v50.8H80.9V1.9zm0-1.9H0v160h160V0H80.9z\" /><path d=\"M21.3 19.5h-5.4v-3h14.3v3h-5.4v18.4h-3.5zM31.6 16.5H35v9h8.4v-9h3.4v21.4h-3.4v-9.3H35v9.3h-3.4zM50.9 16.5h12.2v3h-8.8v6.1h7.4v3h-7.4v6.3h8.8v3H50.9zM19.7 69.2h3.8l6.4 12.5c.6 1.1 1.1 2.7 1.6 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.5v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2H23c.2 1.4.3 3.3.3 5v11.5h-3.5c-.1 0-.1-21.4-.1-21.4zM47.8 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8H45c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zM43 69.2h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6L43 69.2zM57.2 72.3h-5.4v-3.1H66v3.1h-5.4v18.4h-3.4zM67.8 69.2h3.5v21.4h-3.5zM87.5 80c0-5.3-1.7-8-4.8-8-3.2 0-4.8 2.7-4.8 8 0 5.2 1.6 7.9 4.8 7.9 3.2 0 4.8-2.7 4.8-7.9m-13.3 0c0-7 3-11.1 8.5-11.1 5.4 0 8.4 4.1 8.4 11.1 0 6.9-3 11-8.4 11s-8.5-4.1-8.5-11M94.3 69.2H98l6.4 12.5c.6 1.1 1.2 2.7 1.7 4h.2c-.2-1.7-.3-3.6-.3-4.8V69.2h3.4v21.4h-3.7l-6.3-12.3c-.7-1.4-1.2-2.7-1.7-4.2h-.2c.2 1.4.3 3.3.3 5v11.5h-3.5V69.2zM122.4 82.6l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4h-3.5l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM129.9 69.2h3.5v18.4h8.4v3.1h-11.9zM26.9 135.2l-1.7-6.3c-.3-1.1-.6-2.2-.9-3.8h-.2c-.3 1.6-.5 2.6-.8 3.8l-1.7 6.3h5.3zm-4.8-13.4h4.2l6.2 21.4H29l-1.5-5.2h-6.6l-1.4 5.2h-3.6l6.2-21.4zM39.9 132.5c2.5 0 3.4-1.6 3.4-3.9 0-2.2-1-3.8-3.4-3.8h-2.7v7.7h2.7zm-6.1-10.7h6.4c4.5 0 6.7 2.4 6.7 6.6 0 3.1-1.5 5.6-3.7 6.3v.2c1 1.1 4 7.5 4.8 7.9v.5h-3.8c-1-.6-3.6-7.2-4.4-7.8h-2.5v7.8h-3.5v-21.5zM52.9 132.5c0 5.3 1.9 8 4.8 8s4-2 4-5.2l3.5.1c0 .2.1.4.1.6 0 4.4-2.1 7.5-7.5 7.5-5.2 0-8.5-3.9-8.5-11.1 0-7.1 3.3-11 8.5-11 6.4 0 7.5 4.6 7.5 7.2 0 .3 0 .7-.1.9l-3.5.1c0-3.3-1.2-5.2-4-5.2-2.9.2-4.8 2.9-4.8 8.1M68 121.8h3.5v9.1h8.3v-9.1h3.5v21.5h-3.5v-9.4h-8.3v9.4H68zM87.9 121.8h3.5v21.4h-3.5zM94.2 121.8h3.6l3.2 12.3c.5 1.9.8 3.6 1.1 5.6h.2c.3-2 .6-3.7 1.1-5.6l3.2-12.3h3.6l-6.1 21.4H100l-5.8-21.4zM112.7 121.8H125v3.1h-8.8v6h7.4v3h-7.4v6.3h8.8v3.1h-12.3zM130.4 136c0 .2-.1.5-.1.8 0 1.9.8 3.7 3.4 3.7 2.1 0 3.3-1.2 3.3-2.9 0-1.6-.7-2.4-2.2-3l-3.4-1.3c-2.4-.9-4.2-2.4-4.2-5.7 0-3.5 2.3-6.1 6.6-6.1 5.5 0 6.4 3.6 6.4 5.9 0 .3 0 .7-.1 1.1l-3.4.1c0-.2.1-.5.1-.7 0-1.7-.6-3.2-3-3.2-2.1 0-3 1.2-3 2.8 0 1.7.9 2.5 2.2 2.9l3.5 1.3c2.6 1 4.3 2.6 4.3 5.8 0 3.6-2.4 6.1-7 6.1-5.9 0-6.8-3.9-6.8-6.5 0-.3 0-.6.1-1l3.3-.1z\" /></g></svg><h2 class=\"tna-heading-m tna-footer__title\">The National Archives</h2><address class=\"tna-footer__address\">Kew, Richmond<br>TW9 4DU</address></div></div><div class=\"tna-container\"><div class=\"tna-column--full\"><hr></div></div><div class=\"tna-container tna-footer__licence\"><div class=\"tna-column tna-column--full-tiny\"><svg class=\"tna-footer__licence-logo\" xmlns=\"http://www.w3.org/2000/svg\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 483.2 195.7\" width=\"60\" height=\"24\"><title>Open Government Licence</title><path fill=\"currentColor\" d=\"M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145\" /></svg></div><div class=\"tna-column tna-column--flex-1\"><p>All content is available under the <a href=\"https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/\" class=\"tna-footer__link\">Open Government Licence v3.0</a>, except where otherwise stated</p></div><div class=\"tna-column tna-column--full-small tna-column--full-tiny tna-footer__govuk\"><a href=\"https://www.gov.uk/\" class=\"tna-footer__govuk-link\"><svg aria-hidden=\"true\" class=\"tna-footer__govuk-logotype-crown\" width=\"32\" height=\"30\" focusable=\"false\" viewBox=\"0 0 32 30\" xmlns=\"http://www.w3.org/2000/svg\"><title>GOV.UK</title><path d=\"M22.6 10.4c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m-5.9 6.7c-.9.4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m10.8-3.7c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s0 2-1 2.4m3.3 4.8c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4M17 4.7l2.3 1.2V2.5l-2.3.7-.2-.2.9-3h-3.4l.9 3-.2.2c-.1.1-2.3-.7-2.3-.7v3.4L15 4.7c.1.1.1.2.2.2l-1.3 4c-.1.2-.1.4-.1.6 0 1.1.8 2 1.9 2.2h.7c1-.2 1.9-1.1 1.9-2.1 0-.2 0-.4-.1-.6l-1.3-4c-.1-.2 0-.2.1-.3m-7.6 5.7c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m-5 3c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s.1 2 1 2.4m-3.2 4.8c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m14.8 11c4.4 0 8.6.3 12.3.8 1.1-4.5 2.4-7 3.7-8.8l-2.5-.9c.2 1.3.3 1.9 0 2.7-.4-.4-.8-1.1-1.1-2.3l-1.2 4c.7-.5 1.3-.8 2-.9-1.1 2.5-2.6 3.1-3.5 3-1.1-.2-1.7-1.2-1.5-2.1.3-1.2 1.5-1.5 2.1-.1 1.1-2.3-.8-3-2-2.3 1.9-1.9 2.1-3.5.6-5.6-2.1 1.6-2.1 3.2-1.2 5.5-1.2-1.4-3.2-.6-2.5 1.6.9-1.4 2.1-.5 1.9.8-.2 1.1-1.7 2.1-3.5 1.9-2.7-.2-2.9-2.1-2.9-3.6.7-.1 1.9.5 2.9 1.9l.4-4.3c-1.1 1.1-2.1 1.4-3.2 1.4.4-1.2 2.1-3 2.1-3h-5.4s1.7 1.9 2.1 3c-1.1 0-2.1-.2-3.2-1.4l.4 4.3c1-1.4 2.2-2 2.9-1.9-.1 1.5-.2 3.4-2.9 3.6-1.9.2-3.4-.8-3.5-1.9-.2-1.3 1-2.2 1.9-.8.7-2.3-1.2-3-2.5-1.6.9-2.2.9-3.9-1.2-5.5-1.5 2-1.3 3.7.6 5.6-1.2-.7-3.1 0-2 2.3.6-1.4 1.8-1.1 2.1.1.2.9-.3 1.9-1.5 2.1-.9.2-2.4-.5-3.5-3 .6 0 1.2.3 2 .9l-1.2-4c-.3 1.1-.7 1.9-1.1 2.3-.3-.8-.2-1.4 0-2.7l-2.9.9C1.3 23 2.6 25.5 3.7 30c3.7-.5 7.9-.8 12.3-.8\" fill=\"currentColor\" fill-rule=\"evenodd\" /></svg>GOV.UK</a></div></div></div></footer><script>if (window.TNAFrontend && window.TNAFrontend.initAll) {\n document.addEventListener(\"DOMContentLoaded\", function() {\n window.TNAFrontend.initAll();\n var cookies = new TNAFrontend.Cookies()\n var theme = cookies.get(\"theme\") || \"light\"\n var $tnaTemplate = document.querySelector(\".tna-template\");\n if (theme === \"light\") {\n $tnaTemplate.classList.remove(\n \"tna-template--system-theme\",\n \"tna-template--dark-theme\",\n );\n } else if (theme === \"dark\") {\n $tnaTemplate.classList.remove(\"tna-template--system-theme\");\n $tnaTemplate.classList.add(`tna-template--dark-theme`);\n } else if (theme === \"system\") {\n $tnaTemplate.classList.remove(\"tna-template--dark-theme\");\n $tnaTemplate.classList.add(`tna-template--system-theme`);\n }\n });\n }</script></body></html>"
49
49
  }
50
50
  ]
51
51
  }
@@ -1,12 +1,16 @@
1
1
  @use "../variables/a11y";
2
2
  @use "colour";
3
3
 
4
- @mixin focus-outline {
4
+ @mixin focus-outline-without-offset {
5
5
  @include colour.colour-outline(
6
6
  "focus-outline",
7
7
  a11y.$focus-outline-width,
8
8
  solid
9
9
  );
10
+ }
11
+
12
+ @mixin focus-outline {
13
+ @include focus-outline-without-offset;
10
14
  outline-offset: a11y.$focus-outline-offset;
11
15
  }
12
16
 
@@ -14,6 +18,8 @@
14
18
  outline-offset: 0;
15
19
  }
16
20
 
17
- @mixin no-active-outline {
18
- outline-offset: a11y.$focus-outline-offset;
21
+ @mixin no-focus-outline-on-click {
22
+ .tna-template--clicked &:focus {
23
+ outline: none;
24
+ }
19
25
  }
@@ -2,6 +2,7 @@
2
2
  @use "sass:map";
3
3
  @use "../variables/borders";
4
4
  @use "../variables/colour";
5
+ @use "../variables/features";
5
6
  @use "../tools/media";
6
7
 
7
8
  @function brand-colour($colour, $opacity: 1) {
@@ -170,12 +171,23 @@
170
171
  }
171
172
  }
172
173
 
174
+ @mixin thick-keyline-transparent($direction: "") {
175
+ @if $direction != "" {
176
+ border-#{$direction}: borders.$thick-border-width transparent solid;
177
+ } @else {
178
+ border: borders.$thick-border-width transparent solid;
179
+ }
180
+ }
181
+
173
182
  // Use light theme colours (except for "form-error-border")
174
183
  %always-light {
175
- @include colour-css-vars("form-error-border");
184
+ @include colour-css-vars("form-error-border", "focus-outline");
176
185
 
177
186
  @media (prefers-contrast: more) {
178
- @include colour-css-vars-high-contrast("form-error-border");
187
+ @include colour-css-vars-high-contrast(
188
+ "form-error-border",
189
+ "focus-outline"
190
+ );
179
191
  }
180
192
  }
181
193
 
@@ -242,7 +254,7 @@
242
254
 
243
255
  @include colour-background("background");
244
256
 
245
- @include colour-font("font-base");
257
+ // @include colour-font("font-base");
246
258
  }
247
259
 
248
260
  @mixin tint {
@@ -296,22 +308,54 @@
296
308
  colour.$colour-palette-default,
297
309
  "button-hover-background"
298
310
  )};
299
- --accent-border: var(--font-base);
300
311
  --accent-list-marker: var(--font-base);
312
+ --accent-border: var(--accent-background);
301
313
 
302
314
  @include colour-background("background");
303
315
  @include colour-font("font-base");
304
316
 
305
317
  .tna-template--system-theme & {
306
318
  @media (prefers-color-scheme: dark) {
307
- --link: #{map.get(colour.$colour-palette-default, "link")};
308
- --link-visited: #{map.get(colour.$colour-palette-default, "link-visited")};
319
+ // --link: #{map.get(colour.$colour-palette-default, "link")};
320
+ // --link-visited: #{map.get(colour.$colour-palette-default, "link-visited")};
321
+
322
+ --background: var(--accent-background);
323
+ --font-base: var(--accent-font-base);
324
+ --font-dark: var(--accent-font-dark);
325
+ --font-light: var(--accent-font-light);
326
+ --icon-light: var(--accent-icon-light);
327
+ --link: var(--accent-link);
328
+ --link-visited: var(--accent-link);
329
+ --keyline: var(--accent-keyline);
330
+ --keyline-dark: var(--accent-keyline-dark);
331
+ --accent-list-marker: var(--accent-font-base);
332
+ --accent-border: var(--accent-font-dark);
333
+ --button-text: var(--accent-button-text);
334
+ --button-background: var(--accent-button-background);
335
+ --button-hover-text: var(--accent-button-hover-text);
336
+ --button-hover-background: var(--accent-button-hover-background);
309
337
  }
310
338
  }
311
339
 
312
340
  .tna-template--dark-theme & {
313
- --link: #{map.get(colour.$colour-palette-default, "link")};
314
- --link-visited: #{map.get(colour.$colour-palette-default, "link-visited")};
341
+ // --link: #{map.get(colour.$colour-palette-default, "link")};
342
+ // --link-visited: #{map.get(colour.$colour-palette-default, "link-visited")};
343
+
344
+ --background: var(--accent-background);
345
+ --font-base: var(--accent-font-base);
346
+ --font-dark: var(--accent-font-dark);
347
+ --font-light: var(--accent-font-light);
348
+ --icon-light: var(--accent-icon-light);
349
+ --link: var(--accent-link);
350
+ --link-visited: var(--accent-link);
351
+ --keyline: var(--accent-keyline);
352
+ --keyline-dark: var(--accent-keyline-dark);
353
+ --accent-list-marker: var(--accent-font-base);
354
+ --accent-border: var(--accent-font-dark);
355
+ --button-text: var(--accent-button-text);
356
+ --button-background: var(--accent-button-background);
357
+ --button-hover-text: var(--accent-button-hover-text);
358
+ --button-hover-background: var(--accent-button-hover-background);
315
359
  }
316
360
  }
317
361
 
@@ -439,3 +483,18 @@
439
483
  @content;
440
484
  }
441
485
  }
486
+
487
+ @mixin image-loader-background {
488
+ @if not features.$disable-image-loader-animations {
489
+ background: linear-gradient(
490
+ -45deg,
491
+ rgba(0 0 0 / 25%),
492
+ rgba(255 255 255 / 25%),
493
+ rgba(0 0 0 / 25%)
494
+ );
495
+ background-size: 500% 500%;
496
+ background-position: 0 50%;
497
+
498
+ animation: image-loader-background ease-in-out 1.2s infinite;
499
+ }
500
+ }
@@ -26,25 +26,30 @@
26
26
  // }
27
27
  }
28
28
 
29
- *:focus {
29
+ *:focus-visible {
30
30
  z-index: 9;
31
31
 
32
32
  @include a11y.focus-outline;
33
33
  }
34
34
 
35
- // *:focus-visible {
36
- // z-index: 9;
35
+ @supports not selector(:focus-visible) {
36
+ *:focus {
37
+ z-index: 9;
37
38
 
38
- // @include a11y.focus-outline;
39
- // }
40
-
41
- // @supports not selector(:focus-visible) {
42
- // *:focus {
43
- // z-index: 9;
39
+ @include a11y.focus-outline;
40
+ }
41
+ }
44
42
 
45
- // @include a11y.focus-outline;
46
- // }
47
- // }
43
+ a,
44
+ button,
45
+ input,
46
+ textarea,
47
+ select,
48
+ summary {
49
+ &:active {
50
+ @include a11y.focus-outline-without-offset;
51
+ }
52
+ }
48
53
 
49
54
  *:active {
50
55
  @include a11y.active-outline;
@@ -0,0 +1,10 @@
1
+ @keyframes image-loader-background {
2
+ 0%,
3
+ 100% {
4
+ background-position: 0 50%;
5
+ }
6
+
7
+ 50% {
8
+ background-position: 100% 50%;
9
+ }
10
+ }
@@ -1,4 +1,5 @@
1
1
  @use "a11y";
2
+ @use "animations";
2
3
  @use "areas";
3
4
  @use "colour";
4
5
  @use "columns";
@@ -19,19 +19,31 @@
19
19
 
20
20
  box-sizing: border-box;
21
21
 
22
- &--no-padding,
23
- &--no-padding-all {
22
+ & &--no-padding {
24
23
  max-width: gridVars.$largest-container-width - grid.gutter-width-double();
24
+ padding-right: 0;
25
+ padding-left: 0;
25
26
  }
26
27
 
27
28
  &--max {
28
29
  max-width: none;
29
30
  }
30
31
 
31
- &--centred {
32
+ &--centred,
33
+ &--align-centre {
32
34
  justify-content: center;
33
35
  }
34
36
 
37
+ &--align-right {
38
+ justify-content: flex-end;
39
+ }
40
+
41
+ & &--nested {
42
+ width: auto;
43
+ margin-right: -#{grid.gutter-width()};
44
+ margin-left: -#{grid.gutter-width()};
45
+ }
46
+
35
47
  @at-root #{selector.unify("ul", &)} {
36
48
  list-style: none;
37
49
  }
@@ -43,11 +55,9 @@
43
55
 
44
56
  box-sizing: border-box;
45
57
 
46
- &--container {
47
- display: flex;
48
- flex-wrap: wrap;
49
- align-items: stretch;
50
- justify-content: stretch;
58
+ & &--no-padding {
59
+ padding-right: 0;
60
+ padding-left: 0;
51
61
  }
52
62
 
53
63
  &--align-top {
@@ -69,32 +79,26 @@
69
79
  @include grid.columns-generator(gridVars.$column-count-medium, "medium");
70
80
  }
71
81
 
82
+ @include media.on-small {
83
+ @include grid.columns-generator(gridVars.$column-count-small, "small");
84
+ }
85
+
72
86
  @include media.on-tiny {
73
87
  .tna-container {
74
88
  padding-right: grid.gutter-width-tiny-half();
75
89
  padding-left: grid.gutter-width-tiny-half();
90
+
91
+ & &--nested {
92
+ width: auto;
93
+ margin-right: -#{grid.gutter-width-tiny()};
94
+ margin-left: -#{grid.gutter-width-tiny()};
95
+ }
76
96
  }
77
97
 
78
98
  .tna-column {
79
99
  padding-right: grid.gutter-width-tiny-half();
80
100
  padding-left: grid.gutter-width-tiny-half();
81
101
  }
82
- }
83
102
 
84
- @include media.on-small {
85
- @include grid.columns-generator(gridVars.$column-count-small, "small");
86
- }
87
-
88
- @include media.on-tiny {
89
103
  @include grid.columns-generator(gridVars.$column-count-tiny, "tiny");
90
104
  }
91
-
92
- .tna-container--no-padding,
93
- .tna-container--no-padding-all,
94
- .tna-container--no-padding-all > .tna-column,
95
- .tna-column--no-padding,
96
- .tna-column--container--no-padding-all,
97
- .tna-column--container--no-padding-all > .tna-column {
98
- padding-right: 0;
99
- padding-left: 0;
100
- }
@@ -164,7 +164,7 @@
164
164
  "description": ""
165
165
  },
166
166
  {
167
- "name": "noPaddingAll",
167
+ "name": "nested",
168
168
  "type": "boolean",
169
169
  "required": false,
170
170
  "description": ""
@@ -6,8 +6,8 @@
6
6
  {%- if params.noPadding -%}
7
7
  {%- set containerClasses = containerClasses.concat('tna-container--no-padding') -%}
8
8
  {%- endif -%}
9
- {%- if params.noPaddingAll -%}
10
- {%- set containerClasses = containerClasses.concat('tna-container--no-padding-all') -%}
9
+ {%- if params.nested -%}
10
+ {%- set containerClasses = containerClasses.concat('tna-container--nested') -%}
11
11
  {%- endif -%}
12
12
  {%- set classes = containerClasses | join(' ') -%}
13
13
  <{{ htmlElement }} class="tna-container{% if classes %} {{ classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
@@ -85,7 +85,7 @@ ol {
85
85
  cursor: pointer;
86
86
  }
87
87
 
88
- &:not(#{&}--plain) {
88
+ &:not(&--plain) {
89
89
  gap: spacing.space(0.5) spacing.space(1);
90
90
  }
91
91
 
@@ -93,7 +93,7 @@ ol {
93
93
  @extend %chip-plain;
94
94
  }
95
95
 
96
- &:not(#{&}--plain) &__item {
96
+ &:not(&--plain) &__item {
97
97
  @extend %chip-accent;
98
98
  }
99
99
 
@@ -276,3 +276,14 @@ ol {
276
276
  }
277
277
  }
278
278
  }
279
+
280
+ li,
281
+ dd {
282
+ p {
283
+ margin-top: spacing.space(0.25);
284
+
285
+ &:first-child {
286
+ margin-top: 0;
287
+ }
288
+ }
289
+ }
@@ -125,10 +125,31 @@ small {
125
125
  -webkit-print-color-adjust: exact;
126
126
  print-color-adjust: exact;
127
127
 
128
- .tna-background-accent & {
129
- @include colour.contrast;
128
+ .tna-background-accent &,
129
+ .tna-template--dark-theme .tna-background-accent-light & {
130
+ @include colour.colour-font("contrast-font-base");
131
+
132
+ @include colour.colour-background("contrast-background");
130
133
 
131
134
  @include colour.colour-border("contrast-background");
135
+
136
+ .fa-solid {
137
+ @include colour.colour-font("contrast-icon-light");
138
+ }
139
+ }
140
+
141
+ .tna-template--system-theme .tna-background-accent-light & {
142
+ @media (prefers-color-scheme: dark) {
143
+ @include colour.colour-font("contrast-font-base");
144
+
145
+ @include colour.colour-background("contrast-background");
146
+
147
+ @include colour.colour-border("contrast-background");
148
+
149
+ .fa-solid {
150
+ @include colour.colour-font("contrast-icon-light");
151
+ }
152
+ }
132
153
  }
133
154
  }
134
155
 
@@ -163,7 +184,7 @@ small {
163
184
  @include colour.blue-accent;
164
185
  }
165
186
 
166
- &:not(#{&}--plain) {
187
+ &:not(&--plain) {
167
188
  @extend %chip-accent;
168
189
  }
169
190
  }
@@ -348,7 +369,7 @@ small {
348
369
  @extend %chip-plain;
349
370
  }
350
371
 
351
- &:not(#{&}--plain) {
372
+ &:not(&--plain) {
352
373
  @extend %chip-accent;
353
374
  }
354
375
  }
@@ -448,3 +469,8 @@ small {
448
469
  }
449
470
  }
450
471
  }
472
+
473
+ address {
474
+ line-height: 1.375;
475
+ font-style: inherit;
476
+ }
@@ -1 +1,2 @@
1
1
  $debug-interactable-areas: false !default;
2
+ $disable-image-loader-animations: false !default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nationalarchives/frontend",
3
- "version": "0.2.7",
3
+ "version": "0.2.9",
4
4
  "description": "The National Archives frontend styles",
5
5
  "scripts": {
6
6
  "start": "storybook dev -p 6006",