govuk_publishing_components 34.3.0 → 34.4.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (29) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/images/govuk_publishing_components/youtube-play-icon.png +0 -0
  3. data/app/assets/images/govuk_publishing_components/youtube-play-icon.svg +4 -0
  4. data/app/assets/javascripts/govuk_publishing_components/analytics/linked-domains.js +135 -0
  5. data/app/assets/javascripts/govuk_publishing_components/components/image-card.js +19 -0
  6. data/app/assets/javascripts/govuk_publishing_components/dependencies.js +11 -0
  7. data/app/assets/javascripts/govuk_publishing_components/lib/govspeak/youtube-link-enhancement.js +3 -2
  8. data/app/assets/javascripts/govuk_publishing_components/load-analytics.js +113 -0
  9. data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +81 -0
  10. data/app/views/govuk_publishing_components/components/_contextual_footer.html.erb +2 -0
  11. data/app/views/govuk_publishing_components/components/_contextual_sidebar.html.erb +7 -3
  12. data/app/views/govuk_publishing_components/components/_image_card.html.erb +12 -9
  13. data/app/views/govuk_publishing_components/components/_layout_for_public.html.erb +4 -0
  14. data/app/views/govuk_publishing_components/components/_related_navigation.html.erb +12 -6
  15. data/app/views/govuk_publishing_components/components/docs/contextual_footer.yml +43 -0
  16. data/app/views/govuk_publishing_components/components/docs/contextual_sidebar.yml +58 -0
  17. data/app/views/govuk_publishing_components/components/docs/emergency_banner.yml +3 -1
  18. data/app/views/govuk_publishing_components/components/docs/image_card.yml +24 -1
  19. data/app/views/govuk_publishing_components/components/docs/intervention.yml +2 -1
  20. data/app/views/govuk_publishing_components/components/docs/layout_header.yml +1 -0
  21. data/app/views/govuk_publishing_components/components/docs/previous_and_next_navigation.yml +2 -0
  22. data/app/views/govuk_publishing_components/components/docs/related_navigation.yml +27 -0
  23. data/app/views/govuk_publishing_components/components/docs/translation_nav.yml +2 -0
  24. data/app/views/govuk_publishing_components/components/related_navigation/_section.html.erb +14 -4
  25. data/lib/govuk_publishing_components/presenters/image_card_helper.rb +65 -2
  26. data/lib/govuk_publishing_components/presenters/page_with_step_by_step_navigation.rb +1 -1
  27. data/lib/govuk_publishing_components/presenters/related_navigation_helper.rb +4 -0
  28. data/lib/govuk_publishing_components/version.rb +1 -1
  29. metadata +7 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 54771399098f08d7e3116e65b9c98eaa7036d1214eebc3e7a5c086083ad4c2c1
4
- data.tar.gz: 362003c9ad5faea353aa8a47aa5a1f94dbe8f60074be83176af996fb5583f58d
3
+ metadata.gz: 0d63109c1078fd71c2a1cd25da18616f1209fa78ce12fe896b201113f7c054f0
4
+ data.tar.gz: 29f71838f9ddaaf85f77d9968b3c2df7724453df3c7d8e36c35c69c66417bc45
5
5
  SHA512:
6
- metadata.gz: c735097c6bd48644ddde9390b4484ee4b66c3742883e8fa8b3d3ab98793a937e62f240335c835f052fdc28876bc4e063a8a7311aa0ccc15267ff872a1b1eed8e
7
- data.tar.gz: e852b2021cd42f28bde7905896931be1443aaec8bef0ffcee808fcf4836429181f4985a13c3a28920df8b6c424d12c6408964ff72c6213e5e5c96e0c3103211e
6
+ metadata.gz: 69da39ed74e321310cb7f4ac557fe3894e93f94a3d86709143540537d69f25822bea82f2c5d13dc792f72b1690592bbf974be4f306d4ee3cf8017b36378034d5
7
+ data.tar.gz: de2fae5d728300c3be7c19528206e4c92eb8aefda3882672e3c76cd4f75b3c696897a08160a23ecc339a8d05ee7b8a854e146530466091f6478992da38da4eed
@@ -0,0 +1,4 @@
1
+ <svg width="79" height="55" viewBox="0 0 79 55" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M39.7503 0H40.1861C44.2104 0.014681 64.6016 0.161492 70.0996 1.63938C71.7617 2.09042 73.2763 2.96959 74.492 4.18902C75.7076 5.40846 76.5818 6.92545 77.0272 8.5884C77.5217 10.448 77.8693 12.9095 78.1043 15.4493L78.1533 15.9583L78.261 17.2306L78.3001 17.7396C78.6184 22.2124 78.6575 26.4014 78.6624 27.3165V27.6835C78.6575 28.6329 78.6135 33.1057 78.261 37.7645L78.2218 38.2783L78.1777 38.7873C77.9329 41.5864 77.5706 44.366 77.0272 46.4116C76.5832 48.0752 75.7094 49.5929 74.4936 50.8126C73.2777 52.0322 71.7624 52.9109 70.0996 53.3606C64.4204 54.8874 42.8347 54.9951 39.8434 55H39.1481C37.6353 55 31.3785 54.9706 24.818 54.7455L23.9858 54.7162L23.5598 54.6966L22.7226 54.6623L21.8854 54.6281C16.4511 54.3883 11.2762 54.0017 8.8919 53.3557C7.22972 52.9065 5.71482 52.0285 4.49899 50.8097C3.28315 49.591 2.40907 48.0743 1.9643 46.4116C1.42086 44.3709 1.05857 41.5864 0.813776 38.7873L0.774609 38.2734L0.735443 37.7645C0.493822 34.4485 0.359932 31.1256 0.333984 27.801L0.333984 27.199C0.343776 26.1469 0.382943 22.5109 0.647318 18.4981L0.681589 17.994L0.696276 17.7396L0.735443 17.2306L0.843151 15.9583L0.892109 15.4493C1.12711 12.9095 1.47471 10.4431 1.96919 8.5884C2.41321 6.92478 3.28697 5.40707 4.50285 4.18743C5.71874 2.96779 7.23402 2.08907 8.8968 1.63938C11.2811 1.0032 16.456 0.611709 21.8903 0.367025L22.7226 0.33277L23.5647 0.303409L23.9858 0.288727L24.8229 0.254472C29.4823 0.104601 34.1437 0.0213994 38.8054 0.0048939H39.7503V0ZM31.6673 15.7087V39.2864L52.0193 27.5024L31.6673 15.7087Z" fill="#EA3323"/>
3
+ <path d="M31.668 15.7087V39.2865L52.0199 27.5025L31.668 15.7087Z" fill="white"/>
4
+ </svg>
@@ -0,0 +1,135 @@
1
+ // For Universal Analytics' cross domain tracking.
2
+ window.GOVUK.analytics = window.GOVUK.analytics || {}
3
+ window.GOVUK.analytics.linkedDomains = [
4
+ 'access.service.gov.uk',
5
+ 'access.tax.service.gov.uk',
6
+ 'account.companieshouse.gov.uk',
7
+ 'accounts.manage-apprenticeships.service.gov.uk',
8
+ 'account.publishing.service.gov.uk',
9
+ 'add-driving-licence-check-code.service.gov.uk',
10
+ 'analyse-school-performance.service.gov.uk',
11
+ 'appeal-tax-tribunal.service.gov.uk',
12
+ 'apply-basic-criminal-record-check.service.gov.uk',
13
+ 'apply-blue-badge.service.gov.uk',
14
+ 'apply-company-tachograph-card.service.gov.uk',
15
+ 'apply-for-bankruptcy.service.gov.uk',
16
+ 'apply-for-debt-relief-order.service.gov.uk',
17
+ 'apply-for-environmental-permit.service.gov.uk',
18
+ 'apply-for-eu-settled-status.homeoffice.gov.uk',
19
+ 'apply-for-innovation-funding.service.gov.uk',
20
+ 'apply-for-refugee-integration-loan.service.gov.uk',
21
+ 'apply-licence.ozone-depleting-substances.service.gov.uk',
22
+ 'apply-quota.fluorinated-gas.service.gov.uk',
23
+ 'apply-quota.ozone-depleting-substances.service.gov.uk',
24
+ 'apprenticeships.gov.uk',
25
+ 'beta.companieshouse.gov.uk',
26
+ 'biometric-residence-permit.service.gov.uk',
27
+ 'businessreadinessfund.beis.gov.uk',
28
+ 'catchreturn.service.gov.uk',
29
+ 'checklegalaid.service.gov.uk',
30
+ 'check-mot.service.gov.uk',
31
+ 'check-payment-practices.service.gov.uk',
32
+ 'check-vehicle-recalls.service.gov.uk',
33
+ 'civil-service-careers.gov.uk',
34
+ 'civilservicejobs.service.gov.uk',
35
+ 'claim.redundancy-payments.service.gov.uk',
36
+ 'claim-power-of-attorney-refund.service.gov.uk',
37
+ 'compare-school-performance.service.gov.uk',
38
+ 'complete-deputy-report.service.gov.uk',
39
+ 'contractsfinder.service.gov.uk',
40
+ 'coronavirus.data.gov.uk',
41
+ 'coronavirus-business-volunteers.service.gov.uk',
42
+ 'coronavirus-shielding-support.service.gov.uk',
43
+ 'coronavirus-vulnerable-people.service.gov.uk',
44
+ 'courttribunalfinder.service.gov.uk',
45
+ 'create-energy-label.service.gov.uk',
46
+ 'create-qr-code-poster.service.gov.uk',
47
+ 'cymraeg.registertovote.service.gov.uk',
48
+ 'dartford-crossing-charge.service.gov.uk',
49
+ 'design-system.service.gov.uk',
50
+ 'devtracker.dfid.gov.uk',
51
+ 'digitalmarketplace.service.gov.uk',
52
+ 'eforms.homeoffice.gov.uk',
53
+ 'electronic-visa-waiver.service.gov.uk',
54
+ 'employmenttribunals.service.gov.uk',
55
+ 'eu-settled-status-enquiries.service.gov.uk',
56
+ 'faster-uk-entry.service.gov.uk',
57
+ 'finance.manage-apprenticeships.service.gov.uk',
58
+ 'find-and-update.company-information.service.gov.uk',
59
+ 'findapprenticeship.service.gov.uk',
60
+ 'find-coronavirus-support.service.gov.uk',
61
+ 'find-employer-schemes.education.gov.uk',
62
+ 'flood-map-for-planning.service.gov.uk',
63
+ 'flood-warning-information.service.gov.uk',
64
+ 'follow.company-information.service.gov.uk',
65
+ 'gender-pay-gap.service.gov.uk',
66
+ 'get-fishing-licence.service.gov.uk',
67
+ 'get-information-schools.service.gov.uk',
68
+ 'gro.gov.uk',
69
+ 'helpforhouseholds.campaign.gov.uk',
70
+ 'helpwithcourtfees.service.gov.uk',
71
+ 'help-with-prison-visits.service.gov.uk',
72
+ 'identity.company-information.service.gov.uk',
73
+ 'identity-sandbox.company-information.service.gov.uk',
74
+ 'import-products-animals-food-feed.service.gov.uk',
75
+ 'lastingpowerofattorney.service.gov.uk',
76
+ 'live.email-dvla.service.gov.uk',
77
+ 'live.dvla-web-chat.service.gov.uk',
78
+ 'loststolenpassport.service.gov.uk',
79
+ 'makeaplea.service.gov.uk',
80
+ 'managefleetvehicles.service.gov.uk',
81
+ 'manage-apprenticeships.service.gov.uk',
82
+ 'manage-fish-exports.service.gov.uk',
83
+ 'manage-quota.fluorinated-gas.service.gov.uk',
84
+ 'manage-water-abstraction-impoundment-licence.service.gov.uk',
85
+ 'match.redundancy-payments.service.gov.uk',
86
+ 'mot-testing.service.gov.uk',
87
+ 'nominate-uk-honour.service.gov.uk',
88
+ 'notice.redundancy-payments.service.gov.uk',
89
+ 'passport.service.gov.uk',
90
+ 'paydvlafine.service.gov.uk',
91
+ 'payments.service.gov.uk',
92
+ 'publish-payment-practices.service.gov.uk',
93
+ 'queens-awards-enterprise.service.gov.uk',
94
+ 'recruit.manage-apprenticeships.service.gov.uk',
95
+ 'register.fluorinated-gas.service.gov.uk',
96
+ 'register-trailer.service.gov.uk',
97
+ 'register.ozone-depleting-substances.service.gov.uk',
98
+ 'registertovote.service.gov.uk',
99
+ 'register-vehicle.service.gov.uk',
100
+ 'registers.service.gov.uk',
101
+ 'reminders.mot-testing.service.gov.uk',
102
+ 'renewable-heat-calculator.service.gov.uk',
103
+ 'reply-jury-summons.service.gov.uk',
104
+ 'report-director-conduct.service.gov.uk',
105
+ 'report.fluorinated-gas.service.gov.uk',
106
+ 'report.ozone-depleting-substances.service.gov.uk',
107
+ 'right-to-rent.homeoffice.gov.uk',
108
+ 'right-to-work.service.gov.uk',
109
+ 'ruralpayments.service.gov.uk',
110
+ 'schools-financial-benchmarking.service.gov.uk',
111
+ 'secured.studentfinanceni.co.uk',
112
+ 'secured.studentfinancewales.co.uk',
113
+ 'selfservice.payments.service.gov.uk',
114
+ 'send-money-to-prisoner.service.gov.uk',
115
+ 'signin.service.gov.uk',
116
+ 'sorn.service.gov.uk',
117
+ 'staff.helpwithcourtfees.service.gov.uk',
118
+ 'student-finance.service.gov.uk',
119
+ 'tax.service.gov.uk',
120
+ 'teacherservices.education.gov.uk',
121
+ 'teaching-vacancies.service.gov.uk',
122
+ 'to-visit-or-stay-in-the-uk.homeoffice.gov.uk',
123
+ 'trade-tariff.service.gov.uk',
124
+ 'tribunal-response.employmenttribunals.service.gov.uk',
125
+ 'ukri.org',
126
+ 'update-student-loan-employment-details.service.gov.uk',
127
+ 'vehicle-operator-licensing.service.gov.uk',
128
+ 'vehicleenquiry.service.gov.uk',
129
+ 'viewdrivingrecord.service.gov.uk',
130
+ 'view-and-prove-your-rights.homeoffice.gov.uk',
131
+ 'view-immigration-status.service.gov.uk',
132
+ 'visa-address-update.service.gov.uk',
133
+ 'visas-immigration.service.gov.uk',
134
+ 'your-defra-account.defra.gov.uk'
135
+ ]
@@ -0,0 +1,19 @@
1
+ window.GOVUK = window.GOVUK || {}
2
+ window.GOVUK.Modules = window.GOVUK.Modules || {};
3
+
4
+ (function (Modules) {
5
+ function ImageCard ($module) {
6
+ this.$module = $module
7
+ this.$module.youtubeLink = this.$module.querySelector('.gem-c-image-card__image-wrapper div')
8
+ }
9
+
10
+ ImageCard.prototype.init = function () {
11
+ var ytLink = new window.GOVUK.GovspeakYoutubeLinkEnhancement(
12
+ this.$module.youtubeLink,
13
+ 'gem-c-govspeak__youtube-video gem-c-image-card__youtube-video-embed'
14
+ )
15
+ ytLink.init()
16
+ }
17
+
18
+ Modules.ImageCard = ImageCard
19
+ })(window.GOVUK.Modules)
@@ -6,4 +6,15 @@
6
6
 
7
7
  document.addEventListener('DOMContentLoaded', function () {
8
8
  window.GOVUK.modules.start()
9
+
10
+ // if statements ensure these functions don't execute during testing
11
+ if (typeof window.GOVUK.loadAnalytics !== 'undefined') {
12
+ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {}
13
+ if (typeof window.GOVUK.analyticsGa4.vars === 'undefined') {
14
+ window.GOVUK.loadAnalytics.loadGa4()
15
+ }
16
+ if (typeof window.GOVUK.analyticsVars === 'undefined') {
17
+ window.GOVUK.loadAnalytics.loadUa()
18
+ }
19
+ }
9
20
  })
@@ -3,8 +3,9 @@
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  var GOVUK = window.GOVUK || {}
5
5
 
6
- var YoutubeLinkEnhancement = function ($element) {
6
+ var YoutubeLinkEnhancement = function ($element, $classOverride) {
7
7
  this.$element = $element
8
+ this.$classOverride = typeof $classOverride !== 'undefined' ? $classOverride : 'gem-c-govspeak__youtube-video'
8
9
  }
9
10
 
10
11
  YoutubeLinkEnhancement.prototype.init = function () {
@@ -70,7 +71,7 @@
70
71
  var parentContainer = parentPara.parentNode
71
72
 
72
73
  var youtubeVideoContainer = document.createElement('div')
73
- youtubeVideoContainer.className += 'gem-c-govspeak__youtube-video'
74
+ youtubeVideoContainer.className += this.$classOverride
74
75
  youtubeVideoContainer.innerHTML = '<span id="' + elementId + '" data-video-id="' + id + '"></span>'
75
76
 
76
77
  options.title = $link.textContent
@@ -0,0 +1,113 @@
1
+ //= require govuk_publishing_components/analytics
2
+ //= require govuk_publishing_components/analytics-ga4
3
+ //= require govuk_publishing_components/analytics/linked-domains
4
+
5
+ window.GOVUK.loadAnalytics = {
6
+ productionDomains: [
7
+ 'www.gov.uk',
8
+ 'www-origin.publishing.service.gov.uk'
9
+ ],
10
+ stagingDomains: [
11
+ 'www.staging.publishing.service.gov.uk',
12
+ 'www-origin.staging.publishing.service.gov.uk'
13
+ ],
14
+ integrationDomains: [
15
+ 'www.integration.publishing.service.gov.uk',
16
+ 'www-origin.integration.publishing.service.gov.uk'
17
+ ],
18
+ developmentDomains: [
19
+ 'localhost', '127.0.0.1', '0.0.0.0'
20
+ ],
21
+
22
+ // For Universal Analytics' cross domain tracking. linkedDomains is defined by the require statement at the top of the file.
23
+ linkedDomains: window.GOVUK.analytics.linkedDomains,
24
+
25
+ ga4EnvironmentVariables: {
26
+ // initialiseGA4 is used to enable/disable GA4 on specific environments
27
+ production: {
28
+ initialiseGA4: true
29
+ },
30
+ staging: {
31
+ initialiseGA4: true,
32
+ auth: 'oJWs562CxSIjZKn_GlB5Bw',
33
+ preview: 'env-5'
34
+ },
35
+ integration: {
36
+ initialiseGA4: true,
37
+ auth: 'C7iYdcsOlYgGmiUJjZKrHQ',
38
+ preview: 'env-4'
39
+ },
40
+ development: {
41
+ initialiseGA4: true,
42
+ auth: 'bRiZ-jiEHtw6hHpGd6dF9w',
43
+ preview: 'env-3'
44
+ }
45
+ },
46
+
47
+ loadUa: function (currentDomain) {
48
+ currentDomain = currentDomain || window.location.hostname
49
+
50
+ // Universal Analytics variables
51
+ window.GOVUK.analyticsVars = window.GOVUK.analyticsVars || {}
52
+ window.GOVUK.analyticsVars.primaryLinkedDomains = ['account.gov.uk']
53
+ window.GOVUK.analyticsVars.linkedDomains = this.linkedDomains
54
+ window.GOVUK.analyticsVars.gaProperty = 'UA-UNSET'
55
+ window.GOVUK.analyticsVars.gaPropertyCrossDomain = 'UA-UNSET'
56
+
57
+ if (this.arrayContains(currentDomain, this.productionDomains)) {
58
+ window.GOVUK.analyticsVars.gaProperty = 'UA-26179049-1'
59
+ window.GOVUK.analyticsVars.gaPropertyCrossDomain = 'UA-145652997-1'
60
+ } else if (this.arrayContains(currentDomain, this.stagingDomains)) {
61
+ window.GOVUK.analyticsVars.gaProperty = 'UA-26179049-20'
62
+ window.GOVUK.analyticsVars.gaPropertyCrossDomain = 'UA-145652997-1'
63
+ } else if (this.arrayContains(currentDomain, this.integrationDomains)) {
64
+ window.GOVUK.analyticsVars.gaProperty = 'UA-26179049-22'
65
+ window.GOVUK.analyticsVars.gaPropertyCrossDomain = 'UA-145652997-1'
66
+ }
67
+
68
+ // Load universal analytics
69
+ if (typeof window.GOVUK.analyticsInit !== 'undefined') {
70
+ window.GOVUK.analyticsInit()
71
+ }
72
+ },
73
+
74
+ loadGa4: function (currentDomain) {
75
+ currentDomain = currentDomain || window.location.hostname
76
+ var environment = ''
77
+
78
+ // Categorise current environment
79
+ if (this.arrayContains(currentDomain, this.productionDomains)) {
80
+ environment = 'production'
81
+ } else if (this.arrayContains(currentDomain, this.stagingDomains)) {
82
+ environment = 'staging'
83
+ } else if (this.arrayContains(currentDomain, this.integrationDomains)) {
84
+ environment = 'integration'
85
+ } else if (this.arrayContains(currentDomain, this.developmentDomains) || currentDomain.indexOf('.dev.gov.uk') !== -1) {
86
+ environment = 'development'
87
+ }
88
+
89
+ // If we recognise the environment (i.e. the string isn't empty), load in GA4
90
+ if (environment) {
91
+ // If analytics-ga4.js exists and our detected environment has 'initialiseGA4' set to true, load GA4.
92
+ if (typeof window.GOVUK.analyticsGa4.init !== 'undefined' && this.ga4EnvironmentVariables[environment].initialiseGA4) {
93
+ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {}
94
+ window.GOVUK.analyticsGa4.vars = window.GOVUK.analyticsGa4.vars || {}
95
+ window.GOVUK.analyticsGa4.vars.id = 'GTM-MG7HG5W'
96
+ window.GOVUK.analyticsGa4.vars.auth = this.ga4EnvironmentVariables[environment].auth
97
+ window.GOVUK.analyticsGa4.vars.preview = this.ga4EnvironmentVariables[environment].preview
98
+ window.GOVUK.analyticsGa4.vars.environment = environment // Used for testing and debugging
99
+
100
+ window.GOVUK.analyticsGa4.vars.gem_version = 'not found'
101
+ var gemMeta = document.querySelector('meta[name="govuk:components_gem_version"]')
102
+ if (gemMeta) {
103
+ window.GOVUK.analyticsGa4.vars.gem_version = gemMeta.getAttribute('content')
104
+ }
105
+ window.GOVUK.analyticsGa4.init()
106
+ }
107
+ }
108
+ },
109
+
110
+ arrayContains: function (valueToFind, array) {
111
+ return array.indexOf(valueToFind) !== -1
112
+ }
113
+ }
@@ -208,6 +208,87 @@
208
208
  }
209
209
  }
210
210
 
211
+ // The following two rules are used to 'trick' the
212
+ // Youtube embed into using the desktop styles. Without
213
+ // this, the Youtube embed will use mobile styles in
214
+ // desktop viewports. The Youtube mobile styles are more
215
+ // challenging to use with a keyboard as they are designed
216
+ // for a touch screen interface. There is seemingly no way
217
+ // to make an iframe request the desktop version of a site
218
+ // and there is no parameter in the Youtube embed that would
219
+ // force the desktop styles. Hence this workaround.
220
+
221
+ // In the first rule, we are adding an arbitrarly large
222
+ // enough px to the width of the Youtube iframe so that
223
+ // it will use the desktop styling. Unfortunately, this width
224
+ // would result in the Youtube embed overlapping into the
225
+ // text content. To stop this happening, we scale the size of
226
+ // the embed down.
227
+
228
+ .gem-c-image-card__youtube-video-embed iframe {
229
+ @include govuk-media-query($from: tablet) {
230
+ transform: scale(.7);
231
+ width: calc(100% + 45px);
232
+ }
233
+ z-index: 1;
234
+ }
235
+
236
+ // In the second rule, we scale the container of the embed
237
+ // up by the amount that we scaled the Youtube embed down.
238
+ // This results in the embed being the correct size and the
239
+ // desktop styles being used.
240
+
241
+ .gem-c-image-card__youtube-video-embed {
242
+ @include govuk-media-query($from: tablet) {
243
+ transform: scale(1.3);
244
+ }
245
+ margin: 0;
246
+ padding-bottom: 68%;
247
+ }
248
+
249
+ // This rule is to reposition the embed to the correct
250
+ // place in the image card. As the embed has been scaled
251
+ // down and then scaled up again, it is misaligned and
252
+ // here we correct that misalignment.
253
+
254
+ .gem-c-image-card__youtube-video-embed.gem-c-govspeak__youtube-video iframe {
255
+ @include govuk-media-query($from: tablet) {
256
+ left: -22px;
257
+ top: -10px;
258
+ }
259
+ }
260
+
261
+ .gem-c-image-card__youtube-thumbnail-image-container {
262
+ position: relative;
263
+
264
+ &:before {
265
+ background: url("govuk_publishing_components/youtube-play-icon.png");
266
+ background: url("govuk_publishing_components/youtube-play-icon.svg"), linear-gradient(transparent, transparent);
267
+ background-repeat: no-repeat;
268
+ background-position: 50%;
269
+ background-size: 75px auto;
270
+ content: "";
271
+ height: 100%;
272
+ left: 0;
273
+ position: absolute;
274
+ top: 0;
275
+ width: 100%;
276
+ z-index: 1;
277
+ }
278
+ }
279
+
280
+ .gem-c-image-card__youtube-thumbnail-image {
281
+ filter: brightness(.9);
282
+ }
283
+
284
+ .gem-c-image-card__youtube-thumbnail-container-text {
285
+ margin-top: 10px;
286
+ }
287
+
288
+ .gem-c-image-card__youtube-thumbnail-container:focus .gem-c-image-card__youtube-thumbnail-container-text {
289
+ @include govuk-focused-text;
290
+ }
291
+
211
292
  .gem-c-image-card--no-image {
212
293
  .gem-c-image-card__text-wrapper {
213
294
  @include govuk-media-query($from: mobile, $until: tablet) {
@@ -1,10 +1,12 @@
1
1
  <% navigation = GovukPublishingComponents::Presenters::ContextualNavigation.new(content_item, request) %>
2
+ <% ga4_tracking ||= false %>
2
3
 
3
4
  <% unless navigation.content_tagged_to_current_step_by_step? %>
4
5
  <div class="gem-c-contextual-footer">
5
6
  <%# Rendering related navigation because no step by step list %>
6
7
  <%= render 'govuk_publishing_components/components/related_navigation',
7
8
  content_item: content_item,
9
+ ga4_tracking: ga4_tracking,
8
10
  context: :footer %>
9
11
  </div>
10
12
  <% end %>
@@ -1,5 +1,9 @@
1
- <% navigation = GovukPublishingComponents::Presenters::ContextualNavigation.new(content_item, request) %>
2
- <% shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns) %>
1
+ <%
2
+ ga4_tracking ||= false
3
+ request.query_parameters[:ga4_tracking] = ga4_tracking
4
+ navigation = GovukPublishingComponents::Presenters::ContextualNavigation.new(content_item, request)
5
+ shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
6
+ %>
3
7
 
4
8
  <div class="gem-c-contextual-sidebar">
5
9
  <% if navigation.content_tagged_to_a_reasonable_number_of_step_by_steps? %>
@@ -12,7 +16,7 @@
12
16
  <%= render 'govuk_publishing_components/components/step_by_step_nav', navigation.step_nav_helper.sidebar %>
13
17
  <% else %>
14
18
  <%# Rendering related navigation sidebar because no step by step list %>
15
- <%= render 'govuk_publishing_components/components/related_navigation', content_item: content_item, context: :sidebar %>
19
+ <%= render 'govuk_publishing_components/components/related_navigation', content_item: content_item, context: :sidebar, ga4_tracking: ga4_tracking %>
16
20
  <% end %>
17
21
 
18
22
  <% if navigation.content_tagged_to_other_step_by_steps? %>
@@ -1,12 +1,14 @@
1
1
  <%
2
2
  sizes ||= false
3
3
  brand ||= false
4
+
4
5
  brand_helper = GovukPublishingComponents::AppHelpers::BrandHelper.new(brand)
5
- card_helper = GovukPublishingComponents::Presenters::ImageCardHelper.new(local_assigns)
6
+ card_helper = GovukPublishingComponents::Presenters::ImageCardHelper.new(local_assigns, brand_helper)
6
7
  shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
7
- classes = "gem-c-image-card"
8
- classes << " gem-c-image-card--large" if card_helper.large
9
- classes << " gem-c-image-card--no-image" unless defined?(image_src)
8
+ classes = %w[gem-c-image-card]
9
+ classes << "gem-c-image-card--large" if card_helper.large
10
+ classes << "gem-c-image-card--no-image" unless (card_helper.image_src || card_helper.youtube_video_id)
11
+ classes << brand_helper.brand_class if brand_helper.brand_class
10
12
 
11
13
  font_size ||= card_helper.large ? 'm' : 's'
12
14
  heading_class = %w[gem-c-image-card__title]
@@ -23,11 +25,12 @@
23
25
  ]
24
26
  extra_link_classes << brand_helper.color_class
25
27
 
28
+ data_modules = %w[]
29
+ data_modules << "gem-track-click" if card_helper.is_tracking?
30
+ data_modules << "image-card" if card_helper.youtube_video_id
26
31
  %>
27
32
  <% if card_helper.href || card_helper.extra_details.any? %>
28
- <div class="<%= classes %> <%= brand_helper.brand_class %>"
29
- <%= "data-module=gem-track-click" if card_helper.is_tracking? %>
30
- <%= "lang=#{card_helper.lang}" if card_helper.lang %>>
33
+ <%= content_tag(:div, class: classes, "data-module": data_modules, lang: card_helper.lang) do %>
31
34
  <div class="gem-c-image-card__text-wrapper">
32
35
  <div class="gem-c-image-card__header-and-context-wrapper">
33
36
  <% if card_helper.heading_text %>
@@ -65,6 +68,6 @@
65
68
  <p class="gem-c-image-card__metadata"><%= card_helper.metadata %></p>
66
69
  <% end %>
67
70
  </div>
68
- <%= card_helper.image %>
69
- </div>
71
+ <%= card_helper.media %>
72
+ <% end %>
70
73
  <% end %>
@@ -58,6 +58,7 @@
58
58
  "lux-reporter-script": path_to_javascript("govuk_publishing_components/vendor/lux/lux-reporter")
59
59
  }
60
60
  } %>
61
+ <%= javascript_include_tag "govuk_publishing_components/load-analytics" %>
61
62
 
62
63
  <%= csrf_meta_tags %>
63
64
 
@@ -78,6 +79,9 @@
78
79
  <% # The default og:image is added below :head so that scrapers see any custom metatags first, and this is just a fallback %>
79
80
  <meta property="og:image" content="<%= asset_path "govuk-opengraph-image.png" %>">
80
81
 
82
+ <% # Used for Google Analytics 4 debugging %>
83
+ <meta name="govuk:components_gem_version" content="<%= GovukPublishingComponents::VERSION %>" />
84
+
81
85
  <%= yield :head %>
82
86
  </head>
83
87
  <%= tag.body class: body_css_classes do %>
@@ -1,10 +1,15 @@
1
- <% related_nav_helper = GovukPublishingComponents::Presenters::RelatedNavigationHelper.new(local_assigns) %>
2
- <% shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns) %>
1
+ <%
2
+ related_nav_helper = GovukPublishingComponents::Presenters::RelatedNavigationHelper.new(local_assigns)
3
+ shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
4
+ ga4_tracking ||= false
5
+ data = {}
6
+ data[:module] = "gem-track-click"
7
+ data[:module] << " ga4-link-tracker" if ga4_tracking
8
+ %>
3
9
 
4
10
  <% if related_nav_helper.related_navigation? %>
5
11
  <% random = SecureRandom.hex(4) %>
6
- <div class="gem-c-related-navigation">
7
-
12
+ <%= tag.div(class: "gem-c-related-navigation", data: data) do %>
8
13
  <% if local_assigns[:context] != :footer %>
9
14
  <h2 id="related-nav-related_items-<%= random %>"
10
15
  class="gem-c-related-navigation__main-heading"
@@ -33,7 +38,8 @@
33
38
  section_title: section_title,
34
39
  links: links,
35
40
  section_index: section_index,
36
- random: random %>
41
+ random: random,
42
+ ga4_tracking: ga4_tracking %>
37
43
  <% end %>
38
- </div>
44
+ <% end %>
39
45
  <% end %>
@@ -69,3 +69,46 @@ examples:
69
69
  ordered_related_items:
70
70
  - title: "Find an apprenticeship"
71
71
  base_path: "/apply-apprenticeship"
72
+ with_ga4_tracking:
73
+ description: Adds Google Analytics 4 tracking to the Related Navigation component, if it is visible.
74
+ data:
75
+ ga4_tracking: true
76
+ content_item:
77
+ title: "A content item"
78
+ links:
79
+ topics:
80
+ - title: Apprenticeships, 14 to 19 education and training for work
81
+ base_path: /browse/education/find-course
82
+ document_type: topic
83
+ - title: Finding a job
84
+ base_path: /browse/working/finding-job
85
+ document_type: topic
86
+ - title: Apprenticeships
87
+ base_path: /topic/further-education-skills/apprenticeships
88
+ document_type: topic
89
+ topical_events:
90
+ - title: UK-China High-Level People to People Dialogue 2017
91
+ base_path: /government/topical-events/uk-china-high-level-people-to-people-dialogue-2017
92
+ document_type: topical_event
93
+ related:
94
+ - title: Pest Control
95
+ base_path: /pest-control
96
+ document_type: contact
97
+ related_statistical_data_sets:
98
+ - title: International road fuel prices
99
+ base_path: /government/statistical-data-sets/comparisons-of-industrial-and-domestic-energy-prices-monthly-figures
100
+ document_type: statistical_data_set
101
+ - title: Weekly road fuel prices
102
+ base_path: /government/statistical-data-sets/oil-and-petroleum-products-weekly-statistics
103
+ document_type: statistical_data_set
104
+ world_locations:
105
+ - title: South Sudan
106
+ base_path: /world/south-sudan/news
107
+ - title: USA
108
+ base_path: /world/usa/news
109
+ details:
110
+ external_related_links:
111
+ - url: "http://media.slc.co.uk/sfe/1718/ft/sfe_terms_and_conditions_guide_1718_d.pdf"
112
+ title: "Student loans: terms and conditions 2017 to 2018 (PDF, 136KB)"
113
+ - title: The Student Room repaying your student loan
114
+ url: https://www.thestudentroom.co.uk/content.php?r=5967-Repaying-your-student-loan
@@ -103,3 +103,61 @@ examples:
103
103
  title: "Russian invasion of Ukraine: UK government response"
104
104
  base_path: "/government/topical-events/russian-invasion-of-ukraine-uk-government-response"
105
105
  locale: "en"
106
+ with_ga4_tracking_on_related_navigation:
107
+ description: Adds Google Analytics 4 tracking to components within the sidebar. Currently only the Related Navigation and Step by Step navigation components accept this option.
108
+ data:
109
+ ga4_tracking: true
110
+ content_item:
111
+ title: "UK forces arrive to reinforce NATO’s eastern flank"
112
+ content_id: "a342fd46-d801-4c1e-9d8f-f41fba6da563"
113
+ locale: "en"
114
+ links:
115
+ ordered_related_items:
116
+ - title: Find an apprenticeship
117
+ base_path: /apply-apprenticeship
118
+ - title: Careers helpline for teenagers
119
+ base_path: /careers-helpline-for-teenagers
120
+ document_collections:
121
+ - title: Recruit an apprentice (formerly apprenticeship vacancies)
122
+ base_path: /government/collections/apprenticeship-vacancies
123
+ document_type: document_collection
124
+ - title: The future of jobs and skills
125
+ base_path: /government/collections/the-future-of-jobs-and-skills
126
+ document_type: document_collection
127
+ with_ga4_tracking_on_step_by_step:
128
+ description: Adds Google Analytics 4 tracking to components within the sidebar. Currently only the Related Navigation and Step by Step navigation components accept this option.
129
+ data:
130
+ ga4_tracking: true
131
+ content_item:
132
+ title: "A content item"
133
+ links:
134
+ part_of_step_navs:
135
+ - title: "Learn to drive a car: step by step"
136
+ base_path: "/micropigs-vs-micropugs"
137
+ details:
138
+ step_by_step_nav:
139
+ title: 'Stay in the UK after it leaves the EU (''settled status''): step by step'
140
+ steps:
141
+ - title: Check you're allowed to drive
142
+ contents:
143
+ - type: paragraph
144
+ text: Most people can start learning to drive when they’re 17.
145
+ - type: list
146
+ contents:
147
+ - text: Check what age you can drive
148
+ href: "/vehicles-can-drive"
149
+ optional: false
150
+ - title: Testing the and
151
+ logic: and
152
+ contents:
153
+ - type: paragraph
154
+ text: hello hello what's UP
155
+ - title: Driving lessons and practice
156
+ contents:
157
+ - type: paragraph
158
+ text: You need a provisional driving licence to take lessons or practice.
159
+ - type: list
160
+ contents:
161
+ - text: The Highway Code
162
+ href: "/guidance/the-highway-code"
163
+ optional: false
@@ -7,7 +7,9 @@ body: |
7
7
 
8
8
  shared_accessibility_criteria:
9
9
  - link
10
-
10
+ accessibility_excluded_rules:
11
+ - duplicate-id-aria # IDs will be duplicated in component examples list
12
+ - landmark-unique # aria-label attributes will be duplicated in component examples list
11
13
  examples:
12
14
  default:
13
15
  description: |
@@ -205,6 +205,29 @@ examples:
205
205
  <div class="govuk-!-width-full">
206
206
  <%= component %>
207
207
  </div>
208
+ youtube_video:
209
+ description: |
210
+ Given a Youtube video id, the image card will render a Youtube embed instead of an image. If Javascript fails to execute for any reason, then a fallback link to the Youtube video will be rendered instead.
211
+
212
+ Youtube does not support embeds on Internet Explorer versions lower than 10. In addition, Youtube's website will block any version of Internet Explorer using it. There is therefore no fallback for IE9 and lower.
213
+ data:
214
+ youtube_video_id: "XnP6jaK7ZAY"
215
+ href: "/still-not-a-page"
216
+ youtube_video_alt: "The vision for GOV.UK"
217
+ context:
218
+ date: 2017-06-14 11:30:00
219
+ text: "Announcement"
220
+ description: "Following a news report that something has happened, further details are emerging of the thing that has happened and what that means for you."
221
+ extra_details: [
222
+ {
223
+ text: "Link to video transcript",
224
+ href: "/1"
225
+ }
226
+ ]
227
+ embed: |
228
+ <div class="govuk-!-width-full">
229
+ <%= component %>
230
+ </div>
208
231
  with_data_attributes:
209
232
  description: Data attributes can be applied as required. Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
210
233
  data:
@@ -296,4 +319,4 @@ examples:
296
319
  embed: |
297
320
  <div class="govuk-!-width-full">
298
321
  <%= component %>
299
- </div>
322
+ </div>
@@ -14,9 +14,10 @@ accessibility_criteria: |
14
14
  - have a border colour contrast ratio of more than 4.5:1 with its background to be visually distinct
15
15
  - prevent screen readers from announcing the dismiss link icon
16
16
 
17
-
18
17
  shared_accessibility_criteria:
19
18
  - link
19
+ accessibility_excluded_rules:
20
+ - landmark-unique # aria-label attributes will be duplicated in component examples list
20
21
  examples:
21
22
  default:
22
23
  data:
@@ -7,6 +7,7 @@ govuk_frontend_components:
7
7
  - header
8
8
  accessibility_excluded_rules:
9
9
  - landmark-banner-is-top-level # The header element can not be top level in the examples
10
+ - duplicate-id # IDs will be duplicated in component examples list
10
11
  - duplicate-id-aria # IDs will be duplicated in component examples list
11
12
  - form-field-multiple-labels # Form labels will be ambiguous in component examples list
12
13
  - landmark-no-duplicate-banner # banners will be duplicated in component examples list
@@ -21,6 +21,8 @@ accessibility_criteria: |
21
21
 
22
22
  shared_accessibility_criteria:
23
23
  - link
24
+ accessibility_excluded_rules:
25
+ - landmark-unique # aria-label attributes will be duplicated in component examples list
24
26
  examples:
25
27
  default:
26
28
  data:
@@ -306,3 +306,30 @@ examples:
306
306
  title: "Student loans: terms and conditions 2017 to 2018 (PDF, 136KB)"
307
307
  - title: The Student Room repaying your student loan
308
308
  url: https://www.thestudentroom.co.uk/content.php?r=5967-Repaying-your-student-loan
309
+ with_ga4_tracking:
310
+ description: Adds Google Analytics 4 tracking to the component, using the [GA4 link tracker](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics-ga4/ga4-link-tracker.md).
311
+ data:
312
+ ga4_tracking: true
313
+ content_item:
314
+ links:
315
+ ordered_related_items:
316
+ - title: Find an apprenticeship
317
+ base_path: /apply-apprenticeship
318
+ - title: Training and study at work
319
+ base_path: /training-study-work-your-rights
320
+ - title: Careers helpline for teenagers
321
+ base_path: /careers-helpline-for-teenagers
322
+ topics:
323
+ - title: Apprenticeships, 14 to 19 education and training for work
324
+ base_path: /browse/education/find-course
325
+ document_type: topic
326
+ - title: Finding a job
327
+ base_path: /browse/working/finding-job
328
+ document_type: topic
329
+ - title: Apprenticeships
330
+ base_path: /topic/further-education-skills/apprenticeships
331
+ document_type: topic
332
+ topical_events:
333
+ - title: UK-China High-Level People to People Dialogue 2017
334
+ base_path: /government/topical-events/uk-china-high-level-people-to-people-dialogue-2017
335
+ document_type: topical_event
@@ -14,6 +14,8 @@ accessibility_criteria: |
14
14
  [Watch a screen reader pronounce text differently based on lang attribute](https://bit.ly/screenreaderpronunciation)
15
15
  shared_accessibility_criteria:
16
16
  - link
17
+ accessibility_excluded_rules:
18
+ - landmark-unique # aria-label attributes will be duplicated in component examples list
17
19
  examples:
18
20
  default:
19
21
  data:
@@ -3,20 +3,23 @@
3
3
  aria-labelledby="related-nav-<%= section_title %>-<%= random %>"
4
4
  data-module="gem-toggle">
5
5
 
6
- <% unless section_title === "related_items" %>
6
+ <% if section_title === "related_items" %>
7
+ <% heading_text = related_nav_helper.component_title %>
8
+ <% else %>
7
9
  <%=
8
10
  heading_class = related_nav_helper.section_css_class("gem-c-related-navigation__sub-heading", section_title)
9
11
  heading_data = { 'track-count' => related_nav_helper.section_data_track_count(:related_item_section) }
10
12
  heading_id = "related-nav-#{section_title}-#{random}"
11
13
  heading_level = related_nav_helper.section_heading_level
14
+ heading_text = related_nav_helper.construct_section_heading(section_title)
12
15
 
13
16
  content_tag(heading_level, id: heading_id, class: heading_class, data: heading_data) do
14
- related_nav_helper.construct_section_heading(section_title)
17
+ heading_text
15
18
  end
16
19
  %>
17
20
  <% end %>
18
21
 
19
- <ul class="gem-c-related-navigation__link-list" data-module="gem-track-click">
22
+ <ul class="gem-c-related-navigation__link-list">
20
23
  <% constructed_link_array = [] %>
21
24
 
22
25
  <% section_link_limit = related_nav_helper.calculate_section_link_limit(links) %>
@@ -24,6 +27,12 @@
24
27
  <% links.each.with_index(1) do |link, index| %>
25
28
  <%
26
29
  link_class = "govuk-link #{related_nav_helper.section_css_class("govuk-link gem-c-related-navigation__section-link", section_title, link: link, link_is_inline: (index >= section_link_limit))}"
30
+ ga4_attributes = {
31
+ event_name: "navigation",
32
+ type: "related content",
33
+ index: "#{section_index}.#{index}",
34
+ section: heading_text,
35
+ } if ga4_tracking
27
36
  link_element = link_to(
28
37
  link[:text],
29
38
  link[:path],
@@ -37,7 +46,8 @@
37
46
  track_options: {
38
47
  dimension28: links.length.to_s,
39
48
  dimension29: link[:text]
40
- }
49
+ },
50
+ ga4_link: ga4_attributes,
41
51
  }
42
52
  )
43
53
  %>
@@ -4,14 +4,15 @@ module GovukPublishingComponents
4
4
  include ActionView::Helpers
5
5
  include ActionView::Context
6
6
 
7
- attr_reader :href, :href_data_attributes, :extra_details, :large, :extra_details_no_indent, :heading_text, :metadata, :lang, :image_loading
7
+ attr_reader :href_data_attributes, :extra_details, :extra_details_no_indent, :heading_text, :metadata, :lang, :image_loading, :youtube_video_id, :image_src
8
8
 
9
- def initialize(local_assigns)
9
+ def initialize(local_assigns, brand_helper)
10
10
  @href = local_assigns[:href]
11
11
  @href_data_attributes = local_assigns[:href_data_attributes]
12
12
  @extra_details = local_assigns[:extra_details] || []
13
13
  @image_src = local_assigns[:image_src]
14
14
  @image_alt = local_assigns[:image_alt] || ""
15
+ @youtube_video_alt = local_assigns[:youtube_video_alt]
15
16
  @image_loading = local_assigns[:image_loading] || "auto"
16
17
  @srcset = local_assigns[:srcset] || nil
17
18
  @sizes = local_assigns[:sizes] || nil
@@ -23,6 +24,22 @@ module GovukPublishingComponents
23
24
  @extra_details_no_indent = local_assigns[:extra_details_no_indent]
24
25
  @metadata = local_assigns[:metadata]
25
26
  @lang = local_assigns[:lang]
27
+ @youtube_video_id = local_assigns[:youtube_video_id] || nil
28
+
29
+ @brand_helper = brand_helper
30
+ end
31
+
32
+ def href
33
+ return youtube_href if @youtube_video_id
34
+
35
+ @href
36
+ end
37
+
38
+ def large
39
+ # if youtube video, we don't want to use
40
+ # the small variant, large will be always
41
+ # true if a youtube_video_id is supplied
42
+ @youtube_video_id || @large
26
43
  end
27
44
 
28
45
  def is_tracking?
@@ -36,6 +53,12 @@ module GovukPublishingComponents
36
53
  false
37
54
  end
38
55
 
56
+ def media
57
+ return youtube_link if @youtube_video_id
58
+
59
+ image
60
+ end
61
+
39
62
  def image
40
63
  if @image_src
41
64
  content_tag(:figure, class: "gem-c-image-card__image-wrapper") do
@@ -75,6 +98,46 @@ module GovukPublishingComponents
75
98
  def description
76
99
  content_tag(:div, @description, class: "gem-c-image-card__description") if @description
77
100
  end
101
+
102
+ def youtube_href
103
+ "https://www.youtube.com/watch?v=#{@youtube_video_id}"
104
+ end
105
+
106
+ def youtube_thumbnail_url
107
+ "https://img.youtube.com/vi/#{@youtube_video_id}/maxresdefault.jpg"
108
+ end
109
+
110
+ def youtube_thumbnail
111
+ thumbnail = content_tag(:div, class: "gem-c-image-card__youtube-thumbnail-image-container") do
112
+ image_tag(
113
+ youtube_thumbnail_url,
114
+ class: "gem-c-image-card__image gem-c-image-card__youtube-thumbnail-image",
115
+ alt: "",
116
+ loading: @image_loading,
117
+ )
118
+ end
119
+ thumbnail + content_tag(:figcaption, @youtube_video_alt, class: "gem-c-image-card__youtube-thumbnail-container-text govuk-link #{@brand_helper.color_class}")
120
+ end
121
+
122
+ def youtube_link
123
+ content_tag(
124
+ :figure,
125
+ class: "gem-c-image-card__image-wrapper gem-c-image-card__image-wrapper--youtube-embed",
126
+ ) do
127
+ content_tag(:div) do
128
+ link_to(
129
+ href,
130
+ {
131
+ class: "govuk-body govuk-link gem-c-image-card__youtube-thumbnail-container js-youtube-card-embed",
132
+ "data-youtube-player-analytics": true,
133
+ "data-youtube-player-analytics-category": "EmbeddedYoutube",
134
+ },
135
+ ) do
136
+ youtube_thumbnail
137
+ end
138
+ end
139
+ end
140
+ end
78
141
  end
79
142
  end
80
143
  end
@@ -77,7 +77,7 @@ module GovukPublishingComponents
77
77
  if show_sidebar?
78
78
  @sidebar ||= current_step_nav.content.tap do |sb|
79
79
  configure_for_sidebar(sb)
80
- sb.merge!(small: true, heading_level: 3, tracking_id: current_step_nav.content_id)
80
+ sb.merge!(small: true, heading_level: 3, tracking_id: current_step_nav.content_id, ga4_tracking: @query_parameters[:ga4_tracking])
81
81
  end
82
82
  end
83
83
  end
@@ -65,6 +65,10 @@ module GovukPublishingComponents
65
65
  end
66
66
  end
67
67
 
68
+ def component_title
69
+ I18n.t("components.related_#{@context}_navigation.related_content", default: I18n.t("components.related_navigation.related_content"))
70
+ end
71
+
68
72
  def section_css_class(css_class, section_title, link: {}, link_is_inline: false)
69
73
  css_classes = [css_class]
70
74
  css_classes << "#{css_class}--#{@context}" unless @context.nil?
@@ -1,3 +1,3 @@
1
1
  module GovukPublishingComponents
2
- VERSION = "34.3.0".freeze
2
+ VERSION = "34.4.1".freeze
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: govuk_publishing_components
3
3
  version: !ruby/object:Gem::Version
4
- version: 34.3.0
4
+ version: 34.4.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - GOV.UK Dev
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2023-01-10 00:00:00.000000000 Z
11
+ date: 2023-01-13 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: govuk_app_config
@@ -430,6 +430,8 @@ files:
430
430
  - app/assets/images/govuk_publishing_components/take-action-amber.svg
431
431
  - app/assets/images/govuk_publishing_components/take-action-green.svg
432
432
  - app/assets/images/govuk_publishing_components/take-action-red.svg
433
+ - app/assets/images/govuk_publishing_components/youtube-play-icon.png
434
+ - app/assets/images/govuk_publishing_components/youtube-play-icon.svg
433
435
  - app/assets/javascripts/component_guide/accessibility-test.js
434
436
  - app/assets/javascripts/component_guide/application.js
435
437
  - app/assets/javascripts/component_guide/filter-components.js
@@ -459,6 +461,7 @@ files:
459
461
  - app/assets/javascripts/govuk_publishing_components/analytics/external-link-tracker.js
460
462
  - app/assets/javascripts/govuk_publishing_components/analytics/google-analytics-universal-tracker.js
461
463
  - app/assets/javascripts/govuk_publishing_components/analytics/init.js
464
+ - app/assets/javascripts/govuk_publishing_components/analytics/linked-domains.js
462
465
  - app/assets/javascripts/govuk_publishing_components/analytics/mailto-link-tracker.js
463
466
  - app/assets/javascripts/govuk_publishing_components/analytics/page-content.js
464
467
  - app/assets/javascripts/govuk_publishing_components/analytics/pii.js
@@ -477,6 +480,7 @@ files:
477
480
  - app/assets/javascripts/govuk_publishing_components/components/error-summary.js
478
481
  - app/assets/javascripts/govuk_publishing_components/components/feedback.js
479
482
  - app/assets/javascripts/govuk_publishing_components/components/govspeak.js
483
+ - app/assets/javascripts/govuk_publishing_components/components/image-card.js
480
484
  - app/assets/javascripts/govuk_publishing_components/components/layout-header.js
481
485
  - app/assets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js
482
486
  - app/assets/javascripts/govuk_publishing_components/components/metadata.js
@@ -504,6 +508,7 @@ files:
504
508
  - app/assets/javascripts/govuk_publishing_components/lib/toggle-input-class-on-focus.js
505
509
  - app/assets/javascripts/govuk_publishing_components/lib/toggle.js
506
510
  - app/assets/javascripts/govuk_publishing_components/lib/trigger-event.js
511
+ - app/assets/javascripts/govuk_publishing_components/load-analytics.js
507
512
  - app/assets/javascripts/govuk_publishing_components/modules.js
508
513
  - app/assets/javascripts/govuk_publishing_components/rum-loader.js
509
514
  - app/assets/javascripts/govuk_publishing_components/vendor/html5shiv-printshiv.js