govuk_publishing_components 35.16.0 → 35.17.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 (106) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/images/govuk_publishing_components/action-link-arrow--light.png +0 -0
  3. data/app/assets/images/govuk_publishing_components/action-link-arrow--light.svg +7 -0
  4. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-core.js +2 -5
  5. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-page-views.js +19 -15
  6. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-video-tracker.js +7 -1
  7. data/app/assets/javascripts/govuk_publishing_components/components/option-select.js +9 -9
  8. data/app/assets/stylesheets/component_guide/application.scss +6 -6
  9. data/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss +33 -15
  10. data/app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss +3 -2
  11. data/app/assets/stylesheets/govuk_publishing_components/components/_breadcrumbs.scss +3 -3
  12. data/app/assets/stylesheets/govuk_publishing_components/components/_button.scss +2 -2
  13. data/app/assets/stylesheets/govuk_publishing_components/components/_cards.scss +5 -5
  14. data/app/assets/stylesheets/govuk_publishing_components/components/_contents-list.scss +1 -1
  15. data/app/assets/stylesheets/govuk_publishing_components/components/_contextual-sidebar.scss +1 -1
  16. data/app/assets/stylesheets/govuk_publishing_components/components/_document-list.scss +2 -2
  17. data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +5 -5
  18. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss +40 -35
  19. data/app/assets/stylesheets/govuk_publishing_components/components/_option-select.scss +1 -1
  20. data/app/assets/stylesheets/govuk_publishing_components/components/_search.scss +24 -5
  21. data/app/assets/stylesheets/govuk_publishing_components/components/_share-links.scss +5 -0
  22. data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss +23 -19
  23. data/app/assets/stylesheets/govuk_publishing_components/components/_table.scss +6 -6
  24. data/app/assets/stylesheets/govuk_publishing_components/components/_tabs.scss +2 -1
  25. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_steps.scss +3 -1
  26. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_typography.scss +4 -4
  27. data/app/assets/stylesheets/govuk_publishing_components/components/mixins/_media-down.scss +2 -2
  28. data/app/views/govuk_publishing_components/components/_action_link.html.erb +2 -0
  29. data/app/views/govuk_publishing_components/components/_attachment.html.erb +1 -1
  30. data/app/views/govuk_publishing_components/components/_contents_list.html.erb +20 -10
  31. data/app/views/govuk_publishing_components/components/_metadata.html.erb +1 -1
  32. data/app/views/govuk_publishing_components/components/_option_select.html.erb +3 -3
  33. data/app/views/govuk_publishing_components/components/_previous_and_next_navigation.html.erb +6 -6
  34. data/app/views/govuk_publishing_components/components/_search.html.erb +3 -0
  35. data/app/views/govuk_publishing_components/components/_share_links.html.erb +9 -9
  36. data/app/views/govuk_publishing_components/components/docs/action_link.yml +5 -0
  37. data/app/views/govuk_publishing_components/components/docs/contents_list.yml +1 -0
  38. data/app/views/govuk_publishing_components/components/docs/search.yml +11 -0
  39. data/config/locales/ar.yml +1 -0
  40. data/config/locales/az.yml +1 -0
  41. data/config/locales/be.yml +1 -0
  42. data/config/locales/bg.yml +1 -0
  43. data/config/locales/bn.yml +1 -0
  44. data/config/locales/cs.yml +1 -0
  45. data/config/locales/cy.yml +1 -0
  46. data/config/locales/da.yml +1 -0
  47. data/config/locales/de.yml +1 -0
  48. data/config/locales/dr.yml +1 -0
  49. data/config/locales/el.yml +1 -0
  50. data/config/locales/en.yml +2 -1
  51. data/config/locales/es-419.yml +1 -0
  52. data/config/locales/es.yml +1 -0
  53. data/config/locales/et.yml +1 -0
  54. data/config/locales/fa.yml +1 -0
  55. data/config/locales/fi.yml +1 -0
  56. data/config/locales/fr.yml +1 -0
  57. data/config/locales/gd.yml +1 -0
  58. data/config/locales/gu.yml +1 -0
  59. data/config/locales/he.yml +1 -0
  60. data/config/locales/hi.yml +1 -0
  61. data/config/locales/hr.yml +1 -0
  62. data/config/locales/hu.yml +1 -0
  63. data/config/locales/hy.yml +1 -0
  64. data/config/locales/id.yml +1 -0
  65. data/config/locales/is.yml +1 -0
  66. data/config/locales/it.yml +1 -0
  67. data/config/locales/ja.yml +1 -0
  68. data/config/locales/ka.yml +1 -0
  69. data/config/locales/kk.yml +1 -0
  70. data/config/locales/ko.yml +1 -0
  71. data/config/locales/lt.yml +1 -0
  72. data/config/locales/lv.yml +1 -0
  73. data/config/locales/ms.yml +1 -0
  74. data/config/locales/mt.yml +1 -0
  75. data/config/locales/nl.yml +1 -0
  76. data/config/locales/no.yml +1 -0
  77. data/config/locales/pa-pk.yml +1 -0
  78. data/config/locales/pa.yml +1 -0
  79. data/config/locales/pl.yml +1 -0
  80. data/config/locales/ps.yml +1 -0
  81. data/config/locales/pt.yml +1 -0
  82. data/config/locales/ro.yml +1 -0
  83. data/config/locales/ru.yml +1 -0
  84. data/config/locales/si.yml +1 -0
  85. data/config/locales/sk.yml +1 -0
  86. data/config/locales/sl.yml +1 -0
  87. data/config/locales/so.yml +1 -0
  88. data/config/locales/sq.yml +1 -0
  89. data/config/locales/sr.yml +1 -0
  90. data/config/locales/sv.yml +1 -0
  91. data/config/locales/sw.yml +1 -0
  92. data/config/locales/ta.yml +1 -0
  93. data/config/locales/th.yml +1 -0
  94. data/config/locales/tk.yml +1 -0
  95. data/config/locales/tr.yml +1 -0
  96. data/config/locales/uk.yml +1 -0
  97. data/config/locales/ur.yml +1 -0
  98. data/config/locales/uz.yml +1 -0
  99. data/config/locales/vi.yml +1 -0
  100. data/config/locales/zh-hk.yml +1 -0
  101. data/config/locales/zh-tw.yml +1 -0
  102. data/config/locales/zh.yml +1 -0
  103. data/lib/govuk_publishing_components/presenters/contents_list_helper.rb +8 -0
  104. data/lib/govuk_publishing_components/presenters/meta_tags.rb +3 -0
  105. data/lib/govuk_publishing_components/version.rb +1 -1
  106. metadata +5 -3
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: d631949b7bdb6aa90aff397986118f929cbae4071ef96b3a623c123c6496224d
4
- data.tar.gz: ef75a103619c27bc964664673a17475579132d0b909e254fce0afcc6316256d9
3
+ metadata.gz: b2ae98a5a0bfe9237ad8666586cf56d55c5f737e03cac016826b577ad6b280e0
4
+ data.tar.gz: 66a94a3ef052fff63ba972df2ad0b39bf48220a42308c1d5bb06ba5343dbf621
5
5
  SHA512:
6
- metadata.gz: '01786b90a26218b6b5dff054852d4e67a77f36d307029ff6fd03f8b15cd005e9264f8719a03f78f05dc776f284c24c972eb6101940e8afd41a44a696c3b404f5'
7
- data.tar.gz: 775eb1304962e2349b3e19c8ce7acfb92dc927443a7a01253692909c174f6b5e196129d40104f773794b2ac8e1674e0c65361e605808910f01163b9d69ad5f6a
6
+ metadata.gz: 0e20d31b9ece60b5bda9387d1b87396dd4089fe10c6c808db6b11201988f7d07e2f23befc0d77a37f7842eda137edf9a200e963766b6971bcea707bfa9300e22
7
+ data.tar.gz: a4e27aeecf3c73c9a105fbe4e307aedc6acd1e489349c917b8341b51f42b5b7bd2d6cab2e6b6ae3f864fdf5da69fa4db68ed1023db15cf73c0910521ff3e2f9a
@@ -0,0 +1,7 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="27" height="27" viewBox="0 0 27 27" fill="none">
2
+ <circle cx="13.5" cy="13.5" r="13.5" fill="#EEEFEF"/>
3
+ <g transform="translate(5 3.5) scale(0.85)">
4
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M14.9429 11.7949L10.4402 7.29222L11.7327 5.99967L17.528 11.7949L11.7327 17.5902L10.4402 16.2976L14.9429 11.7949Z" fill="#000000"/>
5
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M3.95631 10.881L15.4414 10.881L15.4414 12.709L3.95631 12.709L3.95631 10.881Z" fill="#000000"/>
6
+ </g>
7
+ </svg>
@@ -288,11 +288,8 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
288
288
  return null
289
289
  }
290
290
 
291
- // In order to extract the number of results from resultCount (which is a string at this point (e.g. '12,345 results')), we remove the comma and
292
- // split string at the space character so it can be parsed as an integer
293
- resultCount = window.GOVUK.analyticsGa4.core.trackFunctions.removeLinesAndExtraSpaces(resultCount.textContent)
294
- resultCount = resultCount.replace(',', '')
295
- resultCount = resultCount.split(' ')[0]
291
+ // Remove anything that isn't a number from the result count heading. E.g. 'Results:' or the comma in '1,234'
292
+ resultCount = resultCount.textContent.replace(/[^0-9]+/g, '')
296
293
 
297
294
  return parseInt(resultCount)
298
295
  },
@@ -28,7 +28,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
28
28
  schema_name: this.getMetaContent('schema-name'),
29
29
  content_id: this.getMetaContent('content-id'),
30
30
 
31
- browse_topic: this.getMetaContent('section'),
31
+ browse_topic: this.getMetaContent('ga4-browse-topic'),
32
32
  navigation_page_type: this.getMetaContent('navigation-page-type'),
33
33
  navigation_list_type: this.getMetaContent('navigation-list-type'),
34
34
  step_navs: this.getMetaContent('stepnavs'),
@@ -57,10 +57,11 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
57
57
  emergency_banner: document.querySelector('[data-ga4-emergency-banner]') ? 'true' : undefined,
58
58
  phase_banner: this.getElementAttribute('data-ga4-phase-banner') || undefined,
59
59
  devolved_nations_banner: this.getElementAttribute('data-ga4-devolved-nations-banner') || undefined,
60
- cookie_banner: document.querySelector('[data-ga4-cookie-banner]') ? 'true' : undefined,
61
- intervention: this.getInterventionPresence(),
60
+ cookie_banner: this.getBannerPresence('[data-ga4-cookie-banner]'),
61
+ intervention: this.getBannerPresence('[data-ga4-intervention-banner]'),
62
62
  query_string: this.getQueryString(),
63
- search_term: this.getSearchTerm()
63
+ search_term: this.getSearchTerm(),
64
+ spelling_suggestion: this.getMetaContent('spelling-suggestion')
64
65
  }
65
66
  }
66
67
  window.GOVUK.analyticsGa4.core.sendData(data)
@@ -68,7 +69,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
68
69
  },
69
70
 
70
71
  getLocation: function () {
71
- return this.PIIRemover.stripPII(this.stripGaParam(document.location.href))
72
+ return this.PIIRemover.stripPIIWithOverride(this.stripGaParam(document.location.href), true, true)
72
73
  },
73
74
 
74
75
  getSearch: function () {
@@ -95,8 +96,8 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
95
96
  getQueryString: function () {
96
97
  var queryString = this.getSearch()
97
98
  if (queryString) {
98
- queryString = this.PIIRemover.stripPIIWithOverride(queryString, true, true)
99
99
  queryString = this.stripGaParam(queryString)
100
+ queryString = this.PIIRemover.stripPIIWithOverride(queryString, true, true)
100
101
  queryString = queryString.substring(1) // removes the '?' character from the start.
101
102
  return queryString
102
103
  }
@@ -115,7 +116,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
115
116
  },
116
117
 
117
118
  getTitle: function () {
118
- return this.PIIRemover.stripPII(document.title)
119
+ return this.PIIRemover.stripPIIWithOverride(document.title, true, true)
119
120
  },
120
121
 
121
122
  // window.httpStatusCode is set in the source of the error page in static
@@ -148,7 +149,10 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
148
149
  var content = document.getElementById('content')
149
150
  var html = document.querySelector('html')
150
151
  if (content) {
151
- return content.getAttribute('lang') || this.nullValue
152
+ var contentLanguage = content.getAttribute('lang')
153
+ if (contentLanguage) {
154
+ return contentLanguage
155
+ }
152
156
  }
153
157
  // html.getAttribute('lang') is untested - Jasmine would not allow lang to be set on <html>.
154
158
  return html.getAttribute('lang') || this.nullValue
@@ -164,18 +168,18 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
164
168
  return (withdrawn === 'withdrawn') ? 'true' : 'false'
165
169
  },
166
170
 
167
- getInterventionPresence: function () {
171
+ getBannerPresence: function (bannerSelector) {
168
172
  /* If the user hides the banner using JS, a cookie is set to hide it on future page loads.
169
- * Therefore we need to start the intervention banner early so that it hides if this cookie exists.
173
+ * Therefore we need to start the banner module early so that it hides if this cookie exists.
170
174
  * Without this, our pageview object will track the banner as visible before it gets hidden. */
171
175
 
172
- var intervention = document.querySelector('[data-ga4-intervention-banner]')
176
+ var banner = document.querySelector(bannerSelector)
173
177
 
174
- if (intervention) {
175
- window.GOVUK.modules.start(intervention)
176
- var interventionHidden = intervention.getAttribute('hidden') === '' || intervention.getAttribute('hidden')
178
+ if (banner) {
179
+ window.GOVUK.modules.start(banner)
180
+ var bannerHidden = banner.getAttribute('hidden') === '' || banner.getAttribute('hidden')
177
181
 
178
- if (interventionHidden) {
182
+ if (bannerHidden) {
179
183
  return undefined
180
184
  }
181
185
  return 'true'
@@ -70,7 +70,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
70
70
  var data = {}
71
71
  data.event_name = 'video_' + event
72
72
  data.type = 'video'
73
- data.url = player.getVideoUrl()
73
+ data.url = this.cleanVideoUrl(player.getVideoUrl())
74
74
  data.text = player.videoTitle
75
75
  data.action = event
76
76
  data.video_current_time = Math.round(player.getCurrentTime())
@@ -81,6 +81,12 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
81
81
  var schema = schemas.mergeProperties(data, 'event_data')
82
82
 
83
83
  window.GOVUK.analyticsGa4.core.sendData(schema)
84
+ },
85
+
86
+ cleanVideoUrl: function (url) {
87
+ url = url.replace(/[?]{1}t=[0-9]+[&]{1}/, '?') // replace ?t=123& with ?
88
+ url = url.replace(/[&]{1}t=[0-9]+/, '') // replace &t=123 with ''
89
+ return url
84
90
  }
85
91
  }
86
92
 
@@ -268,32 +268,32 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
268
268
  return visibleCheckboxes
269
269
  }
270
270
 
271
- OptionSelect.prototype.isFacetsContainerHidden = function isFacetsContainerHidden () {
272
- var facetsContent = this.$optionSelect.parentElement
273
- var isFacetsContentHidden = false
271
+ OptionSelect.prototype.isComponentParentHidden = function isComponentParentHidden () {
272
+ var parentContent = this.$optionSelect.parentElement
273
+ var isparentContentHidden = false
274
274
  // check whether this is hidden by progressive disclosure,
275
275
  // because height calculations won't work
276
276
  // would use offsetParent === null but for IE10+
277
- if (facetsContent) {
278
- isFacetsContentHidden = !(facetsContent.offsetWidth || facetsContent.offsetHeight || facetsContent.getClientRects().length)
277
+ if (parentContent) {
278
+ isparentContentHidden = !(parentContent.offsetWidth || parentContent.offsetHeight || parentContent.getClientRects().length)
279
279
  }
280
280
 
281
- return isFacetsContentHidden
281
+ return isparentContentHidden
282
282
  }
283
283
 
284
284
  OptionSelect.prototype.setupHeight = function setupHeight () {
285
285
  var initialOptionContainerHeight = this.$optionsContainer.clientHeight
286
286
  var height = this.$optionList.offsetHeight
287
287
 
288
- var isFacetsContainerHidden = this.isFacetsContainerHidden()
288
+ var isComponentParentHidden = this.isComponentParentHidden()
289
289
 
290
- if (isFacetsContainerHidden) {
290
+ if (isComponentParentHidden) {
291
291
  initialOptionContainerHeight = 200
292
292
  height = 200
293
293
  }
294
294
 
295
295
  // Resize if the list is only slightly bigger than its container
296
- // If isFacetsContainerHidden is true, then 200 < 250
296
+ // If isComponentParentHidden is true, then 200 < 250
297
297
  // And the container height is always set to 201px
298
298
  if (height < initialOptionContainerHeight + 50) {
299
299
  this.setContainerHeight(height + 1)
@@ -145,7 +145,7 @@ $gem-guide-border-width: 1px;
145
145
  border: 0;
146
146
  padding: govuk-spacing(2);
147
147
 
148
- &:before {
148
+ &::before {
149
149
  display: none;
150
150
  }
151
151
  }
@@ -187,7 +187,7 @@ $gem-guide-border-width: 1px;
187
187
  font-style: italic;
188
188
  }
189
189
 
190
- &:before {
190
+ &::before {
191
191
  @include govuk-font($size: 14);
192
192
  content: attr(data-content);
193
193
  position: absolute;
@@ -201,7 +201,7 @@ $gem-guide-border-width: 1px;
201
201
  .component-guide-preview--warning {
202
202
  border-color: govuk-colour("yellow");
203
203
 
204
- &:before {
204
+ &::before {
205
205
  background-color: govuk-colour("yellow");
206
206
  }
207
207
  }
@@ -209,7 +209,7 @@ $gem-guide-border-width: 1px;
209
209
  .component-guide-preview--violation {
210
210
  border-color: govuk-colour("red");
211
211
 
212
- &:before {
212
+ &::before {
213
213
  background-color: govuk-colour("red");
214
214
  color: govuk-colour("white");
215
215
  }
@@ -516,11 +516,11 @@ $code-delete-bg: #fadddd;
516
516
  }
517
517
 
518
518
  .component__count {
519
- &:before {
519
+ &::before {
520
520
  content: "(";
521
521
  }
522
522
 
523
- &:after {
523
+ &::after {
524
524
  content: ")";
525
525
  }
526
526
  }
@@ -3,7 +3,7 @@
3
3
  .gem-c-action-link {
4
4
  display: table;
5
5
 
6
- &:before {
6
+ &::before {
7
7
  content: "";
8
8
  display: table-cell;
9
9
  width: 60px;
@@ -66,7 +66,7 @@
66
66
  .gem-c-action-link__subtext {
67
67
  padding: 0;
68
68
 
69
- &:before {
69
+ &::before {
70
70
  display: none;
71
71
  }
72
72
  }
@@ -82,7 +82,7 @@
82
82
  position: relative;
83
83
  padding-left: govuk-spacing(4);
84
84
 
85
- &:before {
85
+ &::before {
86
86
  content: "";
87
87
  position: absolute;
88
88
  top: 10%;
@@ -95,14 +95,14 @@
95
95
  }
96
96
 
97
97
  .gem-c-action-link--white-arrow {
98
- &:before {
98
+ &::before {
99
99
  background-image: image-url("govuk_publishing_components/action-link-arrow--white.png");
100
100
  background-image: image-url("govuk_publishing_components/action-link-arrow--white.svg"), linear-gradient(transparent, transparent);
101
101
  }
102
102
  }
103
103
 
104
104
  .gem-c-action-link--blue-arrow {
105
- &:before {
105
+ &::before {
106
106
  width: 36px;
107
107
  height: 28px;
108
108
  background: image-url("govuk_publishing_components/action-link-arrow--blue.png");
@@ -120,7 +120,7 @@
120
120
  }
121
121
 
122
122
  .gem-c-action-link--simple {
123
- &:before {
123
+ &::before {
124
124
  width: 30px;
125
125
  height: 30px;
126
126
  background: image-url("govuk_publishing_components/action-link-arrow--simple.png");
@@ -132,7 +132,7 @@
132
132
  }
133
133
 
134
134
  .gem-c-action-link--simple-light {
135
- &:before {
135
+ &::before {
136
136
  width: 30px;
137
137
  height: 30px;
138
138
  background: image-url("govuk_publishing_components/action-link-arrow--simple-light.png");
@@ -144,14 +144,14 @@
144
144
  }
145
145
 
146
146
  .gem-c-action-link--dark-icon {
147
- &:before {
147
+ &::before {
148
148
  background: image-url("govuk_publishing_components/action-link-arrow--dark.png");
149
149
  background: image-url("govuk_publishing_components/action-link-arrow--dark.svg"), linear-gradient(transparent, transparent);
150
150
  }
151
151
  }
152
152
 
153
153
  .gem-c-action-link--dark-large-icon {
154
- &:before {
154
+ &::before {
155
155
  background: image-url("govuk_publishing_components/action-link-arrow--dark.png");
156
156
  background: image-url("govuk_publishing_components/action-link-arrow--dark.svg"), linear-gradient(transparent, transparent);
157
157
  height: 34px;
@@ -166,6 +166,24 @@
166
166
  }
167
167
  }
168
168
 
169
+ .gem-c-action-link--light-icon {
170
+ &::before {
171
+ width: 36px;
172
+ height: 28px;
173
+ background: image-url("govuk_publishing_components/action-link-arrow--light.png");
174
+ background: image-url("govuk_publishing_components/action-link-arrow--light.svg"), linear-gradient(transparent, transparent);
175
+ background-repeat: no-repeat;
176
+ background-size: 28px auto;
177
+ background-position: 0 0;
178
+
179
+ @include govuk-media-query($from: tablet) {
180
+ width: 45px;
181
+ height: 35px;
182
+ background-size: 35px auto;
183
+ }
184
+ }
185
+ }
186
+
169
187
  .gem-c-action-link--dark-icon,
170
188
  .gem-c-action-link--small-icon {
171
189
  max-width: none;
@@ -174,7 +192,7 @@
174
192
  margin-bottom: govuk-spacing(2);
175
193
  }
176
194
 
177
- &:before {
195
+ &::before {
178
196
  height: 30px;
179
197
  width: 35px;
180
198
  background-repeat: no-repeat;
@@ -184,7 +202,7 @@
184
202
  }
185
203
 
186
204
  .gem-c-action-link--transparent-icon {
187
- &:before {
205
+ &::before {
188
206
  background-image: image-url("govuk_publishing_components/action-link-arrow--transparent.svg");
189
207
  }
190
208
  }
@@ -192,7 +210,7 @@
192
210
  .gem-c-action-link--brexit {
193
211
  max-width: none;
194
212
 
195
- &:before {
213
+ &::before {
196
214
  height: 30px;
197
215
  width: 30px;
198
216
  background-image: image-url("govuk_publishing_components/action-link-arrow--brexit.svg");
@@ -208,7 +226,7 @@
208
226
  @include govuk-media-query($from: tablet) {
209
227
  margin-bottom: govuk-spacing(2);
210
228
 
211
- &:before {
229
+ &::before {
212
230
  width: 35px;
213
231
  background-position: 0 4px;
214
232
  background-size: 25px auto;
@@ -217,7 +235,7 @@
217
235
  }
218
236
 
219
237
  .gem-c-action-link--nhs {
220
- &:before {
238
+ &::before {
221
239
  width: 80px;
222
240
  height: 70px;
223
241
  background: image-url("govuk_publishing_components/action-link--nhs.png");
@@ -232,7 +250,7 @@
232
250
  color: govuk-colour("white");
233
251
 
234
252
  .gem-c-action-link__subtext {
235
- &:before {
253
+ &::before {
236
254
  border-color: govuk-colour("white");
237
255
  }
238
256
  }
@@ -16,8 +16,9 @@
16
16
  @include govuk-font($size: 19, $weight: bold);
17
17
 
18
18
  // This pseudo element is to bypass an issue with NVDA where block level elements are dictated separately.
19
- // What's happening here is that the label and the number technically have an inline relationship but appear to have a block relationship thanks to this element
20
- &:before {
19
+ // What's happening here is that the label and the number technically have an inline relationship
20
+ // but appear to have a block relationship thanks to this element
21
+ &::before {
21
22
  content: "";
22
23
  display: block;
23
24
  }
@@ -18,7 +18,7 @@
18
18
  color: govuk-colour("white");
19
19
  }
20
20
 
21
- .gem-c-breadcrumbs--inverse .govuk-breadcrumbs__list-item:before {
21
+ .gem-c-breadcrumbs--inverse .govuk-breadcrumbs__list-item::before {
22
22
  border-color: govuk-colour("white");
23
23
  }
24
24
 
@@ -40,11 +40,11 @@
40
40
  padding-bottom: 14px;
41
41
  }
42
42
 
43
- .govuk-breadcrumbs__list-item:before {
43
+ .govuk-breadcrumbs__list-item::before {
44
44
  top: 18px;
45
45
  }
46
46
 
47
- .govuk-breadcrumbs__link:after {
47
+ .govuk-breadcrumbs__link::after {
48
48
  content: "";
49
49
  position: absolute;
50
50
  top: 0;
@@ -65,7 +65,7 @@
65
65
  text-decoration: none;
66
66
  }
67
67
 
68
- &:before {
68
+ &::before {
69
69
  content: none;
70
70
  }
71
71
  }
@@ -97,7 +97,7 @@
97
97
  text-decoration: none;
98
98
  }
99
99
 
100
- &:before {
100
+ &::before {
101
101
  content: none;
102
102
  }
103
103
  }
@@ -65,7 +65,7 @@
65
65
 
66
66
  .gem-c-cards__link {
67
67
  // Make the entire list item area clickable
68
- &:after {
68
+ &::after {
69
69
  bottom: 0;
70
70
  content: "";
71
71
  left: 0;
@@ -74,7 +74,7 @@
74
74
  top: 0;
75
75
  }
76
76
 
77
- &:before {
77
+ &::before {
78
78
  $dimension: 7px;
79
79
  $width: 3px;
80
80
 
@@ -90,13 +90,13 @@
90
90
  }
91
91
 
92
92
  &:hover {
93
- &:before {
93
+ &::before {
94
94
  border-color: $govuk-link-hover-colour;
95
95
  }
96
96
  }
97
97
 
98
98
  &:focus {
99
- &:before {
99
+ &::before {
100
100
  border-color: $govuk-focus-text-colour;
101
101
  }
102
102
  }
@@ -120,7 +120,7 @@
120
120
  margin-bottom: govuk-spacing(1);
121
121
  }
122
122
 
123
- .gem-c-cards__link:before {
123
+ .gem-c-cards__link::before {
124
124
  display: none;
125
125
  }
126
126
  }
@@ -50,7 +50,7 @@
50
50
  padding-left: $contents-spacing;
51
51
  padding-right: $contents-spacing;
52
52
 
53
- &:before {
53
+ &::before {
54
54
  content: "—";
55
55
  position: absolute;
56
56
  left: 0;
@@ -37,7 +37,7 @@
37
37
  border-top: 7px solid #fed700;
38
38
  position: relative;
39
39
 
40
- &:before {
40
+ &::before {
41
41
  content: "";
42
42
  position: absolute;
43
43
  left: 0;
@@ -135,7 +135,7 @@
135
135
  padding-left: govuk-spacing(5);
136
136
  padding-top: govuk-spacing(2);
137
137
 
138
- &:before {
138
+ &::before {
139
139
  content: "—";
140
140
  position: absolute;
141
141
  left: 0;
@@ -146,7 +146,7 @@
146
146
  padding: 0;
147
147
  padding-bottom: govuk-spacing(2);
148
148
 
149
- &:before {
149
+ &::before {
150
150
  display: none;
151
151
  }
152
152
  }
@@ -103,7 +103,7 @@
103
103
  // the after element extends the link to cover the image, removing the
104
104
  // need for a duplicate link. Other elements apart from the image are given
105
105
  // position relative and a higher z-index to put them above the after element
106
- &:after {
106
+ &::after {
107
107
  content: "";
108
108
  position: absolute;
109
109
  z-index: 1;
@@ -117,7 +117,7 @@
117
117
  }
118
118
 
119
119
  @include govuk-media-query($from: mobile, $until: tablet) {
120
- &:after {
120
+ &::after {
121
121
  left: govuk-spacing(3);
122
122
  right: govuk-spacing(3);
123
123
  }
@@ -176,7 +176,7 @@
176
176
  .gem-c-image-card__list-item {
177
177
  position: relative;
178
178
 
179
- &:before { // stylelint-disable-line max-nesting-depth
179
+ &::before { // stylelint-disable-line max-nesting-depth
180
180
  content: "-";
181
181
  position: absolute;
182
182
  left: (- govuk-spacing(3));
@@ -226,7 +226,7 @@
226
226
  padding-bottom: govuk-spacing(2);
227
227
  }
228
228
 
229
- .gem-c-image-card__title-link:after {
229
+ .gem-c-image-card__title-link::after {
230
230
  left: 0;
231
231
  right: 0;
232
232
  }
@@ -289,7 +289,7 @@
289
289
  .gem-c-image-card__youtube-thumbnail-image-container {
290
290
  position: relative;
291
291
 
292
- &:before {
292
+ &::before {
293
293
  background: url("govuk_publishing_components/youtube-play-icon.png");
294
294
  background: url("govuk_publishing_components/youtube-play-icon.svg"), linear-gradient(transparent, transparent);
295
295
  background-repeat: no-repeat;