govuk_publishing_components 12.3.0 → 12.4.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/_all_components.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_breadcrumbs.scss +12 -57
- data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +11 -2
- data/app/views/govuk_publishing_components/components/_breadcrumbs.html.erb +31 -33
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/govuk-frontend/all.js +6 -9
- data/node_modules/govuk-frontend/components/checkboxes/macro-options.json +14 -0
- data/node_modules/govuk-frontend/components/checkboxes/template.njk +1 -1
- data/node_modules/govuk-frontend/components/radios/macro-options.json +14 -0
- data/node_modules/govuk-frontend/components/radios/template.njk +1 -1
- data/node_modules/govuk-frontend/components/table/README.md +24 -0
- data/node_modules/govuk-frontend/components/table/macro-options.json +12 -0
- data/node_modules/govuk-frontend/components/table/template.njk +3 -3
- data/node_modules/govuk-frontend/components/tabs/tabs.js +6 -9
- data/node_modules/govuk-frontend/helpers/_visually-hidden.scss +35 -31
- data/node_modules/govuk-frontend/package.json +10 -10
- 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: 1731d079b5e1902476e2c0300ea25ad10d5f5b66841bed867156b4ea71124091
|
|
4
|
+
data.tar.gz: 30dfe416bcb572f270de52fa180b9c102f949f1071d9dd10574016e40efc684f
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 4e5e626770372eeec41774a6b17bf984b280c8af02ccf1b974834d30b7e09ecd2be908d61ca198b9ca08430ea2c80848bff21e7f851df3f9c6f2f848924e802d
|
|
7
|
+
data.tar.gz: 9a9924949425c2f3cc98d80e4a177d71287f30ff0edefc4b4179323b888493d1c139d6303e6dacdeca82c8f88ad441ef388a01fb7621bf6eff62ebaef8c4d880
|
|
@@ -1,64 +1,19 @@
|
|
|
1
|
-
@import "
|
|
2
|
-
@import "
|
|
3
|
-
@import "mixins/media-down";
|
|
1
|
+
@import "helpers/govuk-frontend-settings";
|
|
2
|
+
@import "govuk-frontend/components/breadcrumbs/breadcrumbs";
|
|
4
3
|
|
|
5
|
-
.gem-c-breadcrumbs {
|
|
6
|
-
// reset the default browser styles
|
|
7
|
-
ol {
|
|
8
|
-
padding: 0;
|
|
9
|
-
margin: 0;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
@include breadcrumbs;
|
|
13
|
-
|
|
14
|
-
.gem-c-breadcrumbs__item {
|
|
15
|
-
@include govuk-text-colour;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.gem-c-breadcrumbs__link {
|
|
19
|
-
@include govuk-link-common;
|
|
20
|
-
@include govuk-link-style-text;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
.gem-c-breadcrumbs--current {
|
|
24
|
-
&:link,
|
|
25
|
-
&:visited,
|
|
26
|
-
&:hover,
|
|
27
|
-
&:active {
|
|
28
|
-
color: $secondary-text-colour;
|
|
29
|
-
text-decoration: none;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
&:focus {
|
|
33
|
-
text-decoration: none;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
@include media-down(mobile) {
|
|
38
|
-
&.gem-c-breadcrumbs--collapse-on-mobile .gem-c-breadcrumbs__item {
|
|
39
|
-
display: none;
|
|
40
|
-
|
|
41
|
-
&.gem-c-breadcrumbs--parent {
|
|
42
|
-
background-image: none;
|
|
43
|
-
display: block;
|
|
44
|
-
margin-left: 0;
|
|
45
|
-
padding-left: 14px;
|
|
46
|
-
position: relative;
|
|
47
|
-
|
|
48
|
-
&:before {
|
|
49
|
-
@include back-arrow;
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
.gem-c-breadcrumbs--current.gem-c-breadcrumbs--inverse,
|
|
57
|
-
.gem-c-breadcrumbs .gem-c-breadcrumbs--inverse {
|
|
4
|
+
.gem-c-breadcrumbs--inverse .govuk-breadcrumbs__list-item .govuk-breadcrumbs__link {
|
|
58
5
|
&:link,
|
|
59
6
|
&:visited,
|
|
60
7
|
&:hover,
|
|
61
8
|
&:active {
|
|
62
|
-
color:
|
|
9
|
+
color: govuk-colour('white');
|
|
63
10
|
}
|
|
64
11
|
}
|
|
12
|
+
|
|
13
|
+
.gem-c-breadcrumbs--inverse .govuk-breadcrumbs__list-item {
|
|
14
|
+
color: govuk-colour('white');
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.gem-c-breadcrumbs--inverse .govuk-breadcrumbs__list-item:before {
|
|
18
|
+
border-color: govuk-colour('white');
|
|
19
|
+
}
|
|
@@ -113,18 +113,26 @@
|
|
|
113
113
|
}
|
|
114
114
|
}
|
|
115
115
|
|
|
116
|
+
.gem-c-image-card--large.gem-c-image-card {
|
|
117
|
+
margin: 0 0 30px 0;
|
|
118
|
+
}
|
|
119
|
+
|
|
116
120
|
.gem-c-image-card--large {
|
|
117
121
|
.gem-c-image-card__image-wrapper {
|
|
118
|
-
|
|
122
|
+
padding: 0 $gutter-one-third 0 0;
|
|
123
|
+
margin: 0;
|
|
124
|
+
float: left;
|
|
125
|
+
max-width: 66.66%;
|
|
119
126
|
}
|
|
120
127
|
|
|
121
128
|
.gem-c-image-card__text-wrapper {
|
|
122
|
-
|
|
129
|
+
overflow: hidden;
|
|
123
130
|
}
|
|
124
131
|
|
|
125
132
|
.gem-c-image-card__image-wrapper {
|
|
126
133
|
@include media(mobile) {
|
|
127
134
|
margin-bottom: $gutter-one-third;
|
|
135
|
+
padding: 0;
|
|
128
136
|
}
|
|
129
137
|
}
|
|
130
138
|
|
|
@@ -133,6 +141,7 @@
|
|
|
133
141
|
@include media(mobile) {
|
|
134
142
|
float: none;
|
|
135
143
|
width: auto;
|
|
144
|
+
max-width: 100%;
|
|
136
145
|
}
|
|
137
146
|
}
|
|
138
147
|
|
|
@@ -11,39 +11,37 @@
|
|
|
11
11
|
<%= raw structured_data.to_json %>
|
|
12
12
|
</script>
|
|
13
13
|
|
|
14
|
-
<div class="gem-c-breadcrumbs <%=
|
|
15
|
-
<ol>
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
14
|
+
<div class="gem-c-breadcrumbs govuk-breadcrumbs <%= invert_class %>" data-module="track-click">
|
|
15
|
+
<ol class="govuk-breadcrumbs__list">
|
|
16
|
+
<% breadcrumbs.each_with_index do |crumb, index| %>
|
|
17
|
+
<%
|
|
18
|
+
is_link = crumb[:url].present? || crumb[:is_current_page]
|
|
19
|
+
path = crumb[:is_current_page] ? '#content' : crumb[:url]
|
|
20
|
+
aria_current = crumb[:is_current_page] ? 'page' : 'false'
|
|
21
|
+
%>
|
|
22
|
+
<li class="govuk-breadcrumbs__list-item" aria-current="<%= aria_current %>">
|
|
23
|
+
<% if is_link %>
|
|
24
|
+
<%= link_to(
|
|
25
|
+
crumb[:title],
|
|
26
|
+
path,
|
|
27
|
+
data: {
|
|
28
|
+
track_category: 'breadcrumbClicked',
|
|
29
|
+
track_action: index + 1,
|
|
30
|
+
track_label: path,
|
|
31
|
+
track_options: {
|
|
32
|
+
dimension28: breadcrumbs.length.to_s,
|
|
33
|
+
dimension29: crumb[:title]
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
class: "govuk-breadcrumbs__link",
|
|
37
|
+
aria: {
|
|
38
|
+
current: aria_current,
|
|
36
39
|
}
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
<% else %>
|
|
44
|
-
<%= crumb[:title] %>
|
|
45
|
-
<% end %>
|
|
46
|
-
</li>
|
|
47
|
-
<% end %>
|
|
40
|
+
) %>
|
|
41
|
+
<% else %>
|
|
42
|
+
<%= crumb[:title] %>
|
|
43
|
+
<% end %>
|
|
44
|
+
</li>
|
|
45
|
+
<% end %>
|
|
48
46
|
</ol>
|
|
49
47
|
</div>
|
|
@@ -1691,9 +1691,11 @@ Tabs.prototype.teardown = function () {
|
|
|
1691
1691
|
|
|
1692
1692
|
Tabs.prototype.onHashChange = function (e) {
|
|
1693
1693
|
var hash = window.location.hash;
|
|
1694
|
-
|
|
1694
|
+
var $tabWithHash = this.getTab(hash);
|
|
1695
|
+
if (!$tabWithHash) {
|
|
1695
1696
|
return
|
|
1696
1697
|
}
|
|
1698
|
+
|
|
1697
1699
|
// Prevent changing the hash
|
|
1698
1700
|
if (this.changingHash) {
|
|
1699
1701
|
this.changingHash = false;
|
|
@@ -1702,15 +1704,10 @@ Tabs.prototype.onHashChange = function (e) {
|
|
|
1702
1704
|
|
|
1703
1705
|
// Show either the active tab according to the URL's hash or the first tab
|
|
1704
1706
|
var $previousTab = this.getCurrentTab();
|
|
1705
|
-
var $activeTab = this.getTab(hash) || this.$tabs[0];
|
|
1706
1707
|
|
|
1707
1708
|
this.hideTab($previousTab);
|
|
1708
|
-
this.showTab($
|
|
1709
|
-
$
|
|
1710
|
-
};
|
|
1711
|
-
|
|
1712
|
-
Tabs.prototype.hasTab = function (hash) {
|
|
1713
|
-
return this.$module.querySelector(hash)
|
|
1709
|
+
this.showTab($tabWithHash);
|
|
1710
|
+
$tabWithHash.focus();
|
|
1714
1711
|
};
|
|
1715
1712
|
|
|
1716
1713
|
Tabs.prototype.hideTab = function ($tab) {
|
|
@@ -1724,7 +1721,7 @@ Tabs.prototype.showTab = function ($tab) {
|
|
|
1724
1721
|
};
|
|
1725
1722
|
|
|
1726
1723
|
Tabs.prototype.getTab = function (hash) {
|
|
1727
|
-
return this.$module.querySelector('
|
|
1724
|
+
return this.$module.querySelector('.govuk-tabs__tab[href="' + hash + '"]')
|
|
1728
1725
|
};
|
|
1729
1726
|
|
|
1730
1727
|
Tabs.prototype.setAttributes = function ($tab) {
|
|
@@ -20,6 +20,20 @@
|
|
|
20
20
|
"description": "Options for the errorMessage component (e.g. text).",
|
|
21
21
|
"isComponent": true
|
|
22
22
|
},
|
|
23
|
+
{
|
|
24
|
+
"name": "formGroup",
|
|
25
|
+
"type": "object",
|
|
26
|
+
"required": false,
|
|
27
|
+
"description": "Options for the form-group wrapper",
|
|
28
|
+
"params": [
|
|
29
|
+
{
|
|
30
|
+
"name": "classes",
|
|
31
|
+
"type": "string",
|
|
32
|
+
"required": false,
|
|
33
|
+
"description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
|
|
34
|
+
}
|
|
35
|
+
]
|
|
36
|
+
},
|
|
23
37
|
{
|
|
24
38
|
"name": "idPrefix",
|
|
25
39
|
"type": "string",
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
</div>
|
|
84
84
|
{% endset -%}
|
|
85
85
|
|
|
86
|
-
<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %}">
|
|
86
|
+
<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %} {%- if params.formGroup.classes %} {{ params.formGroup.classes }}{% endif %}">
|
|
87
87
|
{% if params.fieldset %}
|
|
88
88
|
{% call govukFieldset({
|
|
89
89
|
describedBy: describedBy,
|
|
@@ -20,6 +20,20 @@
|
|
|
20
20
|
"description": "Options for the errorMessage component (e.g. text).",
|
|
21
21
|
"isComponent": true
|
|
22
22
|
},
|
|
23
|
+
{
|
|
24
|
+
"name": "formGroup",
|
|
25
|
+
"type": "object",
|
|
26
|
+
"required": false,
|
|
27
|
+
"description": "Options for the form-group wrapper",
|
|
28
|
+
"params": [
|
|
29
|
+
{
|
|
30
|
+
"name": "classes",
|
|
31
|
+
"type": "string",
|
|
32
|
+
"required": false,
|
|
33
|
+
"description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
|
|
34
|
+
}
|
|
35
|
+
]
|
|
36
|
+
},
|
|
23
37
|
{
|
|
24
38
|
"name": "idPrefix",
|
|
25
39
|
"type": "string",
|
|
@@ -86,7 +86,7 @@
|
|
|
86
86
|
</div>
|
|
87
87
|
{% endset -%}
|
|
88
88
|
|
|
89
|
-
<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %}">
|
|
89
|
+
<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %} {%- if params.formGroup.classes %} {{ params.formGroup.classes }}{% endif %}">
|
|
90
90
|
{% if params.fieldset %}
|
|
91
91
|
{% call govukFieldset({
|
|
92
92
|
describedBy: describedBy,
|
|
@@ -442,6 +442,18 @@ If you are using Nunjucks,then macros take the following arguments
|
|
|
442
442
|
|
|
443
443
|
<tr class="govuk-table__row">
|
|
444
444
|
|
|
445
|
+
<th class="govuk-table__header" scope="row">rows.[].attributes</th>
|
|
446
|
+
|
|
447
|
+
<td class="govuk-table__cell">object</td>
|
|
448
|
+
|
|
449
|
+
<td class="govuk-table__cell">No</td>
|
|
450
|
+
|
|
451
|
+
<td class="govuk-table__cell">Any extra HTML attributes (for example data attributes) to add to the cell.</td>
|
|
452
|
+
|
|
453
|
+
</tr>
|
|
454
|
+
|
|
455
|
+
<tr class="govuk-table__row">
|
|
456
|
+
|
|
445
457
|
<th class="govuk-table__header" scope="row">head</th>
|
|
446
458
|
|
|
447
459
|
<td class="govuk-table__cell">array</td>
|
|
@@ -502,6 +514,18 @@ If you are using Nunjucks,then macros take the following arguments
|
|
|
502
514
|
|
|
503
515
|
<tr class="govuk-table__row">
|
|
504
516
|
|
|
517
|
+
<th class="govuk-table__header" scope="row">head.[].attributes</th>
|
|
518
|
+
|
|
519
|
+
<td class="govuk-table__cell">object</td>
|
|
520
|
+
|
|
521
|
+
<td class="govuk-table__cell">No</td>
|
|
522
|
+
|
|
523
|
+
<td class="govuk-table__cell">Any extra HTML attributes (for example data attributes) to add to the cell.</td>
|
|
524
|
+
|
|
525
|
+
</tr>
|
|
526
|
+
|
|
527
|
+
<tr class="govuk-table__row">
|
|
528
|
+
|
|
505
529
|
<th class="govuk-table__header" scope="row">caption</th>
|
|
506
530
|
|
|
507
531
|
<td class="govuk-table__cell">string</td>
|
|
@@ -40,6 +40,12 @@
|
|
|
40
40
|
"type": "integer",
|
|
41
41
|
"required": false,
|
|
42
42
|
"description": "Specify how many rows a cell extends."
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
"name": "attributes",
|
|
46
|
+
"type": "object",
|
|
47
|
+
"required": false,
|
|
48
|
+
"description": "HTML attributes (for example data attributes) to add to the table cell."
|
|
43
49
|
}
|
|
44
50
|
]
|
|
45
51
|
},
|
|
@@ -84,6 +90,12 @@
|
|
|
84
90
|
"type": "integer",
|
|
85
91
|
"required": false,
|
|
86
92
|
"description": "Specify how many rows a cell extends."
|
|
93
|
+
},
|
|
94
|
+
{
|
|
95
|
+
"name": "attributes",
|
|
96
|
+
"type": "object",
|
|
97
|
+
"required": false,
|
|
98
|
+
"description": "HTML attributes (for example data attributes) to add to the table cell."
|
|
87
99
|
}
|
|
88
100
|
]
|
|
89
101
|
},
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
{%- if item.format %} govuk-table__header--{{ item.format }}{% endif %}
|
|
13
13
|
{%- if item.classes %} {{ item.classes }}{% endif %}"
|
|
14
14
|
{%- if item.colspan %} colspan="{{ item.colspan }}"{% endif %}
|
|
15
|
-
{%- if item.rowspan %} rowspan="{{ item.rowspan }}"{% endif %} scope="col">{{ item.html |safe if item.html else item.text }}</th>
|
|
15
|
+
{%- if item.rowspan %} rowspan="{{ item.rowspan }}"{% endif %}{% for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor %} scope="col">{{ item.html |safe if item.html else item.text }}</th>
|
|
16
16
|
{% endfor %}
|
|
17
17
|
</tr>
|
|
18
18
|
</thead>
|
|
@@ -28,13 +28,13 @@
|
|
|
28
28
|
{%- if cell.format %} govuk-table__cell--{{ cell.format }}{% endif %}
|
|
29
29
|
{%- if cell.classes %} {{ cell.classes }}{% endif %}"
|
|
30
30
|
{%- if cell.colspan %} colspan="{{ cell.colspan }}"{% endif %}
|
|
31
|
-
{%- if cell.rowspan %} rowspan="{{ cell.rowspan }}"{% endif %}>{{ cell.html | safe if cell.html else cell.text }}</td>
|
|
31
|
+
{%- if cell.rowspan %} rowspan="{{ cell.rowspan }}"{% endif %}{% for attribute, value in cell.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>{{ cell.html | safe if cell.html else cell.text }}</td>
|
|
32
32
|
{% else %}
|
|
33
33
|
<td class="govuk-table__cell
|
|
34
34
|
{%- if cell.format %} govuk-table__cell--{{ cell.format }}{% endif %}
|
|
35
35
|
{%- if cell.classes %} {{ cell.classes }}{% endif %}"
|
|
36
36
|
{%- if cell.colspan %} colspan="{{ cell.colspan }}"{% endif %}
|
|
37
|
-
{%- if cell.rowspan %} rowspan="{{ cell.rowspan }}"{% endif %}>{{ cell.html | safe if cell.html else cell.text }}</td>
|
|
37
|
+
{%- if cell.rowspan %} rowspan="{{ cell.rowspan }}"{% endif %}{% for attribute, value in cell.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>{{ cell.html | safe if cell.html else cell.text }}</td>
|
|
38
38
|
{% endif %}
|
|
39
39
|
{% endfor %}
|
|
40
40
|
</tr>
|
|
@@ -1130,9 +1130,11 @@ Tabs.prototype.teardown = function () {
|
|
|
1130
1130
|
|
|
1131
1131
|
Tabs.prototype.onHashChange = function (e) {
|
|
1132
1132
|
var hash = window.location.hash;
|
|
1133
|
-
|
|
1133
|
+
var $tabWithHash = this.getTab(hash);
|
|
1134
|
+
if (!$tabWithHash) {
|
|
1134
1135
|
return
|
|
1135
1136
|
}
|
|
1137
|
+
|
|
1136
1138
|
// Prevent changing the hash
|
|
1137
1139
|
if (this.changingHash) {
|
|
1138
1140
|
this.changingHash = false;
|
|
@@ -1141,15 +1143,10 @@ Tabs.prototype.onHashChange = function (e) {
|
|
|
1141
1143
|
|
|
1142
1144
|
// Show either the active tab according to the URL's hash or the first tab
|
|
1143
1145
|
var $previousTab = this.getCurrentTab();
|
|
1144
|
-
var $activeTab = this.getTab(hash) || this.$tabs[0];
|
|
1145
1146
|
|
|
1146
1147
|
this.hideTab($previousTab);
|
|
1147
|
-
this.showTab($
|
|
1148
|
-
$
|
|
1149
|
-
};
|
|
1150
|
-
|
|
1151
|
-
Tabs.prototype.hasTab = function (hash) {
|
|
1152
|
-
return this.$module.querySelector(hash)
|
|
1148
|
+
this.showTab($tabWithHash);
|
|
1149
|
+
$tabWithHash.focus();
|
|
1153
1150
|
};
|
|
1154
1151
|
|
|
1155
1152
|
Tabs.prototype.hideTab = function ($tab) {
|
|
@@ -1163,7 +1160,7 @@ Tabs.prototype.showTab = function ($tab) {
|
|
|
1163
1160
|
};
|
|
1164
1161
|
|
|
1165
1162
|
Tabs.prototype.getTab = function (hash) {
|
|
1166
|
-
return this.$module.querySelector('
|
|
1163
|
+
return this.$module.querySelector('.govuk-tabs__tab[href="' + hash + '"]')
|
|
1167
1164
|
};
|
|
1168
1165
|
|
|
1169
1166
|
Tabs.prototype.setAttributes = function ($tab) {
|
|
@@ -9,27 +9,29 @@
|
|
|
9
9
|
/// @link https://github.com/h5bp/html5-boilerplate/blob/9f13695d21ff92c55c78dfa9f16bb02a1b6e911f/src/css/main.css#L121-L158
|
|
10
10
|
/// - h5bp/html5-boilerplate - Thanks!
|
|
11
11
|
///
|
|
12
|
+
/// @param {Boolean} $important [true] - Whether to mark as `!important`
|
|
13
|
+
///
|
|
12
14
|
/// @access public
|
|
13
15
|
|
|
14
|
-
@mixin govuk-visually-hidden {
|
|
15
|
-
position: absolute;
|
|
16
|
+
@mixin govuk-visually-hidden($important: true) {
|
|
17
|
+
position: absolute iff($important, !important);
|
|
16
18
|
|
|
17
|
-
width: 1px;
|
|
18
|
-
height: 1px;
|
|
19
|
-
margin: -1px;
|
|
20
|
-
padding: 0;
|
|
19
|
+
width: 1px iff($important, !important);
|
|
20
|
+
height: 1px iff($important, !important);
|
|
21
|
+
margin: -1px iff($important, !important);
|
|
22
|
+
padding: 0 iff($important, !important);
|
|
21
23
|
|
|
22
|
-
overflow: hidden;
|
|
23
|
-
clip: rect(0 0 0 0);
|
|
24
|
-
-webkit-clip-path: inset(50%);
|
|
25
|
-
clip-path: inset(50%);
|
|
24
|
+
overflow: hidden iff($important, !important);
|
|
25
|
+
clip: rect(0 0 0 0) iff($important, !important);
|
|
26
|
+
-webkit-clip-path: inset(50%) iff($important, !important);
|
|
27
|
+
clip-path: inset(50%) iff($important, !important);
|
|
26
28
|
|
|
27
|
-
border: 0;
|
|
29
|
+
border: 0 iff($important, !important);
|
|
28
30
|
|
|
29
31
|
// For long content, line feeds are not interpreted as spaces and small width
|
|
30
32
|
// causes content to wrap 1 word per line:
|
|
31
33
|
// https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
|
|
32
|
-
white-space: nowrap;
|
|
34
|
+
white-space: nowrap iff($important, !important);
|
|
33
35
|
}
|
|
34
36
|
|
|
35
37
|
/// Hide an element visually, but have it available for screen readers whilst
|
|
@@ -39,38 +41,40 @@
|
|
|
39
41
|
/// This is slightly less opinionated about borders and padding to make it
|
|
40
42
|
/// easier to style the focussed element.
|
|
41
43
|
///
|
|
44
|
+
/// @param {Boolean} $important [true] - Whether to mark as `!important`
|
|
45
|
+
///
|
|
42
46
|
/// @access public
|
|
43
47
|
|
|
44
|
-
@mixin govuk-visually-hidden-focusable {
|
|
45
|
-
position: absolute;
|
|
48
|
+
@mixin govuk-visually-hidden-focusable($important: true) {
|
|
49
|
+
position: absolute iff($important, !important);
|
|
46
50
|
|
|
47
|
-
width: 1px;
|
|
48
|
-
height: 1px;
|
|
49
|
-
margin: -1px;
|
|
51
|
+
width: 1px iff($important, !important);
|
|
52
|
+
height: 1px iff($important, !important);
|
|
53
|
+
margin: -1px iff($important, !important);
|
|
50
54
|
|
|
51
|
-
overflow: hidden;
|
|
52
|
-
clip: rect(0 0 0 0);
|
|
53
|
-
-webkit-clip-path: inset(50%);
|
|
54
|
-
clip-path: inset(50%);
|
|
55
|
+
overflow: hidden iff($important, !important);
|
|
56
|
+
clip: rect(0 0 0 0) iff($important, !important);
|
|
57
|
+
-webkit-clip-path: inset(50%) iff($important, !important);
|
|
58
|
+
clip-path: inset(50%) iff($important, !important);
|
|
55
59
|
|
|
56
60
|
// For long content, line feeds are not interpreted as spaces and small width
|
|
57
61
|
// causes content to wrap 1 word per line:
|
|
58
62
|
// https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
|
|
59
|
-
white-space: nowrap;
|
|
63
|
+
white-space: nowrap iff($important, !important);
|
|
60
64
|
|
|
61
65
|
&:active,
|
|
62
66
|
&:focus {
|
|
63
|
-
position: static;
|
|
67
|
+
position: static iff($important, !important);
|
|
64
68
|
|
|
65
|
-
width: auto;
|
|
66
|
-
height: auto;
|
|
67
|
-
margin: inherit;
|
|
69
|
+
width: auto iff($important, !important);
|
|
70
|
+
height: auto iff($important, !important);
|
|
71
|
+
margin: inherit iff($important, !important);
|
|
68
72
|
|
|
69
|
-
overflow: visible;
|
|
70
|
-
clip: auto;
|
|
71
|
-
-webkit-clip-path: none;
|
|
72
|
-
clip-path: none;
|
|
73
|
+
overflow: visible iff($important, !important);
|
|
74
|
+
clip: auto iff($important, !important);
|
|
75
|
+
-webkit-clip-path: none iff($important, !important);
|
|
76
|
+
clip-path: none iff($important, !important);
|
|
73
77
|
|
|
74
|
-
white-space: inherit;
|
|
78
|
+
white-space: inherit iff($important, !important);
|
|
75
79
|
}
|
|
76
80
|
}
|
|
@@ -15,13 +15,13 @@
|
|
|
15
15
|
],
|
|
16
16
|
"_from": "govuk-frontend@>=2.2.0 <3.0.0",
|
|
17
17
|
"_hasShrinkwrap": false,
|
|
18
|
-
"_id": "govuk-frontend@2.
|
|
18
|
+
"_id": "govuk-frontend@2.3.0",
|
|
19
19
|
"_inCache": true,
|
|
20
20
|
"_location": "/govuk-frontend",
|
|
21
21
|
"_nodeVersion": "8.9.4",
|
|
22
22
|
"_npmOperationalInternal": {
|
|
23
23
|
"host": "s3://npm-registry-packages",
|
|
24
|
-
"tmp": "tmp/govuk-frontend_2.
|
|
24
|
+
"tmp": "tmp/govuk-frontend_2.3.0_1541079945306_0.9124933196062985"
|
|
25
25
|
},
|
|
26
26
|
"_npmUser": {
|
|
27
27
|
"name": "govuk-patterns-and-tools",
|
|
@@ -41,8 +41,8 @@
|
|
|
41
41
|
"_requiredBy": [
|
|
42
42
|
"/"
|
|
43
43
|
],
|
|
44
|
-
"_resolved": "https://registry.npmjs.org/govuk-frontend/-/govuk-frontend-2.
|
|
45
|
-
"_shasum": "
|
|
44
|
+
"_resolved": "https://registry.npmjs.org/govuk-frontend/-/govuk-frontend-2.3.0.tgz",
|
|
45
|
+
"_shasum": "e868bc7b99cdd0b08e3d022351b908ebe20e8133",
|
|
46
46
|
"_shrinkwrap": null,
|
|
47
47
|
"_spec": "govuk-frontend@^2.2.0",
|
|
48
48
|
"_where": "/var/lib/jenkins/workspace/ublishing_components_master-N4FWJIUY4CIFHKGZOAAEVVXODRY3YBORQOPIBBXWX72VUPSGJRRQ",
|
|
@@ -59,12 +59,12 @@
|
|
|
59
59
|
"devDependencies": {},
|
|
60
60
|
"directories": {},
|
|
61
61
|
"dist": {
|
|
62
|
-
"integrity": "sha512-
|
|
63
|
-
"shasum": "
|
|
64
|
-
"tarball": "https://registry.npmjs.org/govuk-frontend/-/govuk-frontend-2.
|
|
62
|
+
"integrity": "sha512-LRg8HH4657V+pDWO6wyKQLPcdsU0RJmkFHkKjj72MP5CQAg4VSWU9I5IdemHwmCcnaTAgk+ygS5e9+jd5Iz+mQ==",
|
|
63
|
+
"shasum": "e868bc7b99cdd0b08e3d022351b908ebe20e8133",
|
|
64
|
+
"tarball": "https://registry.npmjs.org/govuk-frontend/-/govuk-frontend-2.3.0.tgz",
|
|
65
65
|
"fileCount": 243,
|
|
66
|
-
"unpackedSize":
|
|
67
|
-
"npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\
|
|
66
|
+
"unpackedSize": 1509421,
|
|
67
|
+
"npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb2wOKCRA9TVsSAnZWagAAW80QAIj2V1j1YDM7/hUiO+eD\nHpdQn42YNiLVPUUpv8rpj/SH4Fw/vx1J/PsBQpEZ09zOI8qKQQphZPQ8T3EA\n0CdCojj22wVSCBocHo3KKUhjm+njyKcgXcWHGGwgx4RceqghS3HkjrzKUhp9\nNJHiOHghHj/gyhOsx6VnhLCS3MIsJghoeWNaAHgSlxwhpVMmI6zbpdcDYKnU\nx0CwOjOVpu+krl9exYKQOYleoz5Px6fdwzCvP8VH3mOgzGWtV3Z5rkO0pNJO\nNsxT5civPdnnjLwY0EThMtmW2hnZtHVyMUdTQ+dPnEoLSsLvgtPshW25WgQC\nbihJ0gDwbJWStGEq5qHmZc7yUrwzCTF7JLYtMJbwtIbaC08Ax4RT61CLXhie\nsAxjwYUCIdivhGQjIkudCSkIydoXKyiwzjUoyla1LfqNg4N4z/qQVooO8Ttm\nTfb8ITFOl/WVqEQGymXxVaraKdO7GqjcXgayJQ59aiLWWKVmXme+l9OXt8Cb\nO9SF/QZgPWnnzhnmysfNpTB93YPy5PfN4qHEXiOReAqmIo/mkd5oaZoCQ7PC\nkbAQD5JPWIXHIMz9NI2DkEEYIDaNRUZEPQn8HaSErxbCkt6LIQasUdIzFkdH\n6z+ijbYNRNpzdBhA+e4VIb5QQxQhjHNZBLxu5bPaeGRAStUZh2osoctULvJm\nDw2u\r\n=AMNI\r\n-----END PGP SIGNATURE-----\r\n"
|
|
68
68
|
},
|
|
69
69
|
"engines": {
|
|
70
70
|
"node": ">= 4.2.0"
|
|
@@ -92,5 +92,5 @@
|
|
|
92
92
|
"url": "git+https://github.com/alphagov/govuk-frontend.git"
|
|
93
93
|
},
|
|
94
94
|
"sass": "all.scss",
|
|
95
|
-
"version": "2.
|
|
95
|
+
"version": "2.3.0"
|
|
96
96
|
}
|
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: 12.
|
|
4
|
+
version: 12.4.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: 2018-
|
|
11
|
+
date: 2018-11-02 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: govuk_app_config
|