govuk_publishing_components 44.5.0 → 44.6.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.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/govuk_publishing_components/components/_share-links.scss +26 -5
- data/app/views/govuk_publishing_components/components/_share_links.html.erb +2 -0
- data/app/views/govuk_publishing_components/components/docs/govspeak.yml +8 -1
- data/app/views/govuk_publishing_components/components/docs/share_links.yml +37 -2
- data/lib/govuk_publishing_components/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 82f64e3191afbeb2850a910360ef1d52d51d4c20e3da6af8c876b95e5118f267
|
|
4
|
+
data.tar.gz: 4611f6340457666face57e7ae9b0625c7b30c8432b881c88db7d474f41191c32
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 6c183fbef201a31897b2394602aa1eff29773cd15ee22730da0e4232300ca9b13ae391c430852d7679a4979132f0ca9f510647526235a58f1b142693b940f593
|
|
7
|
+
data.tar.gz: f975cd4193f22ccdd364f4a77a4dbf0429ebc2b87d2c273f9e6b973e524f5150a28caa8454b8c2a4512e0079abebd002d2460738c002d3c459eb297d16fd6421
|
|
@@ -84,18 +84,39 @@ $column-width: 9.5em;
|
|
|
84
84
|
}
|
|
85
85
|
}
|
|
86
86
|
|
|
87
|
-
.gem-c-share-links--
|
|
87
|
+
.gem-c-share-links--flexbox {
|
|
88
|
+
.gem-c-share-links__list {
|
|
89
|
+
display: flex;
|
|
90
|
+
flex-wrap: wrap;
|
|
91
|
+
}
|
|
92
|
+
|
|
88
93
|
.gem-c-share-links__list-item {
|
|
89
|
-
padding-left:
|
|
90
|
-
padding-
|
|
91
|
-
|
|
94
|
+
padding-left: 0;
|
|
95
|
+
padding-right: 0;
|
|
96
|
+
min-width: 180px;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.gem-c-share-links__link-icon {
|
|
100
|
+
display: inline-flex;
|
|
101
|
+
position: relative;
|
|
102
|
+
vertical-align: middle;
|
|
103
|
+
margin-right: govuk-spacing(2);
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.gem-c-share-links__label {
|
|
107
|
+
vertical-align: middle;
|
|
92
108
|
}
|
|
93
109
|
|
|
110
|
+
.gem-c-share-links__link {
|
|
111
|
+
display: inline-block;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
.gem-c-share-links--square-icons {
|
|
94
116
|
.gem-c-share-links__link-icon {
|
|
95
117
|
background-color: govuk-colour("dark-blue");
|
|
96
118
|
color: govuk-colour("white");
|
|
97
119
|
padding: govuk-spacing(2);
|
|
98
|
-
margin-right: govuk-spacing(2);
|
|
99
120
|
}
|
|
100
121
|
|
|
101
122
|
.gem-c-share-links__link:hover {
|
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
ga4_extra_data ||= {}
|
|
9
9
|
stacked ||= false
|
|
10
10
|
columns ||= false
|
|
11
|
+
flexbox ||= false
|
|
11
12
|
square_icons ||= false
|
|
12
13
|
|
|
13
14
|
brand ||= false
|
|
@@ -16,6 +17,7 @@
|
|
|
16
17
|
classes = %w(gem-c-share-links govuk-!-display-none-print)
|
|
17
18
|
classes << "gem-c-share-links--stacked" if stacked
|
|
18
19
|
classes << "gem-c-share-links--columns" if columns
|
|
20
|
+
classes << "gem-c-share-links--flexbox" if flexbox
|
|
19
21
|
classes << "gem-c-share-links--square-icons" if square_icons
|
|
20
22
|
|
|
21
23
|
classes << brand_helper.brand_class
|
|
@@ -32,9 +32,16 @@ examples:
|
|
|
32
32
|
inverse: true
|
|
33
33
|
block: |
|
|
34
34
|
<h2>This is a title</h2>
|
|
35
|
-
|
|
35
|
+
<p>This is some body text with <a href="https://example.com">a link</a>.</p>
|
|
36
36
|
context:
|
|
37
37
|
dark_background: true
|
|
38
|
+
with_margin_bottom:
|
|
39
|
+
description: 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 no margin bottom, as spacing below is normally provided by elements within the component.
|
|
40
|
+
data:
|
|
41
|
+
margin_bottom: 9
|
|
42
|
+
block: |
|
|
43
|
+
<h2>This is a title</h2>
|
|
44
|
+
<p>This is some body text with <a href="https://example.com">a link</a>.</p>
|
|
38
45
|
heading_levels:
|
|
39
46
|
data:
|
|
40
47
|
block: |
|
|
@@ -256,10 +256,45 @@ examples:
|
|
|
256
256
|
icon: 'youtube'
|
|
257
257
|
}
|
|
258
258
|
]
|
|
259
|
-
|
|
259
|
+
with_flexbox:
|
|
260
|
+
data:
|
|
261
|
+
flexbox: true
|
|
262
|
+
links: [
|
|
263
|
+
{
|
|
264
|
+
href: '/twitter-share-link',
|
|
265
|
+
text: 'Twitter',
|
|
266
|
+
icon: 'twitter'
|
|
267
|
+
},
|
|
268
|
+
{
|
|
269
|
+
href: '/instagram-share-link',
|
|
270
|
+
text: 'Instagram',
|
|
271
|
+
icon: 'instagram'
|
|
272
|
+
},
|
|
273
|
+
{
|
|
274
|
+
href: '/flickr-share-link',
|
|
275
|
+
text: 'Flickr',
|
|
276
|
+
icon: 'flickr'
|
|
277
|
+
},
|
|
278
|
+
{
|
|
279
|
+
href: '/facebook-share-link',
|
|
280
|
+
text: 'Facebook',
|
|
281
|
+
icon: 'facebook'
|
|
282
|
+
},
|
|
283
|
+
{
|
|
284
|
+
href: '/youtube-share-link',
|
|
285
|
+
text: 'YouTube',
|
|
286
|
+
icon: 'youtube'
|
|
287
|
+
},
|
|
288
|
+
{
|
|
289
|
+
href: '/other-share-link',
|
|
290
|
+
text: 'Anything else that might be included that could have quite a long name',
|
|
291
|
+
icon: 'other'
|
|
292
|
+
},
|
|
293
|
+
]
|
|
294
|
+
with_square_icons_and_flexbox:
|
|
260
295
|
data:
|
|
261
296
|
square_icons: true
|
|
262
|
-
|
|
297
|
+
flexbox: true
|
|
263
298
|
links: [
|
|
264
299
|
{
|
|
265
300
|
href: '/twitter-share-link',
|
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: 44.
|
|
4
|
+
version: 44.6.0
|
|
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: 2024-10-
|
|
11
|
+
date: 2024-10-23 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: chartkick
|