govuk_publishing_components 66.8.0 → 67.0.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 (93) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss +0 -1
  3. data/app/assets/stylesheets/govuk_publishing_components/components/_breadcrumbs.scss +0 -20
  4. data/app/assets/stylesheets/govuk_publishing_components/components/_details.scss +56 -0
  5. data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +0 -1
  6. data/app/assets/stylesheets/govuk_publishing_components/components/_input.scss +0 -2
  7. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss +2 -9
  8. data/app/assets/stylesheets/govuk_publishing_components/components/_metadata.scss +43 -5
  9. data/app/assets/stylesheets/govuk_publishing_components/components/_modal-dialogue.scss +3 -6
  10. data/app/assets/stylesheets/govuk_publishing_components/components/_phase-banner.scss +0 -13
  11. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_tables.scss +0 -1
  12. data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_brand-colours.scss +0 -54
  13. data/app/views/govuk_publishing_components/components/_breadcrumbs.html.erb +1 -1
  14. data/app/views/govuk_publishing_components/components/_contextual_breadcrumbs.html.erb +4 -6
  15. data/app/views/govuk_publishing_components/components/_details.html.erb +3 -0
  16. data/app/views/govuk_publishing_components/components/_metadata.html.erb +34 -3
  17. data/app/views/govuk_publishing_components/components/_notice.html.erb +0 -2
  18. data/app/views/govuk_publishing_components/components/_phase_banner.html.erb +0 -2
  19. data/app/views/govuk_publishing_components/components/docs/details.yml +12 -0
  20. data/app/views/govuk_publishing_components/components/docs/metadata.yml +30 -7
  21. data/app/views/govuk_publishing_components/components/docs/notice.yml +0 -6
  22. data/app/views/govuk_publishing_components/components/docs/organisation_logo.yml +1 -1
  23. data/app/views/govuk_publishing_components/components/docs/phase_banner.yml +0 -12
  24. data/config/locales/ar.yml +3 -0
  25. data/config/locales/az.yml +3 -0
  26. data/config/locales/be.yml +3 -0
  27. data/config/locales/bg.yml +3 -0
  28. data/config/locales/bn.yml +3 -0
  29. data/config/locales/cs.yml +3 -0
  30. data/config/locales/cy.yml +3 -0
  31. data/config/locales/da.yml +3 -0
  32. data/config/locales/de.yml +3 -0
  33. data/config/locales/dr.yml +3 -0
  34. data/config/locales/el.yml +3 -0
  35. data/config/locales/en.yml +3 -0
  36. data/config/locales/es-419.yml +3 -0
  37. data/config/locales/es.yml +3 -0
  38. data/config/locales/et.yml +3 -0
  39. data/config/locales/fa.yml +3 -0
  40. data/config/locales/fi.yml +3 -0
  41. data/config/locales/fr.yml +3 -0
  42. data/config/locales/gd.yml +3 -0
  43. data/config/locales/gu.yml +3 -0
  44. data/config/locales/he.yml +3 -0
  45. data/config/locales/hi.yml +3 -0
  46. data/config/locales/hr.yml +3 -0
  47. data/config/locales/hu.yml +3 -0
  48. data/config/locales/hy.yml +3 -0
  49. data/config/locales/id.yml +3 -0
  50. data/config/locales/is.yml +3 -0
  51. data/config/locales/it.yml +3 -0
  52. data/config/locales/ja.yml +3 -0
  53. data/config/locales/ka.yml +3 -0
  54. data/config/locales/kk.yml +3 -0
  55. data/config/locales/ko.yml +6 -3
  56. data/config/locales/ku.yml +3 -0
  57. data/config/locales/ky.yml +3 -0
  58. data/config/locales/lt.yml +3 -0
  59. data/config/locales/lv.yml +3 -0
  60. data/config/locales/ms.yml +3 -0
  61. data/config/locales/mt.yml +3 -0
  62. data/config/locales/ne.yml +5 -2
  63. data/config/locales/nl.yml +3 -0
  64. data/config/locales/no.yml +3 -0
  65. data/config/locales/pa-pk.yml +3 -0
  66. data/config/locales/pa.yml +3 -0
  67. data/config/locales/pl.yml +3 -0
  68. data/config/locales/ps.yml +3 -0
  69. data/config/locales/pt.yml +3 -0
  70. data/config/locales/ro.yml +3 -0
  71. data/config/locales/ru.yml +3 -0
  72. data/config/locales/si.yml +3 -0
  73. data/config/locales/sk.yml +3 -0
  74. data/config/locales/sl.yml +3 -0
  75. data/config/locales/so.yml +3 -0
  76. data/config/locales/sq.yml +3 -0
  77. data/config/locales/sr.yml +3 -0
  78. data/config/locales/sv.yml +3 -0
  79. data/config/locales/sw.yml +3 -0
  80. data/config/locales/ta.yml +3 -0
  81. data/config/locales/th.yml +3 -0
  82. data/config/locales/ti.yml +3 -0
  83. data/config/locales/tk.yml +3 -0
  84. data/config/locales/tr.yml +3 -0
  85. data/config/locales/uk.yml +3 -0
  86. data/config/locales/ur.yml +3 -0
  87. data/config/locales/uz.yml +3 -0
  88. data/config/locales/vi.yml +3 -0
  89. data/config/locales/zh-hk.yml +3 -0
  90. data/config/locales/zh-tw.yml +3 -0
  91. data/config/locales/zh.yml +3 -0
  92. data/lib/govuk_publishing_components/version.rb +1 -1
  93. metadata +2 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: eff7e55b8b6df261960e3f96ae3699b165e061482d22018d22f0e437a4d08f48
4
- data.tar.gz: b2a63d1cc15ee867480f28c6574725c25aa917972dfe94539326b00c6ae2ab84
3
+ metadata.gz: 07f0efc1a3023358e2584fdcd3bf5dbaef619c6d4c740036ab0990018f3c957d
4
+ data.tar.gz: d4927e6211c1247bbf699403bbea9a6356a6cf879e2cda490d03cd74c08098f4
5
5
  SHA512:
6
- metadata.gz: df29a3021aee6334c5bb4a41f0da66367ed181680fe2881482fc56030639ac79036ab2271bc95c56070c920affa39e0d273ec53a0d62c13f469e5a001d4b6c9c
7
- data.tar.gz: e485483334794b71024ca797f717cd6cd0ffa8c6ab575c5b52153c6f234ca0788586c6c35245e009de83bd3bd881cde3645d01851469b802f0b8c3c909728976
6
+ metadata.gz: cf09a1069080191a1962a9adaf021e95dee155be1c8548229c8ea8aa5901110fcea1e7a63120451d402ab7b1f9fc17724e522127b62fc11ba25f3c97cfa6770a
7
+ data.tar.gz: a4cf351f3e2ed79320e3e693846980e68d4cc19065dcc00f57db06e1b292c978e532b0ea804f4a51f9ccedcabeefa9ea4526658423f33e8aaecca69f9a0242e9
@@ -5,7 +5,6 @@
5
5
 
6
6
  .gem-c-big-number__value {
7
7
  line-height: 1;
8
- font-size: 80px;
9
8
  font-size: govuk-px-to-rem(80px);
10
9
  @include govuk-font($size: false, $weight: bold);
11
10
  // Make the value an inline element, and the label a block level element to make them stack vertically but be announced as one element by JAWS and NVDA.
@@ -26,23 +26,3 @@
26
26
  }
27
27
  }
28
28
  }
29
-
30
- @include govuk-media-query($media-type: print) {
31
- .gem-c-breadcrumbs {
32
- font-size: 12pt;
33
- }
34
-
35
- .gem-c-breadcrumbs,
36
- .govuk-breadcrumbs {
37
- .govuk-breadcrumbs__list-item {
38
- .govuk-breadcrumbs__link:link,
39
- .govuk-breadcrumbs__link:visited {
40
- color: $govuk-print-text-colour;
41
- }
42
-
43
- &::before {
44
- border-color: $govuk-print-text-colour;
45
- }
46
- }
47
- }
48
- }
@@ -1,5 +1,46 @@
1
1
  @import "govuk/components/details/details";
2
2
 
3
+ [dir="rtl"] .gem-c-details,
4
+ .direction-rtl .gem-c-details,
5
+ .gem-c-details.direction-rtl {
6
+ direction: rtl;
7
+ text-align: start;
8
+
9
+ .govuk-details__summary {
10
+ padding-left: 0;
11
+ padding-right: govuk-spacing(5);
12
+
13
+ &::before {
14
+ left: auto;
15
+ right: 0;
16
+ transform: rotate(180deg);
17
+ }
18
+ }
19
+
20
+ &[open] {
21
+ .govuk-details__summary::before {
22
+ transform: none;
23
+ }
24
+ }
25
+
26
+ .govuk-details__text {
27
+ border: 0;
28
+ border-right: 5px solid $govuk-border-colour;
29
+ padding-left: 0;
30
+ padding-right: govuk-spacing(4);
31
+ }
32
+
33
+ &.gem-c-details--small {
34
+ .govuk-details__summary {
35
+ padding-right: govuk-spacing(4);
36
+ }
37
+
38
+ .govuk-details__text {
39
+ padding-right: govuk-spacing(3);
40
+ }
41
+ }
42
+ }
43
+
3
44
  .gem-c-details--black {
4
45
  .govuk-details__summary {
5
46
  color: govuk-colour("black");
@@ -34,6 +75,21 @@
34
75
  }
35
76
  }
36
77
 
78
+ .gem-c-details--small {
79
+ .govuk-details__summary {
80
+ padding-left: govuk-spacing(4);
81
+ }
82
+
83
+ .govuk-details__summary-text,
84
+ .govuk-details__text {
85
+ @include govuk-font(16);
86
+ }
87
+
88
+ .govuk-details__text {
89
+ padding-left: govuk-spacing(3);
90
+ }
91
+ }
92
+
37
93
  // fix for issue https://github.com/alphagov/govuk_publishing_components/issues/5436
38
94
  .govuk-details__summary {
39
95
  box-shadow: 0 4px transparent;
@@ -72,7 +72,6 @@
72
72
 
73
73
  .gem-c-image-card__context,
74
74
  .gem-c-image-card__metadata {
75
- font-size: 16px;
76
75
  font-size: govuk-px-to-rem(16px);
77
76
  margin: 0 0 calc(govuk-spacing(3) / 2);
78
77
  color: govuk-colour("dark-grey");
@@ -6,10 +6,8 @@ $search-icon-size: 40px;
6
6
  display: block;
7
7
  position: relative;
8
8
  z-index: 1;
9
- margin-bottom: -$search-icon-size;
10
9
  margin-bottom: -(govuk-px-to-rem($search-icon-size));
11
10
  width: $search-icon-size;
12
- height: $search-icon-size;
13
11
  height: govuk-px-to-rem($search-icon-size);
14
12
  background: url("govuk_publishing_components/icon-search.svg") no-repeat -3px center;
15
13
  }
@@ -158,7 +158,6 @@ $search-icon-height: 20px;
158
158
  .gem-c-layout-super-navigation-header__search-item-link {
159
159
  color: govuk-colour("white");
160
160
  display: inline-block;
161
- font-size: 19px;
162
161
  font-size: govuk-px-to-rem(19px);
163
162
  font-weight: bold;
164
163
  padding: govuk-spacing(4) 0;
@@ -182,7 +181,6 @@ $search-icon-height: 20px;
182
181
  &:link,
183
182
  &:visited {
184
183
  color: govuk-colour("white");
185
- font-size: 16px;
186
184
  font-size: govuk-px-to-rem(16px);
187
185
  height: govuk-spacing(4);
188
186
  text-decoration: none;
@@ -238,7 +236,6 @@ $search-icon-height: 20px;
238
236
 
239
237
  // JS available - target the "Menu" toggle button
240
238
  .gem-c-layout-super-navigation-header__navigation-top-toggle-button {
241
- font-size: 16px;
242
239
  font-size: govuk-px-to-rem(16px);
243
240
  font-weight: 700;
244
241
  background: none;
@@ -519,7 +516,7 @@ $search-icon-height: 20px;
519
516
  // JS available - styles the close icon, used when the search menu is in the open state
520
517
  .gem-c-layout-super-navigation-header__navigation-top-toggle-close-icon {
521
518
  display: none;
522
- font-size: 36px;
519
+ font-size: govuk-px-to-rem(36px);
523
520
  font-weight: normal;
524
521
  left: 0;
525
522
  line-height: 22px;
@@ -616,7 +613,6 @@ $search-icon-height: 20px;
616
613
  }
617
614
 
618
615
  .gem-c-layout-super-navigation-header__navigation-second-item-link {
619
- font-size: 16px;
620
616
  font-size: govuk-px-to-rem(16px);
621
617
  font-weight: bold;
622
618
 
@@ -634,7 +630,6 @@ $search-icon-height: 20px;
634
630
  }
635
631
 
636
632
  .gem-c-layout-super-navigation-header__navigation-second-item-link--with-description {
637
- font-size: 16px;
638
633
  font-size: govuk-px-to-rem(16px);
639
634
  font-weight: bold;
640
635
 
@@ -645,7 +640,6 @@ $search-icon-height: 20px;
645
640
  }
646
641
 
647
642
  .gem-c-layout-super-navigation-header__navigation-second-item-description {
648
- font-size: 16px;
649
643
  font-size: govuk-px-to-rem(16px);
650
644
  font-weight: normal;
651
645
  margin: govuk-spacing(1) 0 0 0;
@@ -661,7 +655,7 @@ $search-icon-height: 20px;
661
655
  }
662
656
 
663
657
  .gem-c-layout-super-navigation-header__column-header {
664
- font-size: 24px;
658
+ font-size: govuk-px-to-rem(24px);
665
659
  }
666
660
 
667
661
  // Ensure the total space to the left of the logo for mobile screen sizes is 24px (margin is 15px)
@@ -677,7 +671,6 @@ $search-icon-height: 20px;
677
671
  // custom class to the label of the search component to turn off
678
672
  // the responsive font size
679
673
  .gem-c-layout-super-navigation-header__search-label--large-navbar {
680
- font-size: 24px;
681
674
  font-size: govuk-px-to-rem(24px);
682
675
  }
683
676
  }
@@ -2,7 +2,6 @@
2
2
  @include govuk-text-colour;
3
3
  @include govuk-font(16);
4
4
  @include responsive-bottom-margin;
5
- @include govuk-clearfix;
6
5
 
7
6
  a {
8
7
  font-weight: bold;
@@ -31,6 +30,11 @@
31
30
 
32
31
  .gem-c-metadata__list {
33
32
  margin: 0;
33
+
34
+ @include govuk-media-query($from: tablet) {
35
+ display: grid;
36
+ grid-template-columns: auto 1fr;
37
+ }
34
38
  }
35
39
 
36
40
  .gem-c-metadata--inverse-padded {
@@ -58,10 +62,8 @@
58
62
  margin-top: .5em;
59
63
 
60
64
  @include govuk-media-query($from: tablet) {
61
- box-sizing: border-box;
62
- float: inline-start;
63
65
  padding-inline-start: 0;
64
- padding-inline-end: govuk-spacing(1);
66
+ padding-inline-end: govuk-spacing(2);
65
67
  margin-top: 0;
66
68
  }
67
69
  }
@@ -71,7 +73,7 @@
71
73
 
72
74
  @include govuk-media-query($from: tablet) {
73
75
  &:not(:last-of-type) {
74
- margin-bottom: govuk-spacing(1);
76
+ margin-bottom: govuk-spacing(2);
75
77
  }
76
78
  }
77
79
  }
@@ -88,6 +90,42 @@
88
90
  display: none;
89
91
  }
90
92
 
93
+ .gem-c-metadata--history {
94
+ padding-top: govuk-spacing(2);
95
+ border-top: 1px solid $govuk-border-colour;
96
+ }
97
+
98
+ .govuk-frontend-supported .gem-c-metadata .js-hidden {
99
+ display: none;
100
+ visibility: hidden;
101
+ }
102
+
103
+ .gem-c-metadata__toggle {
104
+ display: none;
105
+
106
+ .govuk-frontend-supported & {
107
+ display: inline-block;
108
+ font-weight: normal;
109
+ }
110
+ }
111
+
112
+ .gem-c-metadata__change-history {
113
+ margin: govuk-spacing(4) 0 0 0;
114
+ padding: 0;
115
+ list-style: none;
116
+ }
117
+
118
+ .gem-c-metadata__change-date {
119
+ display: block;
120
+ margin: govuk-spacing(3) 0;
121
+ @include govuk-font(16, $weight: bold);
122
+ }
123
+
124
+ .gem-c-metadata__change-note {
125
+ margin: 0;
126
+ white-space: pre-line;
127
+ }
128
+
91
129
  // stylelint-disable declaration-no-important
92
130
  @include govuk-media-query($media-type: print) {
93
131
  .gem-c-metadata {
@@ -117,12 +117,9 @@ $govuk-modal-wide-breakpoint: $govuk-page-width + $govuk-modal-margin * 2 + $gov
117
117
  color: govuk-colour("white");
118
118
  background: none;
119
119
  cursor: pointer;
120
-
121
- @include govuk-font($size: 36, $weight: bold, $line-height: 1.3);
122
- @include govuk-media-query($until: tablet) {
123
- font-size: 36px;
124
- line-height: 1.3;
125
- }
120
+ font-size: govuk-px-to-rem(36px);
121
+ line-height: 1.3;
122
+ @include govuk-font($size: false, $weight: bold);
126
123
 
127
124
  &:focus,
128
125
  &:hover {
@@ -1,19 +1,11 @@
1
1
  @import "govuk/components/phase-banner/phase-banner";
2
2
 
3
- .gem-c-phase-banner {
4
- .govuk-phase-banner__content__app-name {
5
- display: inline-block;
6
- margin-right: govuk-spacing(2);
7
- }
8
- }
9
-
10
3
  .gem-c-phase-banner--inverse {
11
4
  .govuk-phase-banner__content__tag {
12
5
  background: govuk-colour("white");
13
6
  color: $govuk-brand-colour;
14
7
  }
15
8
 
16
- .govuk-phase-banner__content__app-name,
17
9
  .govuk-phase-banner__text,
18
10
  .govuk-link {
19
11
  color: govuk-colour("white");
@@ -37,10 +29,5 @@
37
29
  border: 1pt solid $govuk-print-text-colour;
38
30
  }
39
31
  }
40
-
41
- .govuk-phase-banner__content__app-name {
42
- margin-bottom: 1mm;
43
- font-size: 12pt;
44
- }
45
32
  }
46
33
  // stylelint-enable declaration-no-important
@@ -39,7 +39,6 @@
39
39
  }
40
40
 
41
41
  td small {
42
- font-size: 19px;
43
42
  font-size: govuk-px-to-rem(19);
44
43
  }
45
44
 
@@ -13,60 +13,6 @@
13
13
 
14
14
  @include organisation-brand-colour;
15
15
 
16
- // in the past we used the-office-of-the-leader-of-the-house-of-commons before
17
- // the "the" prefix was dropped, this is maintained here for backwards
18
- // compatibility
19
- .brand--the-office-of-the-leader-of-the-house-of-commons {
20
- &.brand__border-color,
21
- .brand__border-color {
22
- border-color: govuk-organisation-colour("office-of-the-leader-of-the-house-of-commons", $contrast-safe: false);
23
- }
24
- }
25
- // colours for the prime ministers office are not included in the toolkit
26
- // so are written out here for our use
27
-
28
- .brand--prime-ministers-office-10-downing-street {
29
- .brand__color {
30
- color: govuk-colour("black");
31
-
32
- &:link,
33
- &:visited,
34
- &:active {
35
- color: govuk-colour("black");
36
- }
37
-
38
- &:hover,
39
- &:focus {
40
- color: $govuk-focus-text-colour;
41
- }
42
- }
43
-
44
- &.brand__border-color,
45
- .brand__border-color {
46
- border-color: govuk-colour("black");
47
- }
48
- }
49
-
50
- // in the toolkit, civil service has red for the text and borders
51
- // but the required border colour is black, ideally would fix this in
52
- // the toolkit but other things are using it
53
-
54
- .brand--civil-service {
55
- &.brand__border-color,
56
- .brand__border-color {
57
- border-color: govuk-colour("black");
58
- }
59
- }
60
-
61
- // Temp colour overrides
62
-
63
- .brand--department-for-science-innovation-and-technology {
64
- &.brand__border-color,
65
- .brand__border-color {
66
- border-color: govuk-organisation-colour("department-for-science-innovation-technology", $contrast-safe: false);
67
- }
68
- }
69
-
70
16
  .brand--government-digital-service {
71
17
  &.brand__border-color,
72
18
  .brand__border-color {
@@ -8,7 +8,7 @@
8
8
 
9
9
  breadcrumb_presenter = GovukPublishingComponents::Presenters::Breadcrumbs.new(breadcrumbs)
10
10
 
11
- classes = %w[gem-c-breadcrumbs govuk-breadcrumbs]
11
+ classes = %w[gem-c-breadcrumbs govuk-breadcrumbs govuk-!-display-none-print]
12
12
  classes << "govuk-breadcrumbs--collapse-on-mobile" if collapse_on_mobile
13
13
  classes << "govuk-breadcrumbs--inverse" if inverse
14
14
  classes << "gem-c-breadcrumbs--border-bottom" if border == "bottom"
@@ -13,11 +13,9 @@
13
13
  <% if breadcrumb_selector.step_by_step %>
14
14
  <%= render "govuk_publishing_components/components/step_by_step_nav_header", breadcrumb_selector.breadcrumbs %>
15
15
  <% elsif breadcrumb_selector.breadcrumbs %>
16
- <div class="govuk-!-display-none-print">
17
- <%= render "govuk_publishing_components/components/breadcrumbs",
18
- breadcrumbs: breadcrumb_selector.breadcrumbs,
19
- inverse: inverse,
20
- collapse_on_mobile: collapse_on_mobile %>
21
- </div>
16
+ <%= render "govuk_publishing_components/components/breadcrumbs",
17
+ breadcrumbs: breadcrumb_selector.breadcrumbs,
18
+ inverse: inverse,
19
+ collapse_on_mobile: collapse_on_mobile %>
22
20
  <% end %>
23
21
  <% end %>
@@ -7,6 +7,7 @@
7
7
  local_assigns[:margin_bottom] ||= 3
8
8
  theme ||= nil
9
9
  inverse ||= false
10
+ small ||= false
10
11
 
11
12
  unless disable_ga4
12
13
  ga4_event = {
@@ -25,6 +26,8 @@
25
26
  component_helper.add_class("gem-c-details govuk-details")
26
27
  component_helper.add_class("gem-c-details--black") if theme == "black"
27
28
  component_helper.add_class("gem-c-details--inverse") if inverse
29
+ component_helper.add_class("gem-c-details--small") if small
30
+ component_helper.add_class("direction-#{direction}") if local_assigns.include?(:direction)
28
31
  component_helper.add_data_attribute({ module: "ga4-event-tracker" }) unless disable_ga4
29
32
  component_helper.add_data_attribute({ ga4_event: ga4_event }) unless disable_ga4
30
33
  component_helper.set_open(open)
@@ -7,6 +7,9 @@
7
7
  part_of ||= []
8
8
  part_of = Array(part_of)
9
9
 
10
+ page_history ||= []
11
+ page_history = Array(page_history)
12
+
10
13
  other ||= nil
11
14
  inverse ||= false
12
15
  inverse_compress ||= false
@@ -15,6 +18,9 @@
15
18
  component_helper.add_class("gem-c-metadata")
16
19
  component_helper.add_class("direction-#{direction}") if local_assigns.include?(:direction)
17
20
 
21
+ component_helper.add_class("gem-c-metadata--history") if page_history.any?
22
+ component_helper.set_id("full-publication-update-history") if page_history.any?
23
+
18
24
  if inverse
19
25
  component_helper.add_class("gem-c-metadata--inverse")
20
26
  component_helper.add_class("gem-c-metadata--inverse-padded") unless inverse_compress
@@ -37,6 +43,8 @@
37
43
  inverse:,
38
44
  margin_bottom: 2,
39
45
  } %>
46
+ <% elsif page_history.any? %>
47
+ <h2 class="govuk-visually-hidden"><%= t("components.metadata.hidden_heading") %></h2>
40
48
  <% end %>
41
49
  <dl class="gem-c-metadata__list">
42
50
  <% if from.any? %>
@@ -56,12 +64,12 @@
56
64
  <dd class="gem-c-metadata__definition"><%= history %></dd>
57
65
  <% end %>
58
66
  <% if local_assigns.include?(:first_published) && first_published %>
59
- <dt class="gem-c-metadata__term"><%= t("components.metadata.published") %></dt>
67
+ <dt class="gem-c-metadata__term"><%= t("components.metadata.published") %>:</dt>
60
68
  <dd class="gem-c-metadata__definition"><%= first_published %></dd>
61
69
  <% end %>
62
70
  <% if local_assigns.include?(:last_updated) && last_updated %>
63
- <dt class="gem-c-metadata__term"><%= t("components.metadata.last_updated") %></dt>
64
- <dd class="gem-c-metadata__definition">
71
+ <dt class="gem-c-metadata__term"><%= t("components.metadata.last_updated") %>:</dt>
72
+ <dd class="gem-c-metadata__definition" data-module="gem-toggle">
65
73
  <%= last_updated %>
66
74
  <% if local_assigns.include?(:see_updates_link) %>
67
75
  &#8212; <a href="#full-publication-update-history"
@@ -69,6 +77,29 @@
69
77
  <%= t("components.metadata.see_all_updates") %>
70
78
  </a>
71
79
  <% end %>
80
+ <% if page_history.any? %>
81
+ <span aria-hidden="true">&#8212; </span>
82
+ <% page_history_toggle_id = "page-history-#{SecureRandom.hex(4)}" %>
83
+ <a
84
+ href="#full-history"
85
+ class="gem-c-metadata__toggle govuk-link"
86
+ data-controls="<%= page_history_toggle_id %>"
87
+ data-expanded="false"
88
+ data-toggled-text='<%= t("components.metadata.hide_all_updates", locale: :en) %>'
89
+ data-module="ga4-event-tracker"
90
+ data-ga4-event='<%= { event_name: "select_content", type: "content history", section: "Footer" }.to_json %>'
91
+ data-ga4-expandable>
92
+ <%= t("components.metadata.show_all_updates", locale: :en) %>
93
+ </a>
94
+ <ol class="gem-c-metadata__change-history js-hidden" id="<%= page_history_toggle_id %>">
95
+ <% page_history.each do |change| %>
96
+ <li>
97
+ <time class="gem-c-metadata__change-date timestamp" datetime="<%= change[:timestamp] %>"><%= change[:display_time] %></time>
98
+ <p class="gem-c-metadata__change-note"><%= change[:note].strip %></p>
99
+ </li>
100
+ <% end %>
101
+ </ol>
102
+ <% end %>
72
103
  </dd>
73
104
  <% end %>
74
105
  <% if other.present? %>
@@ -3,7 +3,6 @@
3
3
  description_text ||= false
4
4
  description_govspeak ||= false
5
5
  description ||= yield || false
6
- aria_live ||= false
7
6
  lang = local_assigns[:lang].presence
8
7
  local_assigns[:margin_bottom] ||= 8
9
8
  local_assigns[:margin_bottom] = 8 if local_assigns[:margin_bottom] > 9
@@ -17,7 +16,6 @@
17
16
  component_helper.add_class("govuk-notification-banner gem-c-notice")
18
17
 
19
18
  component_helper.add_aria_attribute({ label: "Notice" })
20
- component_helper.add_aria_attribute({ live: "polite" }) if aria_live
21
19
  component_helper.add_aria_attribute({ labelledby: banner_title_id }) if show_banner_title
22
20
 
23
21
  component_helper.set_lang(lang)
@@ -1,5 +1,4 @@
1
1
  <%
2
- app_name ||= nil
3
2
  phase ||= nil
4
3
  message ||= nil
5
4
  inverse ||= false
@@ -33,7 +32,6 @@ end
33
32
 
34
33
  <%= tag.div(**component_helper.all_attributes) do %>
35
34
  <%= tag.p class: "govuk-phase-banner__content" do %>
36
- <%= tag.strong app_name, class: "govuk-phase-banner__content__app-name" if app_name %>
37
35
  <%= tag.strong phase.titleize, class: "govuk-tag govuk-phase-banner__content__tag" if phase %>
38
36
  <%= tag.span message, class: "govuk-phase-banner__text" if message %>
39
37
  <% end %>
@@ -22,6 +22,12 @@ examples:
22
22
  title: Help with nationality
23
23
  block: |
24
24
  We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.
25
+ basic_rtl:
26
+ data:
27
+ direction: rtl
28
+ title: Help with nationality
29
+ block: |
30
+ We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.
25
31
  with_aria_attributes:
26
32
  description: |
27
33
  Aria attributes can be applied to the summary element of the component.
@@ -82,3 +88,9 @@ examples:
82
88
  inverse: true
83
89
  block: |
84
90
  We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post. <a href="#" class="govuk-link">Example link</a>
91
+ small:
92
+ data:
93
+ small: true
94
+ title: Help with nationality
95
+ block: |
96
+ We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.
@@ -348,6 +348,36 @@ examples:
348
348
  first_published: 14 June 2014
349
349
  other:
350
350
  Applies to: England, Scotland, and Wales (see detailed guidance for <a href="http://www.dardni.gov.uk/news-dard-pa022-a-13-new-procedure-for" rel="external">Northern Ireland</a>)
351
+ display_page_history:
352
+ description: |
353
+ This will set up an expandable section on the page, with a top border, to let users toggle the display of the page history. It also includes a hidden H2 heading of 'Updates to this page'. This heading will not be included if one is passed to the component using the `title` option.
354
+
355
+ This example includes an expandable 'part of' section to show both toggling elements working together in one component instance.
356
+ data:
357
+ part_of:
358
+ - <a href="/government/world/afghanistan">Afghanistan</a>
359
+ - <a href="/government/world/albania">Albania</a>
360
+ - <a href="/government/world/algeria">Algeria</a>
361
+ - <a href="/government/world/angola">Angola</a>
362
+ - <a href="/government/world/anguilla">Anguilla</a>
363
+ - <a href="/government/world/argentina">Argentina</a>
364
+ - <a href="/government/world/armenia">Armenia</a>
365
+ - <a href="/government/world/australia">Australia</a>
366
+ - <a href="/government/world/austria">Austria</a>
367
+ - <a href="/government/world/azerbaijan">Azerbaijan</a>
368
+ - <a href="/government/world/bahrain">Bahrain</a>
369
+ first_published: 1st January 1990
370
+ last_updated: 20th October 2016
371
+ page_history:
372
+ - display_time: 1st January 1990
373
+ note: First published
374
+ timestamp: 1990-01-01T15:42:37.000+00:00
375
+ - display_time: 20th July 1995
376
+ note: Updated to include information for 1994
377
+ timestamp: 1995-07-20T15:42:37.000+00:00
378
+ - display_time: 14th October 2000
379
+ note: Updated information on pupil premium reviews and what information schools need to publish on their websites.
380
+ timestamp: 2000-10-14T15:42:37.000+00:00
351
381
  with_title:
352
382
  data:
353
383
  last_updated: 10 September 2015
@@ -420,13 +450,6 @@ examples:
420
450
  Applies to: England, Scotland, and Wales (see detailed guidance for <a href="http://www.dardni.gov.uk/news-dard-pa022-a-13-new-procedure-for" rel="external">Northern Ireland</a>)
421
451
  context:
422
452
  dark_background: true
423
- with_custom_margin_bottom:
424
- description: |
425
- The component accepts a number for margin bottom from `0` to `9` (`0px` to `60px`) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to the `margin-bottom` values defined in the [responsive-bottom-margin mixin](https://github.com/alphagov/govuk_publishing_components/blob/main/app/assets/stylesheets/govuk_publishing_components/components/mixins/_margins.scss#L1)
426
- data:
427
- first_published: 14 June 2014
428
- last_updated: 10 September 2015
429
- margin_bottom: 2
430
453
  without_ga4_tracking:
431
454
  description: |
432
455
  Disables the GA4 link tracker on the 'See all updates' link. Tracking is enabled by default.
@@ -37,12 +37,6 @@ examples:
37
37
  without_title:
38
38
  data:
39
39
  description_govspeak: '<p>Scheduled to publish at 8am on 25 April 2019</p><ul><li><a href="change-date">Change date</a></li><li><a href="stop-scheduled-publishing">Stop scheduled publishing</a></li></ul>'
40
- with_aria_live:
41
- description: Passing the aria live flag to the notice component will read the notice out to users if the notice changes, e.g on form submission the notice may go from hidden to visible.
42
- data:
43
- title: 'Your settings have been saved'
44
- description_govspeak: <p>This is a confirmation message to tell you your settings have been saved</p>
45
- aria_live: true
46
40
  with_locale:
47
41
  description: |
48
42
  Passing a lang value allows the content of the notice to be labelled as being a different language from surrounding content.
@@ -99,7 +99,7 @@ examples:
99
99
  organisation:
100
100
  name: 'Office of the <br>Leader of the <br>House of Commons'
101
101
  url: '/government/organisations/the-office-of-the-leader-of-the-house-of-commons'
102
- brand: 'the-office-of-the-leader-of-the-house-of-commons'
102
+ brand: 'office-of-the-leader-of-the-house-of-commons'
103
103
  crest: 'portcullis'
104
104
  wales_office:
105
105
  data: