@ons/design-system 54.0.0 → 55.1.0

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 (69) hide show
  1. package/components/autosuggest/_autosuggest.scss +4 -4
  2. package/components/autosuggest/autosuggest.spec.js +12 -2
  3. package/components/autosuggest/autosuggest.ui.js +4 -7
  4. package/components/browser-banner/_macro.njk +1 -1
  5. package/components/browser-banner/_macro.spec.js +31 -0
  6. package/components/button/_button.scss +28 -7
  7. package/components/button/_macro.njk +1 -1
  8. package/components/button/_macro.spec.js +2 -2
  9. package/components/checkboxes/_checkbox.scss +50 -17
  10. package/components/collapsible/_collapsible.scss +2 -1
  11. package/components/document-list/document-list.scss +2 -0
  12. package/components/download-resources/download-resources.js +19 -0
  13. package/components/download-resources/download-resources.spec.js +95 -0
  14. package/components/external-link/_macro.njk +1 -1
  15. package/components/external-link/_macro.spec.js +2 -2
  16. package/components/fieldset/_fieldset.scss +11 -1
  17. package/components/fieldset/_macro.njk +9 -8
  18. package/components/fieldset/_macro.spec.js +27 -5
  19. package/components/footer/_footer.scss +1 -0
  20. package/components/footer/_macro.njk +1 -1
  21. package/components/footer/_macro.spec.js +18 -0
  22. package/components/header/_header.scss +7 -2
  23. package/components/header/_macro.njk +34 -8
  24. package/components/header/_macro.spec.js +82 -14
  25. package/components/hero/_macro.njk +1 -1
  26. package/components/hero/_macro.spec.js +1 -1
  27. package/components/icons/_macro.njk +1 -1
  28. package/components/input/_input-type.scss +37 -3
  29. package/components/input/_input.scss +28 -9
  30. package/components/input/_macro.njk +15 -17
  31. package/components/label/_label.scss +1 -1
  32. package/components/label/_macro.njk +27 -15
  33. package/components/label/_macro.spec.js +31 -0
  34. package/components/lists/_macro.njk +1 -1
  35. package/components/lists/_macro.spec.js +2 -2
  36. package/components/message/_message.scss +1 -0
  37. package/components/modal/_macro.njk +2 -2
  38. package/components/modal/_modal.scss +10 -9
  39. package/components/navigation/_macro.njk +1 -2
  40. package/components/navigation/_macro.spec.js +0 -1
  41. package/components/pagination/_pagination.scss +1 -0
  42. package/components/panel/_macro.njk +6 -9
  43. package/components/panel/_macro.spec.js +23 -20
  44. package/components/panel/_panel.scss +13 -5
  45. package/components/phase-banner/_macro.njk +1 -1
  46. package/components/phase-banner/_macro.spec.js +31 -0
  47. package/components/phase-banner/_phase-banner.scss +1 -0
  48. package/components/radios/_radio.scss +16 -4
  49. package/components/relationships/_relationships.scss +2 -2
  50. package/components/reply/_macro.njk +2 -2
  51. package/components/skip-to-content/_skip.scss +2 -1
  52. package/components/table/_macro.njk +3 -2
  53. package/components/table/_macro.spec.js +0 -27
  54. package/components/table/_table.scss +15 -7
  55. package/components/table/sortable-table.js +1 -0
  56. package/components/tabs/_tabs.scss +57 -34
  57. package/components/tabs/tabs.js +4 -2
  58. package/components/upload/_upload.scss +2 -2
  59. package/css/census.css +1 -1
  60. package/css/ids.css +1 -1
  61. package/css/main.css +1 -1
  62. package/layout/_template.njk +25 -12
  63. package/package.json +1 -1
  64. package/scripts/main.es5.js +1 -1
  65. package/scripts/main.js +1 -1
  66. package/scss/base/_global.scss +1 -0
  67. package/scss/overrides/hcm.scss +205 -46
  68. package/scss/patternlib.scss +1 -56
  69. package/scss/vars/_colors.scss +2 -1
package/layout/_template.njk CHANGED
@@ -42,6 +42,15 @@
42
42
  {% set page_title = "ONS Design System" %}
43
43
  {% endif %}
44
44
 
45
+ {# Page container #}
46
+ {% if pageConfig.fullWidth %}
47
+ {% set containerClasses = ' ' + 'ons-container--full-width' %}
48
+ {% elif pageConfig.wide %}
49
+ {% set containerClasses = ' ' + 'ons-container--wide' %}
50
+ {% elif pageConfig.containerClasses %}
51
+ {% set containerClasses = ' ' + pageConfig.containerClasses %}
52
+ {% endif %}
53
+
45
54
  {# Page columns #}
46
55
  {% set mainColNumber = "8" %}
47
56
 
@@ -128,14 +137,6 @@
128
137
  {% block body %}
129
138
  <div class="ons-page">
130
139
  <div class="ons-page__content">
131
- {% block skipLink %}
132
- {{
133
- onsSkipToContent({
134
- "url": "#main-content",
135
- "text": "Skip to main content"
136
- })
137
- }}
138
- {% endblock %}
139
140
  {% if form is defined and form and form.attributes is defined and form.attributes %}
140
141
  <form
141
142
  {% if form.classes is defined and form.classes %}class="{{ form.classes }}"{% endif %}
@@ -144,13 +145,19 @@
144
145
  >
145
146
  {% endif %}
146
147
  {% block preHeader %}{% endblock %}
148
+ {% block skipLink %}
149
+ {{
150
+ onsSkipToContent({
151
+ "url": "#main-content",
152
+ "text": "Skip to main content"
153
+ })
154
+ }}
155
+ {% endblock %}
147
156
  {% block header %}
148
157
  {{
149
158
  onsHeader({
150
- "title": pageConfig.header.title | default(pageConfig.title),
151
- "classes": pageConfig.header.classes,
152
- "variants": pageConfig.header.variants,
153
159
  "wide": pageConfig.wide,
160
+ "fullWidth": pageConfig.fullWidth,
154
161
  "language": pageConfig.language,
155
162
  "button": pageConfig.signoutButton,
156
163
  "toggleNavigationButton": pageConfig.toggleNavigationButton,
@@ -159,11 +166,16 @@
159
166
  "phase": pageConfig.phase,
160
167
  "assetsURL": assetsURL,
161
168
  "serviceLinks": pageConfig.serviceLinks,
169
+ "variants": pageConfig.header.variants,
170
+ "classes": pageConfig.header.classes,
162
171
  "noMasthead": pageConfig.header.noMasthead,
163
172
  "orgLogo": pageConfig.header.orgLogo,
164
173
  "orgMobileLogo": pageConfig.header.orgMobileLogo,
165
174
  "orgLogoAlt": pageConfig.header.orgLogoAlt,
166
175
  "orgLogoHref": pageConfig.header.orgLogoHref,
176
+ "title": pageConfig.header.title | default(pageConfig.title),
177
+ "description": pageConfig.header.description,
178
+ "titleAsH1": pageConfig.header.titleAshH1,
167
179
  "titleLogo": pageConfig.header.titleLogo,
168
180
  "titleLogoClasses": pageConfig.header.titleLogoClasses,
169
181
  "titleLogoMobile": pageConfig.header.titleLogoMobile,
@@ -175,7 +187,7 @@
175
187
  }}
176
188
  {% endblock %}
177
189
  {% block pageContent %}
178
- <div class="ons-page__container ons-container {{ containerClasses }}">
190
+ <div class="ons-page__container ons-container{{ containerClasses }}">
179
191
  {% if pageConfig.breadcrumbs is defined and pageConfig.breadcrumbs %}
180
192
  {% from "components/breadcrumbs/_macro.njk" import onsBreadcrumbs %}
181
193
  {{
@@ -223,6 +235,7 @@
223
235
  onsFooter({
224
236
  "assetsURL": assetsURL,
225
237
  "wide": pageConfig.wide,
238
+ "fullWidth": pageConfig.fullWidth,
226
239
  "classes": "ons-page__footer",
227
240
  "language": pageConfig.language,
228
241
  "lang": currentLanguageISOCode,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ons/design-system",
3
3
  "description": "ONS Design System built CSS, JS, and Nunjucks templates",
4
- "version": "54.0.0",
4
+ "version": "55.1.0",
5
5
  "main": "index.js",
6
6
  "license": "MIT",
7
7
  "author": {