@ons/design-system 70.0.7 → 70.0.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 (454) hide show
  1. package/README.md +11 -17
  2. package/components/access-code/_macro.njk +31 -25
  3. package/components/access-code/_macro.spec.js +145 -145
  4. package/components/access-code/access-code.dom.js +5 -5
  5. package/components/access-code/access-code.js +16 -16
  6. package/components/access-code/access-code.scss +22 -22
  7. package/components/access-code/access-code.spec.js +17 -17
  8. package/components/access-code/example-access-code-error.njk +49 -37
  9. package/components/access-code/example-access-code.njk +40 -30
  10. package/components/accordion/_macro.njk +7 -6
  11. package/components/accordion/_macro.spec.js +154 -154
  12. package/components/accordion/accordion.dom.js +10 -10
  13. package/components/accordion/accordion.js +50 -50
  14. package/components/accordion/accordion.spec.js +104 -104
  15. package/components/accordion/example-accordion-open.njk +0 -1
  16. package/components/address-input/_macro.njk +23 -11
  17. package/components/address-input/_macro.spec.js +420 -420
  18. package/components/address-input/autosuggest.address.dom.js +5 -5
  19. package/components/address-input/autosuggest.address.error.js +77 -77
  20. package/components/address-input/autosuggest.address.js +354 -359
  21. package/components/address-input/autosuggest.address.setter.js +95 -95
  22. package/components/address-input/autosuggest.address.spec.js +668 -651
  23. package/components/address-input/example-address-input-editable.njk +52 -50
  24. package/components/address-input/example-address-input-manual.njk +23 -21
  25. package/components/address-input/example-address-input.njk +40 -38
  26. package/components/address-output/_address-output.scss +3 -3
  27. package/components/address-output/_macro.njk +6 -6
  28. package/components/address-output/_macro.spec.js +84 -84
  29. package/components/autosuggest/_autosuggest.scss +114 -114
  30. package/components/autosuggest/_macro.njk +57 -37
  31. package/components/autosuggest/_macro.spec.js +255 -255
  32. package/components/autosuggest/autosuggest.dom.js +5 -5
  33. package/components/autosuggest/autosuggest.helpers.js +11 -11
  34. package/components/autosuggest/autosuggest.helpers.spec.js +73 -73
  35. package/components/autosuggest/autosuggest.js +20 -20
  36. package/components/autosuggest/autosuggest.spec.js +542 -536
  37. package/components/autosuggest/autosuggest.ui.js +478 -475
  38. package/components/autosuggest/example-autosuggest-country-multiple.njk +26 -26
  39. package/components/autosuggest/example-autosuggest-country.njk +24 -24
  40. package/components/autosuggest/fuse-config.js +17 -17
  41. package/components/back-to-top/_back-to-top.scss +27 -27
  42. package/components/back-to-top/_macro.spec.js +49 -49
  43. package/components/back-to-top/back-to-top.dom.js +5 -5
  44. package/components/back-to-top/back-to-top.js +52 -52
  45. package/components/back-to-top/back-to-top.spec.js +106 -106
  46. package/components/back-to-top/example-back-to-top.njk +183 -6
  47. package/components/back-to-top/example-full-page-back-to-top.njk +135 -123
  48. package/components/breadcrumbs/_breadcrumbs.scss +63 -65
  49. package/components/breadcrumbs/_macro.njk +12 -4
  50. package/components/breadcrumbs/_macro.spec.js +91 -91
  51. package/components/browser-banner/_browser-banner.scss +23 -23
  52. package/components/browser-banner/_macro.njk +6 -3
  53. package/components/browser-banner/_macro.spec.js +92 -92
  54. package/components/button/_button.scss +525 -491
  55. package/components/button/_macro.njk +63 -62
  56. package/components/button/_macro.spec.js +363 -363
  57. package/components/button/button.dom.js +15 -15
  58. package/components/button/button.js +53 -53
  59. package/components/button/button.spec.js +248 -240
  60. package/components/button/example-button-ghost.njk +1 -0
  61. package/components/call-to-action/_call-to-action.scss +5 -5
  62. package/components/call-to-action/_macro.njk +7 -5
  63. package/components/call-to-action/_macro.spec.js +28 -28
  64. package/components/call-to-action/example-call-to-action-default.njk +3 -2
  65. package/components/card/_card.scss +23 -23
  66. package/components/card/_macro.njk +26 -10
  67. package/components/card/_macro.spec.js +180 -180
  68. package/components/card/example-card-set-with-images.njk +31 -29
  69. package/components/card/example-card-set-with-lists.njk +58 -56
  70. package/components/card/example-card-set.njk +28 -26
  71. package/components/card/example-card.njk +9 -7
  72. package/components/char-check-limit/_macro.njk +1 -3
  73. package/components/char-check-limit/_macro.spec.js +48 -48
  74. package/components/char-check-limit/character-check.js +58 -58
  75. package/components/char-check-limit/character-check.spec.js +173 -173
  76. package/components/char-check-limit/character-limit.js +40 -40
  77. package/components/checkboxes/_checkbox-macro.njk +19 -15
  78. package/components/checkboxes/_checkbox-macro.spec.js +355 -355
  79. package/components/checkboxes/_checkbox.scss +180 -180
  80. package/components/checkboxes/_checkboxes.scss +37 -27
  81. package/components/checkboxes/_macro.njk +81 -72
  82. package/components/checkboxes/_macro.spec.js +261 -261
  83. package/components/checkboxes/checkbox-with-autoselect.js +32 -32
  84. package/components/checkboxes/checkbox-with-fieldset.js +21 -21
  85. package/components/checkboxes/checkboxes-with-reveal.js +10 -10
  86. package/components/checkboxes/checkboxes.dom.js +27 -27
  87. package/components/checkboxes/checkboxes.spec.js +183 -183
  88. package/components/checkboxes/example-checkboxes-disabled.njk +30 -30
  89. package/components/checkboxes/example-checkboxes-error.njk +0 -1
  90. package/components/checkboxes/example-checkboxes-with-descriptions.njk +7 -5
  91. package/components/checkboxes/example-checkboxes-with-hidden-label.njk +162 -170
  92. package/components/checkboxes/example-checkboxes-with-revealed-checkboxes-expanded.njk +81 -81
  93. package/components/checkboxes/example-checkboxes-with-revealed-checkboxes.njk +79 -79
  94. package/components/checkboxes/example-checkboxes-with-revealed-select-expanded.njk +7 -5
  95. package/components/checkboxes/example-checkboxes-with-revealed-select.njk +7 -5
  96. package/components/checkboxes/example-checkboxes-with-revealed-text-input-expanded.njk +7 -5
  97. package/components/checkboxes/example-checkboxes-with-revealed-text-input.njk +7 -5
  98. package/components/checkboxes/example-checkboxes-with-select-all-button.njk +7 -5
  99. package/components/checkboxes/example-checkboxes-with-visible-text-input.njk +7 -5
  100. package/components/checkboxes/example-checkboxes.njk +7 -5
  101. package/components/content-pagination/_content-pagination.scss +41 -41
  102. package/components/content-pagination/_macro.njk +34 -32
  103. package/components/content-pagination/_macro.spec.js +159 -159
  104. package/components/content-pagination/example-content-pagination.njk +17 -17
  105. package/components/cookies-banner/_cookies-banner.scss +22 -22
  106. package/components/cookies-banner/_macro.njk +19 -6
  107. package/components/cookies-banner/_macro.spec.js +177 -177
  108. package/components/cookies-banner/cookies-banner.dom.js +7 -7
  109. package/components/cookies-banner/cookies-banner.js +76 -76
  110. package/components/cookies-banner/cookies-banner.spec.js +72 -68
  111. package/components/cookies-banner/example-cookies-banner-cymraeg.njk +2 -1
  112. package/components/cookies-banner/example-cookies-banner.njk +3 -4
  113. package/components/date-input/_macro.njk +71 -63
  114. package/components/date-input/_macro.spec.js +338 -338
  115. package/components/date-input/example-date-input-error-for-single-field.njk +0 -1
  116. package/components/date-input/example-date-input-error.njk +0 -1
  117. package/components/description-list/_description-list.scss +23 -23
  118. package/components/description-list/_macro.njk +20 -11
  119. package/components/description-list/_macro.spec.js +144 -144
  120. package/components/details/_details.scss +109 -109
  121. package/components/details/_macro.njk +18 -11
  122. package/components/details/_macro.spec.js +132 -132
  123. package/components/details/details.dom.js +6 -6
  124. package/components/details/details.js +60 -60
  125. package/components/details/details.spec.js +106 -106
  126. package/components/details/example-details-with-warning.njk +15 -10
  127. package/components/document-list/_macro.njk +102 -93
  128. package/components/document-list/_macro.spec.js +444 -444
  129. package/components/document-list/document-list.scss +145 -149
  130. package/components/document-list/example-document-list-article-featured.njk +27 -25
  131. package/components/document-list/example-document-list-articles.njk +55 -53
  132. package/components/document-list/example-document-list-downloads.njk +49 -47
  133. package/components/document-list/example-document-list-search-result-featured.njk +19 -17
  134. package/components/document-list/example-document-list-search-results.njk +60 -58
  135. package/components/download-resources/_download-resources.scss +109 -108
  136. package/components/download-resources/download-resources.js +907 -900
  137. package/components/download-resources/download-resources.spec.js +461 -461
  138. package/components/duration/_macro.njk +61 -55
  139. package/components/duration/_macro.spec.js +291 -291
  140. package/components/duration/example-duration-error-for-single-field.njk +28 -26
  141. package/components/duration/example-duration-single-field.njk +23 -19
  142. package/components/duration/example-duration.njk +33 -29
  143. package/components/error/_macro.njk +8 -6
  144. package/components/error/_macro.spec.js +72 -72
  145. package/components/external-link/_external-link.scss +19 -19
  146. package/components/external-link/_macro.njk +7 -5
  147. package/components/external-link/_macro.spec.js +68 -68
  148. package/components/external-link/example-external-link.njk +9 -6
  149. package/components/feedback/_feedback.scss +31 -31
  150. package/components/feedback/_macro.njk +7 -5
  151. package/components/feedback/_macro.spec.js +72 -72
  152. package/components/field/_field-group.scss +10 -10
  153. package/components/field/_field.scss +16 -16
  154. package/components/field/_macro.njk +2 -2
  155. package/components/field/_macro.spec.js +80 -80
  156. package/components/fieldset/_fieldset.scss +27 -27
  157. package/components/fieldset/_macro.njk +23 -16
  158. package/components/fieldset/_macro.spec.js +161 -161
  159. package/components/footer/_footer.scss +45 -45
  160. package/components/footer/_macro.njk +28 -21
  161. package/components/footer/_macro.spec.js +452 -452
  162. package/components/footer/example-footer-cymraeg.njk +2 -1
  163. package/components/footer/example-footer-default.njk +3 -4
  164. package/components/footer/example-footer-transactional.njk +2 -1
  165. package/components/footer/example-footer-warning.njk +2 -1
  166. package/components/footer/example-footer-with-alternative-organisation.njk +2 -1
  167. package/components/footer/example-footer-with-coat-of-arms.njk +2 -1
  168. package/components/footer/example-footer-with-copyright.njk +2 -1
  169. package/components/footer/example-footer.njk +2 -1
  170. package/components/header/_header.scss +207 -202
  171. package/components/header/_macro.njk +183 -141
  172. package/components/header/_macro.spec.js +833 -829
  173. package/components/header/example-header-default.njk +2 -1
  174. package/components/header/example-header-external-for-survey-with-description.njk +2 -1
  175. package/components/header/example-header-external-for-surveys.njk +2 -1
  176. package/components/header/example-header-external-welsh.njk +7 -7
  177. package/components/header/example-header-external-with-navigation-and-search.njk +3 -2
  178. package/components/header/example-header-external-with-navigation.njk +2 -1
  179. package/components/header/example-header-external-with-service-links.njk +2 -1
  180. package/components/header/example-header-external-with-sub-navigation-removed.njk +2 -1
  181. package/components/header/example-header-external-with-sub-navigation.njk +3 -2
  182. package/components/header/example-header-internal.njk +2 -1
  183. package/components/header/example-header-multiple-logos.njk +2 -1
  184. package/components/header/{example-header-neutral-for-multicoloured-logo.njk → example-header-neutral.njk} +2 -1
  185. package/components/helpers/_grid.scss +4 -4
  186. package/components/helpers/grid.njk +17 -16
  187. package/components/hero/_hero.scss +48 -48
  188. package/components/hero/_macro.njk +6 -11
  189. package/components/hero/_macro.spec.js +59 -59
  190. package/components/hero/example-hero-dark.njk +2 -1
  191. package/components/hero/example-hero-default.njk +2 -1
  192. package/components/icon/_icon.scss +44 -44
  193. package/components/icon/_macro.njk +601 -168
  194. package/components/icon/_macro.spec.js +110 -110
  195. package/components/image/_image.scss +11 -11
  196. package/components/image/_macro.njk +7 -5
  197. package/components/image/_macro.spec.js +81 -81
  198. package/components/input/_input-type.scss +86 -89
  199. package/components/input/_input.scss +123 -124
  200. package/components/input/_macro.njk +114 -95
  201. package/components/input/_macro.spec.js +604 -604
  202. package/components/input/character-check.dom.js +5 -5
  203. package/components/input/example-input-search-with-character-check.njk +1 -1
  204. package/components/input/example-input-search-with-placeholder.njk +1 -1
  205. package/components/input/example-input-search.njk +1 -1
  206. package/components/input/input.dom.js +5 -5
  207. package/components/input/input.js +10 -10
  208. package/components/input/input.spec.js +18 -18
  209. package/components/label/_label.scss +24 -24
  210. package/components/label/_macro.njk +32 -26
  211. package/components/label/_macro.spec.js +173 -170
  212. package/components/language-selector/_macro.njk +11 -2
  213. package/components/language-selector/_macro.spec.js +97 -97
  214. package/components/language-selector/language.scss +7 -7
  215. package/components/list/_list.scss +110 -97
  216. package/components/list/_macro.njk +93 -73
  217. package/components/list/_macro.spec.js +583 -583
  218. package/components/message/_macro.njk +20 -7
  219. package/components/message/_macro.spec.js +74 -74
  220. package/components/message/_message.scss +39 -39
  221. package/components/message-list/_macro.njk +26 -20
  222. package/components/message-list/_macro.spec.js +86 -86
  223. package/components/message-list/_message-list.scss +16 -16
  224. package/components/modal/_macro.njk +11 -12
  225. package/components/modal/_macro.spec.js +69 -69
  226. package/components/modal/_modal.scss +36 -36
  227. package/components/modal/modal.dom.js +6 -6
  228. package/components/modal/modal.js +89 -89
  229. package/components/modal/modal.spec.js +50 -50
  230. package/components/multiple-input-fields/_macro.njk +30 -28
  231. package/components/mutually-exclusive/_macro.njk +20 -13
  232. package/components/mutually-exclusive/_macro.spec.js +140 -140
  233. package/components/mutually-exclusive/example-mutually-exclusive-checkboxes.njk +6 -4
  234. package/components/mutually-exclusive/example-mutually-exclusive-date.njk +7 -5
  235. package/components/mutually-exclusive/example-mutually-exclusive-duration.njk +44 -40
  236. package/components/mutually-exclusive/example-mutually-exclusive-email.njk +7 -5
  237. package/components/mutually-exclusive/example-mutually-exclusive-multiple-options.njk +6 -4
  238. package/components/mutually-exclusive/example-mutually-exclusive-number.njk +6 -4
  239. package/components/mutually-exclusive/example-mutually-exclusive-textarea.njk +6 -4
  240. package/components/mutually-exclusive/mutually-exclusive.checkboxes.spec.js +188 -188
  241. package/components/mutually-exclusive/mutually-exclusive.date.spec.js +211 -211
  242. package/components/mutually-exclusive/mutually-exclusive.dom.js +5 -5
  243. package/components/mutually-exclusive/mutually-exclusive.duration.spec.js +210 -210
  244. package/components/mutually-exclusive/mutually-exclusive.email.spec.js +90 -90
  245. package/components/mutually-exclusive/mutually-exclusive.js +137 -137
  246. package/components/mutually-exclusive/mutually-exclusive.multiple-options.checkboxes.spec.js +197 -197
  247. package/components/mutually-exclusive/mutually-exclusive.number.spec.js +96 -96
  248. package/components/mutually-exclusive/mutually-exclusive.textarea.spec.js +102 -102
  249. package/components/navigation/_macro.njk +133 -67
  250. package/components/navigation/_macro.spec.js +360 -354
  251. package/components/navigation/_navigation.scss +112 -122
  252. package/components/navigation/navigation.dom.js +35 -35
  253. package/components/navigation/navigation.js +49 -49
  254. package/components/navigation/navigation.spec.js +249 -249
  255. package/components/pagination/_macro.njk +42 -20
  256. package/components/pagination/_macro.spec.js +342 -335
  257. package/components/pagination/_pagination.scss +58 -58
  258. package/components/panel/_macro.njk +27 -16
  259. package/components/panel/_macro.spec.js +372 -372
  260. package/components/panel/_panel.scss +200 -199
  261. package/components/panel/example-panel-bare.njk +6 -4
  262. package/components/panel/example-panel-with-announcement.njk +7 -4
  263. package/components/panel/example-panel-with-error-summary.njk +6 -4
  264. package/components/panel/example-panel-with-warning.njk +5 -3
  265. package/components/password/_macro.njk +7 -5
  266. package/components/password/_macro.spec.js +95 -95
  267. package/components/password/password.dom.js +5 -5
  268. package/components/password/password.js +10 -10
  269. package/components/password/password.spec.js +26 -26
  270. package/components/phase-banner/_macro.njk +3 -3
  271. package/components/phase-banner/_macro.spec.js +86 -86
  272. package/components/phase-banner/_phase-banner.scss +16 -16
  273. package/components/phase-banner/example-phase-banner-alpha.njk +2 -1
  274. package/components/phase-banner/example-phase-banner-beta.njk +4 -3
  275. package/components/question/_macro.njk +62 -47
  276. package/components/question/_macro.spec.js +235 -235
  277. package/components/question/_question.scss +24 -24
  278. package/components/question/example-question-ccs.njk +40 -35
  279. package/components/question/example-question-fieldset.njk +84 -80
  280. package/components/question/example-question-interviewer-note.njk +27 -24
  281. package/components/question/example-question-no-fieldset.njk +39 -33
  282. package/components/quote/_macro.njk +3 -1
  283. package/components/quote/_macro.spec.js +52 -52
  284. package/components/quote/_quote.scss +24 -24
  285. package/components/radios/_macro.njk +54 -36
  286. package/components/radios/_macro.spec.js +545 -524
  287. package/components/radios/_radio.scss +49 -48
  288. package/components/radios/_radios.scss +14 -20
  289. package/components/radios/check-radios.js +21 -21
  290. package/components/radios/clear-radios.js +45 -45
  291. package/components/radios/example-radios-with-clear-button-expanded.njk +6 -4
  292. package/components/radios/example-radios-with-clear-button.njk +6 -4
  293. package/components/radios/example-radios-with-descriptions.njk +7 -5
  294. package/components/radios/example-radios-with-revealed-select-expanded.njk +6 -4
  295. package/components/radios/example-radios-with-revealed-select.njk +6 -4
  296. package/components/radios/example-radios-with-revealed-text-area-expanded.njk +7 -5
  297. package/components/radios/example-radios-with-revealed-text-area.njk +7 -5
  298. package/components/radios/example-radios-with-revealed-text-input-expanded.njk +7 -5
  299. package/components/radios/example-radios-with-revealed-text-input.njk +7 -5
  300. package/components/radios/example-radios-with-separator.njk +6 -4
  301. package/components/radios/example-radios-with-visible-text-input.njk +7 -5
  302. package/components/radios/example-radios-without-border.njk +0 -1
  303. package/components/radios/example-radios.njk +7 -5
  304. package/components/radios/radio-with-fieldset.js +22 -22
  305. package/components/radios/radios.dom.js +32 -32
  306. package/components/radios/radios.spec.js +251 -251
  307. package/components/related-content/_macro.njk +10 -11
  308. package/components/related-content/_macro.spec.js +109 -109
  309. package/components/related-content/_related-content.scss +12 -12
  310. package/components/related-content/_section-macro.njk +7 -7
  311. package/components/related-content/_section-macro.spec.js +20 -20
  312. package/components/related-content/example-related-content-general.njk +5 -3
  313. package/components/related-content/example-related-content-multiple-rows-of-links.njk +51 -49
  314. package/components/related-content/example-related-content-social-media.njk +40 -38
  315. package/components/relationships/_macro.njk +10 -8
  316. package/components/relationships/_macro.spec.js +94 -94
  317. package/components/relationships/_relationships.scss +9 -9
  318. package/components/relationships/example-relationships-error.njk +176 -168
  319. package/components/relationships/example-relationships-you.njk +169 -163
  320. package/components/relationships/example-relationships.njk +167 -161
  321. package/components/relationships/relationships.dom.js +5 -5
  322. package/components/relationships/relationships.js +18 -18
  323. package/components/relationships/relationships.spec.js +71 -71
  324. package/components/reply/_macro.spec.js +47 -47
  325. package/components/reply/reply-input.js +15 -15
  326. package/components/reply/reply.dom.js +5 -5
  327. package/components/reply/reply.spec.js +57 -57
  328. package/components/section-navigation/_macro.njk +34 -12
  329. package/components/section-navigation/_macro.spec.js +210 -210
  330. package/components/section-navigation/_section-navigation.scss +76 -76
  331. package/components/select/_macro.njk +21 -18
  332. package/components/select/_macro.spec.js +166 -166
  333. package/components/share-page/_macro.njk +10 -5
  334. package/components/share-page/_macro.spec.js +68 -68
  335. package/components/skip-to-content/_macro.njk +1 -1
  336. package/components/skip-to-content/_macro.spec.js +54 -54
  337. package/components/skip-to-content/_skip.scss +30 -30
  338. package/components/skip-to-content/example-skip-to-content.njk +1 -0
  339. package/components/skip-to-content/skip-to-content.dom.js +6 -6
  340. package/components/skip-to-content/skip-to-content.js +7 -7
  341. package/components/skip-to-content/skip-to-content.spec.js +21 -21
  342. package/components/status/_macro.njk +1 -1
  343. package/components/status/_macro.spec.js +53 -53
  344. package/components/status/_status.scss +32 -32
  345. package/components/summary/_macro.njk +53 -23
  346. package/components/summary/_macro.spec.js +551 -535
  347. package/components/summary/_summary.scss +191 -195
  348. package/components/summary/example-summary-household-no-rows.njk +18 -16
  349. package/components/summary/example-summary-household.njk +75 -73
  350. package/components/summary/example-summary-hub-minimal.njk +74 -72
  351. package/components/summary/example-summary-hub.njk +169 -167
  352. package/components/table/_macro.njk +72 -45
  353. package/components/table/_macro.spec.js +499 -499
  354. package/components/table/_table.scss +204 -201
  355. package/components/table/scrollable-table.dom.js +5 -5
  356. package/components/table/scrollable-table.js +60 -60
  357. package/components/table/sortable-table.dom.js +5 -5
  358. package/components/table/sortable-table.js +135 -135
  359. package/components/table/table.spec.js +144 -140
  360. package/components/table-of-contents/_macro.njk +34 -32
  361. package/components/table-of-contents/_macro.spec.js +125 -125
  362. package/components/table-of-contents/_toc.scss +9 -9
  363. package/components/table-of-contents/example-table-of-contents-grouped.njk +1 -1
  364. package/components/table-of-contents/example-table-of-contents-single.njk +1 -1
  365. package/components/table-of-contents/example-table-of-contents-sticky-full-page.njk +79 -38
  366. package/components/table-of-contents/example-table-of-contents-sticky.njk +50 -13
  367. package/components/table-of-contents/toc.dom.js +5 -5
  368. package/components/table-of-contents/toc.js +30 -30
  369. package/components/table-of-contents/toc.spec.js +88 -88
  370. package/components/tabs/_macro.njk +12 -6
  371. package/components/tabs/_macro.spec.js +92 -92
  372. package/components/tabs/_tabs.scss +120 -115
  373. package/components/tabs/example-tabs-details.njk +5 -6
  374. package/components/tabs/tabs.dom.js +5 -5
  375. package/components/tabs/tabs.js +266 -266
  376. package/components/tabs/tabs.spec.js +268 -268
  377. package/components/text-indent/_macro.njk +1 -3
  378. package/components/text-indent/_macro.spec.js +33 -33
  379. package/components/text-indent/_text-indent.scss +3 -3
  380. package/components/textarea/_macro.njk +49 -46
  381. package/components/textarea/_macro.spec.js +227 -238
  382. package/components/textarea/textarea.dom.js +5 -5
  383. package/components/textarea/textarea.spec.js +78 -74
  384. package/components/timeline/_macro.njk +4 -6
  385. package/components/timeline/_macro.spec.js +83 -83
  386. package/components/timeline/_timeline.scss +26 -26
  387. package/components/timeout-modal/_macro.njk +21 -19
  388. package/components/timeout-modal/_macro.spec.js +47 -47
  389. package/components/timeout-modal/example-timeout-modal.njk +16 -14
  390. package/components/timeout-modal/timeout-modal.dom.js +9 -9
  391. package/components/timeout-modal/timeout-modal.js +66 -66
  392. package/components/timeout-modal/timeout-modal.spec.js +157 -157
  393. package/components/timeout-panel/_macro.njk +19 -17
  394. package/components/timeout-panel/_macro.spec.js +41 -41
  395. package/components/timeout-panel/example-panel-with-timeout-warning.njk +13 -11
  396. package/components/timeout-panel/timeout-panel.dom.js +8 -8
  397. package/components/timeout-panel/timeout-panel.spec.js +118 -118
  398. package/components/upload/_macro.njk +20 -16
  399. package/components/upload/_macro.spec.js +52 -52
  400. package/components/upload/_upload.scss +28 -28
  401. package/components/video/_macro.njk +16 -2
  402. package/components/video/_macro.spec.js +42 -42
  403. package/components/video/_video.scss +16 -16
  404. package/components/video/example-video.njk +2 -2
  405. package/components/video/video.dom.js +5 -5
  406. package/components/video/video.js +32 -32
  407. package/components/video/video.spec.js +103 -97
  408. package/css/main.css +1 -1
  409. package/favicons/manifest.json +25 -25
  410. package/js/abortable-fetch.js +23 -23
  411. package/js/analytics.js +53 -53
  412. package/js/cookies-functions.js +135 -135
  413. package/js/cookies-settings.dom.js +7 -7
  414. package/js/cookies-settings.js +77 -77
  415. package/js/cookies-settings.spec.js +106 -106
  416. package/js/domready.js +8 -8
  417. package/js/fetch.js +14 -14
  418. package/js/inpagelink.dom.js +5 -5
  419. package/js/inpagelink.js +19 -19
  420. package/js/polyfills.js +0 -1
  421. package/js/print-button.js +6 -6
  422. package/js/timeout.js +211 -211
  423. package/layout/_dsTemplate.njk +22 -20
  424. package/layout/_template.njk +63 -51
  425. package/package.json +132 -128
  426. package/scripts/main.es5.js +1 -1
  427. package/scripts/main.js +1 -1
  428. package/scss/base/_forms.scss +10 -10
  429. package/scss/base/_global.scss +45 -44
  430. package/scss/base/_typography.scss +20 -20
  431. package/scss/helpers/_functions.scss +18 -15
  432. package/scss/helpers/_mixins.scss +59 -53
  433. package/scss/helpers/_mq.scss +62 -65
  434. package/scss/objects/_container.scss +20 -20
  435. package/scss/objects/_page.scss +33 -33
  436. package/scss/objects/_spacing.scss +10 -10
  437. package/scss/overrides/hcm.scss +237 -237
  438. package/scss/overrides/rtl.scss +95 -95
  439. package/scss/print.scss +47 -47
  440. package/scss/utilities/_border.scss +7 -7
  441. package/scss/utilities/_colors.scss +6 -6
  442. package/scss/utilities/_display.scss +8 -8
  443. package/scss/utilities/_float.scss +7 -7
  444. package/scss/utilities/_grid.scss +144 -144
  445. package/scss/utilities/_highlight.scss +4 -4
  446. package/scss/utilities/_margin.scss +17 -17
  447. package/scss/utilities/_pad.scss +15 -15
  448. package/scss/utilities/_typography.scss +35 -33
  449. package/scss/utilities/_utilities.scss +8 -8
  450. package/scss/utilities/_visibility.scss +25 -25
  451. package/scss/vars/_colors.scss +116 -116
  452. package/scss/vars/_forms.scss +22 -22
  453. package/scss/vars/_grid.scss +11 -9
  454. package/scss/vars/_typography.scss +54 -54
package/components/relationships/example-relationships-you.njk CHANGED
@@ -1,187 +1,193 @@
1
1
  ---
2
- title: "Example: First-person relationship question"
2
+ title: 'Example: First-person relationship question'
3
3
  layout: ~
4
4
  ---
5
+
5
6
  {% extends "layout/_template.njk" %}
6
7
  {% from "components/question/_macro.njk" import onsQuestion %}
7
8
  {% from "components/relationships/_macro.njk" import onsRelationships %}
8
-
9
- {% set pageConfig = {
10
- "header": {
11
- "title": "Relationships example"
12
- },
13
- "breadcrumbs": {
14
- "ariaLabel": 'Breadcrumbs',
15
- "itemsList": [
16
- {
17
- "url": '#0',
18
- "text": 'Previous'
19
- }
20
- ]
9
+ {%
10
+ set pageConfig = {
11
+ "header": {
12
+ "title": "Relationships example"
13
+ },
14
+ "breadcrumbs": {
15
+ "ariaLabel": 'Breadcrumbs',
16
+ "itemsList": [
17
+ {
18
+ "url": '#0',
19
+ "text": 'Previous'
20
+ }
21
+ ]
22
+ }
21
23
  }
22
- } %}
24
+ %}
23
25
 
24
26
  {% block main %}
25
- {% call onsQuestion({
26
- "title": "Joe Bloggs is your <strong>…</strong>",
27
- "description": "<p>Complete the sentence by selecting the appropriate relationship</p>",
28
- "readDescriptionFirst": true,
29
- "legendIsQuestionTitle": true,
30
- "legendTitleClasses": "ons-js-relationships-legend",
31
- "submitButton": true
32
- }) %}
33
- {{ onsRelationships({
34
- "legend": "Joe Bloggs is your <strong>…</strong>",
35
- "legendClasses": "ons-u-vh",
36
- "playback": "Joe Bloggs is your <strong>…</strong>",
37
- "name": "relationship",
38
- "dontWrap": true,
39
- "radios": [
40
- {
41
- "id": "husband-wife-example-relationships-you",
42
- "value": "husband-wife",
43
- "label": {
44
- "text": "Husband or wife"
27
+ {%
28
+ call onsQuestion({
29
+ "title": "Joe Bloggs is your <strong>…</strong>",
30
+ "description": "<p>Complete the sentence by selecting the appropriate relationship</p>",
31
+ "readDescriptionFirst": true,
32
+ "legendIsQuestionTitle": true,
33
+ "legendTitleClasses": "ons-js-relationships-legend",
34
+ "submitButton": true
35
+ })
36
+ %}
37
+ {{
38
+ onsRelationships({
39
+ "legend": "Joe Bloggs is your <strong>…</strong>",
40
+ "legendClasses": "ons-u-vh",
41
+ "playback": "Joe Bloggs is your <strong>…</strong>",
42
+ "name": "relationship",
43
+ "dontWrap": true,
44
+ "radios": [
45
+ {
46
+ "id": "husband-wife-example-relationships-you",
47
+ "value": "husband-wife",
48
+ "label": {
49
+ "text": "Husband or wife"
50
+ },
51
+ "attributes": {
52
+ "data-title": "Joe Bloggs is your <strong>husband or wife</strong>",
53
+ "data-playback": "Joe Bloggs is your <strong>husband or wife</strong>"
54
+ }
45
55
  },
46
- "attributes": {
47
- "data-title": "Joe Bloggs is your <strong>husband or wife</strong>",
48
- "data-playback": "Joe Bloggs is your <strong>husband or wife</strong>"
49
- }
50
- },
51
- {
52
- "id": "civil-partner-example-relationships-you",
53
- "value": "civil-partner",
54
- "label": {
55
- "text": "Legally registered civil partner"
56
+ {
57
+ "id": "civil-partner-example-relationships-you",
58
+ "value": "civil-partner",
59
+ "label": {
60
+ "text": "Legally registered civil partner"
61
+ },
62
+ "attributes": {
63
+ "data-title": "Joe Bloggs is your <strong>legally registered civil partner</strong>",
64
+ "data-playback": "Joe Bloggs is your <strong>legally registered civil partner</strong>"
65
+ }
56
66
  },
57
- "attributes": {
58
- "data-title": "Joe Bloggs is your <strong>legally registered civil partner</strong>",
59
- "data-playback": "Joe Bloggs is your <strong>legally registered civil partner</strong>"
60
- }
61
- },
62
- {
63
- "id": "partner-example-relationships-you",
64
- "value": "partner",
65
- "label": {
66
- "text": "Partner"
67
+ {
68
+ "id": "partner-example-relationships-you",
69
+ "value": "partner",
70
+ "label": {
71
+ "text": "Partner"
72
+ },
73
+ "attributes": {
74
+ "data-title": "Joe Bloggs is your <strong>partner</strong>",
75
+ "data-playback": "Joe Bloggs is your <strong>partner</strong>"
76
+ }
67
77
  },
68
- "attributes": {
69
- "data-title": "Joe Bloggs is your <strong>partner</strong>",
70
- "data-playback": "Joe Bloggs is your <strong>partner</strong>"
71
- }
72
- },
73
- {
74
- "id": "son-daughter-example-relationships-you",
75
- "value": "son-daughter",
76
- "label": {
77
- "text": "Son or daughter"
78
+ {
79
+ "id": "son-daughter-example-relationships-you",
80
+ "value": "son-daughter",
81
+ "label": {
82
+ "text": "Son or daughter"
83
+ },
84
+ "attributes": {
85
+ "data-title": "Joe Bloggs is your <strong>son or daughter</strong>",
86
+ "data-playback": "Joe Bloggs is your <strong>son or daughter</strong>"
87
+ }
78
88
  },
79
- "attributes": {
80
- "data-title": "Joe Bloggs is your <strong>son or daughter</strong>",
81
- "data-playback": "Joe Bloggs is your <strong>son or daughter</strong>"
82
- }
83
- },
84
- {
85
- "id": "stepchild-example-relationships-you",
86
- "value": "stepchild",
87
- "label": {
88
- "text": "Stepchild"
89
+ {
90
+ "id": "stepchild-example-relationships-you",
91
+ "value": "stepchild",
92
+ "label": {
93
+ "text": "Stepchild"
94
+ },
95
+ "attributes": {
96
+ "data-title": "Joe Bloggs is your <strong>stepchild</strong>",
97
+ "data-playback": "Joe Bloggs is your <strong>stepchild</strong>"
98
+ }
89
99
  },
90
- "attributes": {
91
- "data-title": "Joe Bloggs is your <strong>stepchild</strong>",
92
- "data-playback": "Joe Bloggs is your <strong>stepchild</strong>"
93
- }
94
- },
95
- {
96
- "id": "brother-sister-example-relationships-you",
97
- "value": "brother-sister",
98
- "label": {
99
- "text": "Brother or sister"
100
+ {
101
+ "id": "brother-sister-example-relationships-you",
102
+ "value": "brother-sister",
103
+ "label": {
104
+ "text": "Brother or sister"
105
+ },
106
+ "attributes": {
107
+ "data-title": "Joe Bloggs is your <strong>brother or sister</strong>",
108
+ "data-playback": "Joe Bloggs is your <strong>brother or sister</strong>"
109
+ }
100
110
  },
101
- "attributes": {
102
- "data-title": "Joe Bloggs is your <strong>brother or sister</strong>",
103
- "data-playback": "Joe Bloggs is your <strong>brother or sister</strong>"
104
- }
105
- },
106
- {
107
- "id": "stepbrother-stepsister-example-relationships-you",
108
- "value": "stepbrother-stepsister",
109
- "label": {
110
- "text": "Stepbrother or stepsister"
111
- },
112
- "attributes": {
113
- "data-title": "Joe Bloggs is your <strong>stepbrother or sister</strong>",
114
- "data-playback": "Joe Bloggs is your <strong>stepbrother or sister</strong>"
115
- }
116
- },
117
- {
118
- "id": "mother-father-example-relationships-you",
119
- "value": "mother-father",
120
- "label": {
121
- "text": "Mother or father"
111
+ {
112
+ "id": "stepbrother-stepsister-example-relationships-you",
113
+ "value": "stepbrother-stepsister",
114
+ "label": {
115
+ "text": "Stepbrother or stepsister"
116
+ },
117
+ "attributes": {
118
+ "data-title": "Joe Bloggs is your <strong>stepbrother or sister</strong>",
119
+ "data-playback": "Joe Bloggs is your <strong>stepbrother or sister</strong>"
120
+ }
122
121
  },
123
- "attributes": {
124
- "data-title": "Joe Bloggs is your <strong>mother or father</strong>",
125
- "data-playback": "Joe Bloggs is your <strong>mother or father</strong>"
126
- }
127
- },
128
- {
129
- "id": "stepmother-stepfather-example-relationships-you",
130
- "value": "stepmother-stepfather",
131
- "label": {
132
- "text": "Stepmother or stepfather"
122
+ {
123
+ "id": "mother-father-example-relationships-you",
124
+ "value": "mother-father",
125
+ "label": {
126
+ "text": "Mother or father"
127
+ },
128
+ "attributes": {
129
+ "data-title": "Joe Bloggs is your <strong>mother or father</strong>",
130
+ "data-playback": "Joe Bloggs is your <strong>mother or father</strong>"
131
+ }
133
132
  },
134
- "attributes": {
135
- "data-title": "Joe Bloggs is your <strong>stepmother or stepfather</strong>",
136
- "data-playback": "Joe Bloggs is your <strong>stepmother or stepfather</strong>"
137
- }
138
- },
139
- {
140
- "id": "grandchild-example-relationships-you",
141
- "value": "grandchild",
142
- "label": {
143
- "text": "Grandchild"
133
+ {
134
+ "id": "stepmother-stepfather-example-relationships-you",
135
+ "value": "stepmother-stepfather",
136
+ "label": {
137
+ "text": "Stepmother or stepfather"
138
+ },
139
+ "attributes": {
140
+ "data-title": "Joe Bloggs is your <strong>stepmother or stepfather</strong>",
141
+ "data-playback": "Joe Bloggs is your <strong>stepmother or stepfather</strong>"
142
+ }
144
143
  },
145
- "attributes": {
146
- "data-title": "Joe Bloggs is your <strong>grandchild</strong>",
147
- "data-playback": "Joe Bloggs is your <strong>grandchild</strong>"
148
- }
149
- },
150
- {
151
- "id": "grandparent-example-relationships-you",
152
- "value": "grandparent",
153
- "label": {
154
- "text": "Grandparent"
144
+ {
145
+ "id": "grandchild-example-relationships-you",
146
+ "value": "grandchild",
147
+ "label": {
148
+ "text": "Grandchild"
149
+ },
150
+ "attributes": {
151
+ "data-title": "Joe Bloggs is your <strong>grandchild</strong>",
152
+ "data-playback": "Joe Bloggs is your <strong>grandchild</strong>"
153
+ }
155
154
  },
156
- "attributes": {
157
- "data-title": "Joe Bloggs is your <strong>grandparent</strong>",
158
- "data-playback": "Joe Bloggs is your <strong>grandparent</strong>"
159
- }
160
- },
161
- {
162
- "id": "other-relation-example-relationships-you",
163
- "value": "other-relation",
164
- "label": {
165
- "text": "Other relation"
155
+ {
156
+ "id": "grandparent-example-relationships-you",
157
+ "value": "grandparent",
158
+ "label": {
159
+ "text": "Grandparent"
160
+ },
161
+ "attributes": {
162
+ "data-title": "Joe Bloggs is your <strong>grandparent</strong>",
163
+ "data-playback": "Joe Bloggs is your <strong>grandparent</strong>"
164
+ }
166
165
  },
167
- "attributes": {
168
- "data-title": "Joe Bloggs is your <strong>other relation</strong>",
169
- "data-playback": "Joe Bloggs is your <strong>other relation</strong>"
170
- }
171
- },
172
- {
173
- "id": "unrelated-example-relationships-you",
174
- "value": "unrelated",
175
- "label": {
176
- "text": "Unrelated",
177
- "description": "Including foster child"
166
+ {
167
+ "id": "other-relation-example-relationships-you",
168
+ "value": "other-relation",
169
+ "label": {
170
+ "text": "Other relation"
171
+ },
172
+ "attributes": {
173
+ "data-title": "Joe Bloggs is your <strong>other relation</strong>",
174
+ "data-playback": "Joe Bloggs is your <strong>other relation</strong>"
175
+ }
178
176
  },
179
- "attributes": {
180
- "data-title": "Joe Bloggs is <strong>unrelated</strong> to you",
181
- "data-playback": "Joe Bloggs is <strong>unrelated</strong> to you"
177
+ {
178
+ "id": "unrelated-example-relationships-you",
179
+ "value": "unrelated",
180
+ "label": {
181
+ "text": "Unrelated",
182
+ "description": "Including foster child"
183
+ },
184
+ "attributes": {
185
+ "data-title": "Joe Bloggs is <strong>unrelated</strong> to you",
186
+ "data-playback": "Joe Bloggs is <strong>unrelated</strong> to you"
187
+ }
182
188
  }
183
- }
184
- ]
185
- }) }}
189
+ ]
190
+ })
191
+ }}
186
192
  {% endcall %}
187
193
  {% endblock %}