@x-govuk/govuk-eleventy-plugin 5.0.1 → 5.0.3
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.
- package/components/contents-list/_contents-list.scss +0 -8
- package/components/document-list/template.njk +1 -1
- package/components/site-search/_site-search.scss +159 -179
- package/layouts/collection.njk +33 -36
- package/layouts/product.njk +6 -9
- package/layouts/tags.njk +1 -1
- package/package.json +2 -2
|
@@ -35,14 +35,6 @@
|
|
|
35
35
|
position: absolute;
|
|
36
36
|
width: govuk-spacing(4);
|
|
37
37
|
}
|
|
38
|
-
|
|
39
|
-
// Focus styles on IE8 and older include the left margin, creating an odd
|
|
40
|
-
// white box with yellow border around the em dash.
|
|
41
|
-
// https://github.com/alphagov/government-frontend/pull/420#issuecomment-320632386
|
|
42
|
-
@include govuk-if-ie8 {
|
|
43
|
-
display: inline-block;
|
|
44
|
-
vertical-align: top;
|
|
45
|
-
}
|
|
46
38
|
}
|
|
47
39
|
|
|
48
40
|
a {
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
<ul class="app-document-list__item-metadata">
|
|
17
17
|
{% if item.data.date %}
|
|
18
18
|
<li class="app-document-list__attribute">
|
|
19
|
-
<time datetime="{{ item.
|
|
19
|
+
<time datetime="{{ item.date | date }}">{{ item.date | date("d LLLL y") }}</time>
|
|
20
20
|
</li>
|
|
21
21
|
{% endif %}
|
|
22
22
|
{% if item.data.tags %}
|
|
@@ -12,232 +12,212 @@
|
|
|
12
12
|
|
|
13
13
|
$icon-size: 40px;
|
|
14
14
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
float: left;
|
|
15
|
+
.app-site-search {
|
|
16
|
+
float: left;
|
|
17
|
+
margin-bottom: govuk-spacing(2);
|
|
18
|
+
position: relative;
|
|
19
|
+
width: 100%;
|
|
21
20
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
.no-js & {
|
|
30
|
-
display: none;
|
|
21
|
+
@include govuk-media-query($from: 900px) {
|
|
22
|
+
float: right;
|
|
23
|
+
margin: 0;
|
|
24
|
+
margin-top: -5px; // Negative margin to vertically align search in header
|
|
25
|
+
width: 300px;
|
|
26
|
+
}
|
|
31
27
|
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
}
|
|
28
|
+
.no-js & {
|
|
29
|
+
display: none;
|
|
35
30
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
}
|
|
31
|
+
@include govuk-media-query($from: 900px) {
|
|
32
|
+
display: block;
|
|
39
33
|
}
|
|
40
|
-
}
|
|
41
34
|
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
35
|
+
@include govuk-media-query($from: 900px) {
|
|
36
|
+
text-align: right;
|
|
37
|
+
}
|
|
45
38
|
}
|
|
39
|
+
}
|
|
46
40
|
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
height: govuk-px-to-rem($icon-size);
|
|
52
|
-
margin-bottom: 0; // BUG: Safari 10 on macOS seems to add an implicit margin.
|
|
53
|
-
padding: govuk-spacing(1);
|
|
54
|
-
padding-left: $icon-size - govuk-spacing(1);
|
|
55
|
-
border: $govuk-border-width-form-element solid govuk-colour("white");
|
|
56
|
-
border-radius: 0; // Safari 10 on iOS adds implicit border rounding.
|
|
57
|
-
-webkit-appearance: none;
|
|
58
|
-
}
|
|
41
|
+
.app-site-search__wrapper {
|
|
42
|
+
display: block;
|
|
43
|
+
position: relative;
|
|
44
|
+
}
|
|
59
45
|
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
46
|
+
.app-site-search__hint,
|
|
47
|
+
.app-site-search__input {
|
|
48
|
+
border: $govuk-border-width-form-element solid govuk-colour("white");
|
|
49
|
+
border-radius: 0; // Safari 10 on iOS adds implicit border rounding.
|
|
50
|
+
box-sizing: border-box;
|
|
51
|
+
height: govuk-px-to-rem($icon-size);
|
|
52
|
+
margin-bottom: 0; // BUG: Safari 10 on macOS seems to add an implicit margin.
|
|
53
|
+
padding: govuk-spacing(1);
|
|
54
|
+
padding-left: $icon-size - govuk-spacing(1);
|
|
55
|
+
width: 100%;
|
|
56
|
+
-webkit-appearance: none;
|
|
57
|
+
}
|
|
64
58
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
background-position: center left -2px;
|
|
70
|
-
background-size: $icon-size $icon-size;
|
|
59
|
+
.app-site-search__hint {
|
|
60
|
+
position: absolute;
|
|
61
|
+
color: govuk-colour("mid-grey");
|
|
62
|
+
}
|
|
71
63
|
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
64
|
+
.app-site-search__input {
|
|
65
|
+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' width='40' height='40'%3E%3Cpath d='M25.7 24.8L21.9 21c.7-1 1.1-2.2 1.1-3.5 0-3.6-2.9-6.5-6.5-6.5S10 13.9 10 17.5s2.9 6.5 6.5 6.5c1.6 0 3-.6 4.1-1.5l3.7 3.7 1.4-1.4zM12 17.5c0-2.5 2-4.5 4.5-4.5s4.5 2 4.5 4.5-2 4.5-4.5 4.5-4.5-2-4.5-4.5z' fill='#{encode-hex(govuk-colour("dark-grey"))}'%3E%3C/path%3E%3C/svg%3E");
|
|
66
|
+
background-position: center left -2px;
|
|
67
|
+
background-repeat: no-repeat;
|
|
68
|
+
background-size: $icon-size $icon-size;
|
|
69
|
+
position: relative;
|
|
76
70
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
outline: $govuk-focus-width solid $govuk-focus-colour;
|
|
80
|
-
outline-offset: 0;
|
|
81
|
-
box-shadow: inset 0 0 0 $govuk-border-width-form-element;
|
|
71
|
+
&::placeholder {
|
|
72
|
+
color: govuk-colour("dark-grey");
|
|
82
73
|
}
|
|
74
|
+
}
|
|
83
75
|
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
76
|
+
.app-site-search__input--focused {
|
|
77
|
+
border-color: $govuk-focus-text-colour;
|
|
78
|
+
box-shadow: inset 0 0 0 $govuk-border-width-form-element;
|
|
79
|
+
outline: $govuk-focus-width solid $govuk-focus-colour;
|
|
80
|
+
outline-offset: 0;
|
|
81
|
+
}
|
|
88
82
|
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
top: govuk-spacing(2);
|
|
94
|
-
right: 8px;
|
|
95
|
-
width: 24px;
|
|
96
|
-
height: 24px;
|
|
97
|
-
}
|
|
83
|
+
.app-site-search__input--show-all-values {
|
|
84
|
+
cursor: pointer;
|
|
85
|
+
padding: govuk-spacing(1) 34px govuk-spacing(1) govuk-spacing(1);
|
|
86
|
+
}
|
|
98
87
|
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
}
|
|
88
|
+
.app-site-search__dropdown-arrow-down {
|
|
89
|
+
display: inline-block;
|
|
90
|
+
height: 24px;
|
|
91
|
+
position: absolute;
|
|
92
|
+
right: 8px;
|
|
93
|
+
top: govuk-spacing(2);
|
|
94
|
+
width: 24px;
|
|
95
|
+
z-index: -1;
|
|
96
|
+
}
|
|
109
97
|
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
98
|
+
.app-site-search__menu {
|
|
99
|
+
background-color: govuk-colour("white");
|
|
100
|
+
border-top: 0;
|
|
101
|
+
color: govuk-colour("black");
|
|
102
|
+
margin: 0;
|
|
103
|
+
max-height: 342px;
|
|
104
|
+
overflow-x: hidden;
|
|
105
|
+
padding: 0;
|
|
106
|
+
width: 100%;
|
|
107
|
+
}
|
|
113
108
|
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
109
|
+
.app-site-search__menu--visible {
|
|
110
|
+
display: block;
|
|
111
|
+
}
|
|
117
112
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
top: 100%;
|
|
122
|
-
left: 0;
|
|
123
|
-
box-shadow: rgba(govuk-colour("black"), .25) 0 2px 6px;
|
|
124
|
-
}
|
|
113
|
+
.app-site-search__menu--hidden {
|
|
114
|
+
display: none;
|
|
115
|
+
}
|
|
125
116
|
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
117
|
+
.app-site-search__menu--overlay {
|
|
118
|
+
box-shadow: rgba(govuk-colour("black"), .25) 0 2px 6px;
|
|
119
|
+
left: 0;
|
|
120
|
+
position: absolute;
|
|
121
|
+
top: 100%;
|
|
122
|
+
z-index: 100;
|
|
123
|
+
}
|
|
129
124
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
padding: govuk-spacing(2);
|
|
134
|
-
border-bottom: solid govuk-colour("mid-grey");
|
|
135
|
-
border-width: 1px 0;
|
|
136
|
-
cursor: pointer;
|
|
137
|
-
}
|
|
125
|
+
.app-site-search__menu--inline {
|
|
126
|
+
position: relative;
|
|
127
|
+
}
|
|
138
128
|
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
129
|
+
.app-site-search__option {
|
|
130
|
+
border-bottom: solid govuk-colour("mid-grey");
|
|
131
|
+
border-width: 1px 0;
|
|
132
|
+
cursor: pointer;
|
|
133
|
+
display: block;
|
|
134
|
+
position: relative;
|
|
135
|
+
padding: govuk-spacing(2);
|
|
142
136
|
|
|
143
|
-
|
|
137
|
+
&:first-of-type {
|
|
144
138
|
border-top-width: 0;
|
|
145
139
|
}
|
|
146
140
|
|
|
147
|
-
|
|
141
|
+
&:last-of-type {
|
|
148
142
|
border-bottom-width: 0;
|
|
149
143
|
}
|
|
150
144
|
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
background-color: $_app-site-search-option-background-color;
|
|
145
|
+
& > * {
|
|
146
|
+
pointer-events: none;
|
|
154
147
|
}
|
|
148
|
+
}
|
|
155
149
|
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
// Add a transparent outline for when users change their colours.
|
|
160
|
-
outline: 3px solid transparent;
|
|
161
|
-
outline-offset: -3px;
|
|
162
|
-
color: govuk-colour("white");
|
|
163
|
-
background-color: govuk-colour("blue");
|
|
164
|
-
|
|
165
|
-
.app-site-search--section {
|
|
166
|
-
color: inherit;
|
|
167
|
-
}
|
|
168
|
-
}
|
|
150
|
+
.app-site-search__option--odd {
|
|
151
|
+
background-color: #fafafa;
|
|
152
|
+
}
|
|
169
153
|
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
154
|
+
.app-site-search__option--focused,
|
|
155
|
+
.app-site-search__option:hover {
|
|
156
|
+
background-color: govuk-colour("blue");
|
|
157
|
+
border-color: govuk-colour("blue");
|
|
158
|
+
color: govuk-colour("white");
|
|
159
|
+
// Add a transparent outline for when users change their colours.
|
|
160
|
+
outline: 3px solid transparent;
|
|
161
|
+
outline-offset: -3px;
|
|
175
162
|
|
|
176
|
-
.app-site-
|
|
177
|
-
|
|
178
|
-
.app-site-search__option {
|
|
179
|
-
@include govuk-font($size: 19);
|
|
163
|
+
.app-site-search--section {
|
|
164
|
+
color: inherit;
|
|
180
165
|
}
|
|
166
|
+
}
|
|
181
167
|
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
display: inline-block;
|
|
188
|
-
margin-top: 10px;
|
|
189
|
-
color: govuk-colour("white");
|
|
168
|
+
.app-site-search__option--no-results {
|
|
169
|
+
background-color: govuk-colour("white");
|
|
170
|
+
color: govuk-colour("dark-grey");
|
|
171
|
+
cursor: not-allowed;
|
|
172
|
+
}
|
|
190
173
|
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
}
|
|
174
|
+
.app-site-search__hint,
|
|
175
|
+
.app-site-search__input,
|
|
176
|
+
.app-site-search__option {
|
|
177
|
+
@include govuk-font($size: 19);
|
|
178
|
+
}
|
|
197
179
|
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
color: $govuk-secondary-text-colour;
|
|
202
|
-
}
|
|
180
|
+
.app-site-search__link {
|
|
181
|
+
display: none;
|
|
182
|
+
}
|
|
203
183
|
|
|
204
|
-
|
|
205
|
-
|
|
184
|
+
.app-site-search--section {
|
|
185
|
+
@include govuk-font($size: 16);
|
|
186
|
+
color: $govuk-secondary-text-colour;
|
|
187
|
+
display: block;
|
|
188
|
+
}
|
|
206
189
|
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
}
|
|
190
|
+
.app-site-search__aliases {
|
|
191
|
+
margin-left: govuk-spacing(1);
|
|
210
192
|
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
}
|
|
193
|
+
&:before {
|
|
194
|
+
content: "(";
|
|
214
195
|
}
|
|
215
196
|
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
margin-right: govuk-spacing(1);
|
|
219
|
-
margin-left: govuk-spacing(1);
|
|
197
|
+
&:after {
|
|
198
|
+
content: ")";
|
|
220
199
|
}
|
|
221
200
|
}
|
|
222
201
|
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
margin: 0;
|
|
229
|
-
margin-top: -6px;
|
|
230
|
-
float: right;
|
|
231
|
-
text-align: right;
|
|
232
|
-
}
|
|
202
|
+
.app-site-search__separator {
|
|
203
|
+
display: inline-block;
|
|
204
|
+
margin-right: govuk-spacing(1);
|
|
205
|
+
margin-left: govuk-spacing(1);
|
|
206
|
+
}
|
|
233
207
|
|
|
234
|
-
|
|
208
|
+
// No JavaScript fallback styles
|
|
209
|
+
.no-js .app-site-search__link {
|
|
210
|
+
display: none;
|
|
211
|
+
|
|
212
|
+
@include govuk-media-query($from: 900px) {
|
|
213
|
+
color: govuk-colour("white");
|
|
235
214
|
display: inline-block;
|
|
236
215
|
margin-top: 10px;
|
|
237
|
-
|
|
216
|
+
}
|
|
217
|
+
}
|
|
238
218
|
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
219
|
+
.no-js .app-site-search__link:focus {
|
|
220
|
+
@include govuk-media-query($from: 900px) {
|
|
221
|
+
color: govuk-colour("black");
|
|
242
222
|
}
|
|
243
223
|
}
|
package/layouts/collection.njk
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
{% extends "layouts/
|
|
1
|
+
{% extends "layouts/base.njk" %}
|
|
2
2
|
|
|
3
3
|
{% block main %}
|
|
4
4
|
{{ xGovukMasthead({
|
|
@@ -14,44 +14,41 @@
|
|
|
14
14
|
} if showBreadcrumbs
|
|
15
15
|
}) }}
|
|
16
16
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
17
|
+
{{ super() }}
|
|
18
|
+
{% endblock %}
|
|
19
|
+
|
|
20
|
+
{% block content %}
|
|
21
|
+
<div class="govuk-grid-row">
|
|
22
|
+
<section class="govuk-grid-column-two-thirds-from-desktop">
|
|
23
|
+
{{ appProseScope(content) if content }}
|
|
24
24
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
{% if paginationHeading %}
|
|
26
|
+
<h2 class="govuk-heading-l govuk-!-font-size-27">
|
|
27
|
+
{{ paginationHeading }}
|
|
28
|
+
</h2>
|
|
29
|
+
{% endif %}
|
|
30
30
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
31
|
+
{{ appDocumentList({
|
|
32
|
+
headingLevel: 3 if paginationHeading else 2,
|
|
33
|
+
classes: "app-document-list--large",
|
|
34
|
+
items: pagination.items
|
|
35
|
+
}) }}
|
|
36
36
|
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
37
|
+
{{ govukPagination({
|
|
38
|
+
previous: {
|
|
39
|
+
href: pagination.href.previous
|
|
40
|
+
},
|
|
41
|
+
next: {
|
|
42
|
+
href: pagination.href.next
|
|
43
|
+
},
|
|
44
|
+
items: pagination | itemsFromPagination
|
|
45
|
+
}) if pagination.pages.length > 1 }}
|
|
46
|
+
</section>
|
|
47
47
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
</div>
|
|
52
|
-
{% endif %}
|
|
53
|
-
</div>
|
|
54
|
-
{% endblock %}
|
|
55
|
-
</main>
|
|
48
|
+
{% if aside or related %}
|
|
49
|
+
<div class="govuk-grid-column-one-third-from-desktop">
|
|
50
|
+
{% include "layouts/shared/related.njk" %}
|
|
56
51
|
</div>
|
|
52
|
+
{% endif %}
|
|
53
|
+
</div>
|
|
57
54
|
{% endblock %}
|
package/layouts/product.njk
CHANGED
|
@@ -23,14 +23,11 @@
|
|
|
23
23
|
} if showBreadcrumbs
|
|
24
24
|
}) }}
|
|
25
25
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
26
|
+
{{ super() }}
|
|
27
|
+
{% endblock %}
|
|
28
|
+
|
|
29
|
+
{% block content %}
|
|
30
|
+
{{ appProseScope(content) if content }}
|
|
31
31
|
|
|
32
|
-
|
|
33
|
-
{% endblock %}
|
|
34
|
-
</main>
|
|
35
|
-
</div>
|
|
32
|
+
{% include "layouts/shared/related.njk" %}
|
|
36
33
|
{% endblock %}
|
package/layouts/tags.njk
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
<ul class="govuk-list govuk-list--bullet">
|
|
18
18
|
{% for item in collections.tagPages %}
|
|
19
19
|
<li>
|
|
20
|
-
<a href="{{ item.url }}">{{ item.data.tag }}</a>
|
|
20
|
+
<a href="{{ item.url | url }}">{{ item.data.tag }}</a>
|
|
21
21
|
({{ collections[item.data.tag] | length }})
|
|
22
22
|
</li>
|
|
23
23
|
{% endfor %}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@x-govuk/govuk-eleventy-plugin",
|
|
3
|
-
"version": "5.0.
|
|
3
|
+
"version": "5.0.3",
|
|
4
4
|
"description": "Write documentation using Markdown and publish it using GOV.UK styles",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"govuk",
|
|
@@ -70,7 +70,7 @@
|
|
|
70
70
|
"devDependencies": {
|
|
71
71
|
"@x-govuk/govuk-eleventy-plugin": "file:./",
|
|
72
72
|
"ava": "^5.1.0",
|
|
73
|
-
"c8": "^
|
|
73
|
+
"c8": "^8.0.0",
|
|
74
74
|
"standard": "^17.0.0",
|
|
75
75
|
"stylelint": "^ 14.6.1",
|
|
76
76
|
"stylelint-config-gds": "^0.3.0"
|