govuk_publishing_components 17.6.1 → 17.7.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/_govspeak-html-publication.scss +19 -15
- data/app/assets/stylesheets/govuk_publishing_components/components/_phase-banner.scss +19 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_advisory.scss +2 -2
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_attachment.scss +15 -17
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_call-to-action.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_charts.scss +22 -44
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_contact.scss +6 -6
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_example.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_footnotes.scss +3 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_form-download.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_images.scss +4 -4
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_information-callout.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_legislative-list.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_place.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_stat-headline.scss +4 -4
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_steps.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_summary.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_tables.scss +5 -5
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_typography.scss +13 -13
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_warning-callout.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_govspeak.scss +6 -6
- data/app/views/govuk_publishing_components/components/_phase_banner.html.erb +9 -5
- data/app/views/govuk_publishing_components/components/docs/phase_banner.yml +10 -1
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/accessible-autocomplete/package.json +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 5a3c34586d67a16119aeac7a55f462e222d46afedbc1676d9189de64879c69b6
|
4
|
+
data.tar.gz: 8d3435fb34861e37f3be74f810b8c347142875be94555a35e1e99be964078056
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 35a3fda9195eb7f0449af19ce54086cbb4371a44c352c90395b96092716d5799d1b8438d4b35a2e27d2e3e95f7f6d91eb47df322c1ce5f8760cb792ef2a16444
|
7
|
+
data.tar.gz: 79dd0c477f41e0e0f9966765e9623ab14860d06c76c6139f65d77e0ddee5f555ceec1bb9619b394a37c6edafd0d85c28d6ec4bc4e78b6816857ae7b5a9465f77
|
data/app/assets/stylesheets/govuk_publishing_components/components/_govspeak-html-publication.scss
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
// Override govspeak styles with HTML publication specific ones
|
2
2
|
.gem-c-govspeak-html-publication {
|
3
|
-
margin-bottom:
|
3
|
+
margin-bottom: govuk-spacing(6) * 1.5;
|
4
4
|
z-index: 2;
|
5
5
|
|
6
6
|
// This fixes the positioning of the sticky element. The reason it's done on the parent element
|
@@ -22,25 +22,25 @@
|
|
22
22
|
}
|
23
23
|
|
24
24
|
.stat-headline:first-child {
|
25
|
-
margin-top:
|
25
|
+
margin-top: govuk-spacing(6);
|
26
26
|
|
27
27
|
@include govuk-media-query($from: tablet) {
|
28
|
-
margin-top: (
|
28
|
+
margin-top: govuk-spacing(9) + govuk-spacing(4);
|
29
29
|
}
|
30
30
|
}
|
31
31
|
|
32
32
|
h2,
|
33
33
|
h3 {
|
34
|
-
margin-top:
|
34
|
+
margin-top: govuk-spacing(6);
|
35
35
|
|
36
36
|
@include govuk-media-query($from: tablet) {
|
37
|
-
margin-top: (
|
37
|
+
margin-top: govuk-spacing(9) + govuk-spacing(4);
|
38
38
|
}
|
39
39
|
}
|
40
40
|
|
41
41
|
h2:first-child,
|
42
42
|
h3:first-child {
|
43
|
-
margin-top:
|
43
|
+
margin-top: govuk-spacing(4);
|
44
44
|
|
45
45
|
@include govuk-media-query($from: tablet) {
|
46
46
|
margin-top: 0;
|
@@ -67,7 +67,7 @@
|
|
67
67
|
|
68
68
|
.numeric {
|
69
69
|
text-align: right;
|
70
|
-
font
|
70
|
+
@include govuk-font(14, $weight: regular, $tabular: true);
|
71
71
|
}
|
72
72
|
|
73
73
|
// make all elements inside thead look the same
|
@@ -75,12 +75,16 @@
|
|
75
75
|
// and make all of thead and tfoot stand out
|
76
76
|
thead,
|
77
77
|
tfoot {
|
78
|
-
background-color:
|
78
|
+
background-color: govuk-colour("grey-3");
|
79
79
|
}
|
80
80
|
|
81
81
|
thead th,
|
82
82
|
thead td {
|
83
|
-
font
|
83
|
+
@include govuk-font(14, $weight: bold, $tabular: true);
|
84
|
+
|
85
|
+
&.numeric {
|
86
|
+
@include govuk-font(14, $weight: bold, $tabular: true);
|
87
|
+
}
|
84
88
|
}
|
85
89
|
|
86
90
|
// don't make `th`s bold unless they are a section heading or a (sub)total row
|
@@ -93,30 +97,30 @@
|
|
93
97
|
// is intentionally small and not balanced with other padding
|
94
98
|
// as tables can be quite wide
|
95
99
|
tr > :first-child {
|
96
|
-
padding-left:
|
100
|
+
padding-left: govuk-spacing(1);
|
97
101
|
}
|
98
102
|
|
99
103
|
// add spacing so that groupings are clearer
|
100
104
|
tr.section-heading > * {
|
101
105
|
font-weight: bold;
|
102
|
-
padding-top:
|
106
|
+
padding-top: govuk-spacing(6);
|
103
107
|
}
|
104
108
|
|
105
109
|
// ideally this should be just a top margin on the tfoot
|
106
110
|
// but as that is very tricky, this is more complex
|
107
111
|
tbody:last-of-type tr:last-child > *,
|
108
112
|
tfoot ~ tbody:last-of-type tr:last-child > * {
|
109
|
-
padding-bottom:
|
113
|
+
padding-bottom: govuk-spacing(6);
|
110
114
|
}
|
111
115
|
|
112
116
|
tbody:last-child tr:last-child > * {
|
113
|
-
padding-bottom:
|
117
|
+
padding-bottom: govuk-spacing(2);
|
114
118
|
}
|
115
119
|
|
116
120
|
// total and subtotal rows
|
117
121
|
tr.subtotal > *,
|
118
122
|
tr.total > * {
|
119
|
-
border-top: 3px solid
|
123
|
+
border-top: 3px solid govuk-colour("grey-2");
|
120
124
|
}
|
121
125
|
|
122
126
|
tr.total > *,
|
@@ -127,7 +131,7 @@
|
|
127
131
|
// the total is usually in the tfoot, so already has that background colour
|
128
132
|
// but when it's used inside the tbody, it should also be highlighted
|
129
133
|
tr.total {
|
130
|
-
background-color:
|
134
|
+
background-color: govuk-colour("grey-3");
|
131
135
|
}
|
132
136
|
}
|
133
137
|
// sass-lint:enable no-qualifying-elements
|
@@ -6,3 +6,22 @@
|
|
6
6
|
margin-right: govuk-spacing(2);
|
7
7
|
}
|
8
8
|
}
|
9
|
+
|
10
|
+
.gem-c-phase-banner--inverse {
|
11
|
+
background: $govuk-brand-colour;
|
12
|
+
|
13
|
+
.govuk-phase-banner__content__tag {
|
14
|
+
background: govuk-colour("white");
|
15
|
+
color: $govuk-brand-colour;
|
16
|
+
}
|
17
|
+
|
18
|
+
.govuk-phase-banner__content__app-name,
|
19
|
+
.govuk-phase-banner__text,
|
20
|
+
.govuk-link {
|
21
|
+
color: govuk-colour("white");
|
22
|
+
|
23
|
+
&:focus {
|
24
|
+
color: govuk-colour("black");
|
25
|
+
}
|
26
|
+
}
|
27
|
+
}
|
@@ -8,7 +8,7 @@ $high-alert-border: #cc0000;
|
|
8
8
|
padding: 1em;
|
9
9
|
text-align: left;
|
10
10
|
|
11
|
-
@include device-pixel-ratio {
|
11
|
+
@include govuk-device-pixel-ratio {
|
12
12
|
background-image: image-url("icon-information-2x.png");
|
13
13
|
background-size: 27px 27px;
|
14
14
|
}
|
@@ -24,7 +24,7 @@ $high-alert-border: #cc0000;
|
|
24
24
|
}
|
25
25
|
|
26
26
|
&.high-alert {
|
27
|
-
background-color:
|
27
|
+
background-color: govuk-colour("grey-3");
|
28
28
|
border-color: $high-alert-border;
|
29
29
|
}
|
30
30
|
|
data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_attachment.scss
CHANGED
@@ -19,9 +19,9 @@
|
|
19
19
|
|
20
20
|
.attachment {
|
21
21
|
position: relative;
|
22
|
-
margin:
|
23
|
-
padding:
|
24
|
-
@
|
22
|
+
margin: govuk-spacing(6) 0;
|
23
|
+
padding: govuk-spacing(3) 0 0 ($thumbnail-width + govuk-spacing(6));
|
24
|
+
@include govuk-clearfix;
|
25
25
|
|
26
26
|
&:first-child {
|
27
27
|
margin-top: 0;
|
@@ -29,32 +29,30 @@
|
|
29
29
|
}
|
30
30
|
|
31
31
|
.attachment-thumb {
|
32
|
-
$thumb-border-width: $gutter-one-third / 2;
|
33
|
-
|
34
32
|
position: relative;
|
35
33
|
float: left;
|
36
|
-
margin-top: $
|
37
|
-
margin-left: -($thumbnail-width +
|
38
|
-
padding-bottom:
|
34
|
+
margin-top: $govuk-border-width;
|
35
|
+
margin-left: -($thumbnail-width + govuk-spacing(6) - $govuk-border-width);
|
36
|
+
padding-bottom: govuk-spacing(3);
|
39
37
|
|
40
38
|
img {
|
41
39
|
display: block;
|
42
40
|
width: $thumbnail-width;
|
43
41
|
height: 140px;
|
44
|
-
background:
|
45
|
-
outline: $
|
42
|
+
background: govuk-colour("white");
|
43
|
+
outline: $govuk-border-width solid transparentize(govuk-colour("black"), .9);
|
46
44
|
|
47
|
-
@include
|
45
|
+
@include govuk-if-ie8 {
|
48
46
|
// IE8 incorrectly asserts the "max-width: 100%" rule to be 0
|
49
47
|
// because of the collapsed width on its floating container
|
50
48
|
// Reset the max-width so that thumbnails render at the specified
|
51
49
|
// width above.
|
52
50
|
// http://www.456bereastreet.com/archive/201202/using_max-width_on_images_can_make_them_disappear_in_ie8/
|
53
51
|
max-width: none;
|
54
|
-
border: $
|
52
|
+
border: $govuk-border-width solid govuk-colour("grey-3");
|
55
53
|
}
|
56
54
|
|
57
|
-
|
55
|
+
box-shadow: 0 2px 2px rgba(govuk-colour("black"), .4);
|
58
56
|
}
|
59
57
|
}
|
60
58
|
|
@@ -65,7 +63,7 @@
|
|
65
63
|
}
|
66
64
|
|
67
65
|
p {
|
68
|
-
margin:
|
66
|
+
margin: govuk-spacing(2) 0;
|
69
67
|
}
|
70
68
|
|
71
69
|
.metadata {
|
@@ -88,7 +86,7 @@
|
|
88
86
|
}
|
89
87
|
|
90
88
|
.preview {
|
91
|
-
padding-right:
|
89
|
+
padding-right: govuk-spacing(3);
|
92
90
|
}
|
93
91
|
|
94
92
|
.opendocument-help {
|
@@ -109,12 +107,12 @@
|
|
109
107
|
}
|
110
108
|
|
111
109
|
&.direction-rtl .attachment {
|
112
|
-
padding:
|
110
|
+
padding: govuk-spacing(3) ($thumbnail-width + govuk-spacing(6)) 0 0;
|
113
111
|
|
114
112
|
.attachment-thumb {
|
115
113
|
float: right;
|
116
114
|
margin-left: 0;
|
117
|
-
margin-right: (($thumbnail-width * -1) -
|
115
|
+
margin-right: (($thumbnail-width * -1) - govuk-spacing(3));
|
118
116
|
}
|
119
117
|
}
|
120
118
|
}
|
@@ -6,16 +6,8 @@
|
|
6
6
|
// - alphagov/whitehall: ✔︎
|
7
7
|
// - alphagov/govspeak: ✔︎
|
8
8
|
|
9
|
-
//
|
10
|
-
//
|
11
|
-
// sass-lint:disable-all
|
12
|
-
/*
|
13
|
-
* magna-charta example stylesheet
|
14
|
-
* https://github.com/alphagov/magna-charta
|
15
|
-
*
|
16
|
-
* Author: Tim Paul
|
17
|
-
* Licensed under the MIT license.
|
18
|
-
*/
|
9
|
+
// adapted from magna-charta example stylesheet
|
10
|
+
// https://github.com/alphagov/magna-charta/blob/master/demo/stylesheets/magna-charta.css
|
19
11
|
|
20
12
|
.gem-c-govspeak {
|
21
13
|
// DEFAULT CHART STYLES
|
@@ -32,24 +24,11 @@
|
|
32
24
|
|
33
25
|
// CHART COLOUR SCHEME
|
34
26
|
|
35
|
-
|
36
|
-
$
|
37
|
-
$
|
38
|
-
$bar-
|
39
|
-
|
40
|
-
// HELPER MIXINS
|
41
|
-
|
42
|
-
@mixin visually-hidden {
|
43
|
-
// Hides content visually, but not from screen readers
|
44
|
-
position: absolute !important;
|
45
|
-
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
|
46
|
-
clip: rect(1px, 1px, 1px, 1px);
|
47
|
-
padding: 0 !important;
|
48
|
-
border: 0 !important;
|
49
|
-
height: 1px !important;
|
50
|
-
width: 1px !important;
|
51
|
-
overflow: hidden;
|
52
|
-
}
|
27
|
+
$chart-border: govuk-colour("white"); // Chart border colour
|
28
|
+
$key-border: govuk-colour("white"); // Key border colour
|
29
|
+
$bar-colours: govuk-colour("blue"), govuk-colour("turquoise"), govuk-colour("green"), govuk-colour("light-green"), govuk-colour("yellow"), govuk-colour("orange"), govuk-colour("red"), govuk-colour("bright-red");
|
30
|
+
$bar-cell-colour: #ebebeb;
|
31
|
+
$bar-outdented-colour: #111111;
|
53
32
|
|
54
33
|
// CHART STYLES
|
55
34
|
.mc-chart {
|
@@ -73,7 +52,7 @@
|
|
73
52
|
|
74
53
|
// KEY STYLES
|
75
54
|
.mc-thead {
|
76
|
-
background-color:
|
55
|
+
background-color: govuk-colour("white");
|
77
56
|
display: table-header-group;
|
78
57
|
padding: $bar-spacing;
|
79
58
|
border: 1px solid $key-border;
|
@@ -151,7 +130,7 @@
|
|
151
130
|
text-align: left;
|
152
131
|
padding: $bar-padding 0;
|
153
132
|
margin-bottom: 1px;
|
154
|
-
color:
|
133
|
+
color: govuk-colour("white");
|
155
134
|
text-indent: $bar-padding;
|
156
135
|
}
|
157
136
|
|
@@ -196,7 +175,7 @@
|
|
196
175
|
.mc-stacked-total {
|
197
176
|
padding: $bar-padding 0;
|
198
177
|
background-color: transparent !important;
|
199
|
-
color:
|
178
|
+
color: govuk-colour("black");
|
200
179
|
display: inline-block;
|
201
180
|
text-indent: 5px;
|
202
181
|
}
|
@@ -228,7 +207,8 @@
|
|
228
207
|
}
|
229
208
|
}
|
230
209
|
|
231
|
-
.mc-td,
|
210
|
+
.mc-td,
|
211
|
+
.mc-th {
|
232
212
|
padding: 0;
|
233
213
|
padding-right: $bar-spacing;
|
234
214
|
margin-right: $stack-spacing;
|
@@ -236,11 +216,11 @@
|
|
236
216
|
|
237
217
|
&.mc-bar-cell {
|
238
218
|
display: block;
|
239
|
-
background-color:
|
219
|
+
background-color: $bar-cell-colour; // Just for testing
|
240
220
|
text-align: left;
|
241
221
|
padding: $bar-padding 0;
|
242
222
|
margin-bottom: 1px;
|
243
|
-
color:
|
223
|
+
color: govuk-colour("white");
|
244
224
|
text-indent: 4px;
|
245
225
|
line-height: 1.5;
|
246
226
|
}
|
@@ -248,7 +228,7 @@
|
|
248
228
|
|
249
229
|
.mc-bar-outdented {
|
250
230
|
span {
|
251
|
-
color:
|
231
|
+
color: $bar-outdented-colour;
|
252
232
|
}
|
253
233
|
}
|
254
234
|
|
@@ -266,15 +246,13 @@
|
|
266
246
|
|
267
247
|
// OUTDENTED BAR VALUES
|
268
248
|
&.mc-outdented {
|
269
|
-
.mc-
|
270
|
-
.mc-
|
271
|
-
|
272
|
-
|
273
|
-
}
|
249
|
+
.mc-tr {
|
250
|
+
.mc-bar-cell {
|
251
|
+
color: $bar-cell-colour;
|
252
|
+
}
|
274
253
|
|
275
|
-
|
276
|
-
|
277
|
-
}
|
254
|
+
.mc-bar-negative {
|
255
|
+
text-align: left;
|
278
256
|
}
|
279
257
|
}
|
280
258
|
}
|
@@ -300,7 +278,7 @@
|
|
300
278
|
// Hides the original table
|
301
279
|
.visually-hidden,
|
302
280
|
.visually-hidden caption {
|
303
|
-
@include visually-hidden;
|
281
|
+
@include govuk-visually-hidden;
|
304
282
|
|
305
283
|
// It's reapplied to captions because Firefox can't hide
|
306
284
|
// table captions unless it's applied directly to it. Go figure.
|
@@ -9,19 +9,19 @@
|
|
9
9
|
// .address is used by the `$A` markdown pattern
|
10
10
|
.address,
|
11
11
|
.contact {
|
12
|
-
border-left: 1px solid
|
13
|
-
padding-left:
|
14
|
-
margin-bottom:
|
15
|
-
margin-top:
|
12
|
+
border-left: 1px solid govuk-colour("grey-2");
|
13
|
+
padding-left: govuk-spacing(3);
|
14
|
+
margin-bottom: govuk-spacing(6);
|
15
|
+
margin-top: govuk-spacing(6);
|
16
16
|
}
|
17
17
|
|
18
18
|
.contact {
|
19
|
-
@
|
19
|
+
@include govuk-clearfix;
|
20
20
|
position: relative;
|
21
21
|
|
22
22
|
.content {
|
23
23
|
float: none;
|
24
|
-
width:
|
24
|
+
width: 100%;
|
25
25
|
|
26
26
|
h3 {
|
27
27
|
@include govuk-font($size: 19, $weight: bold);
|
@@ -11,9 +11,9 @@
|
|
11
11
|
|
12
12
|
.gem-c-govspeak {
|
13
13
|
.footnotes {
|
14
|
-
border-top: 1px solid
|
15
|
-
margin-top:
|
16
|
-
padding-top:
|
14
|
+
border-top: 1px solid govuk-colour("grey-2");
|
15
|
+
margin-top: govuk-spacing(6);
|
16
|
+
padding-top: govuk-spacing(2);
|
17
17
|
|
18
18
|
ol {
|
19
19
|
margin-top: 0;
|
@@ -8,21 +8,21 @@
|
|
8
8
|
img {
|
9
9
|
width: auto;
|
10
10
|
height: auto;
|
11
|
-
max-width:
|
11
|
+
max-width: 100%;
|
12
12
|
}
|
13
13
|
|
14
14
|
figure {
|
15
|
-
width:
|
15
|
+
width: 100%;
|
16
16
|
clear: both;
|
17
17
|
overflow: hidden;
|
18
|
-
padding:
|
18
|
+
padding: govuk-spacing(2) 0 0;
|
19
19
|
|
20
20
|
img {
|
21
21
|
display: inline;
|
22
22
|
text-align: center;
|
23
23
|
width: auto;
|
24
24
|
height: auto;
|
25
|
-
max-width:
|
25
|
+
max-width: 100%;
|
26
26
|
}
|
27
27
|
|
28
28
|
figcaption {
|
data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_stat-headline.scss
CHANGED
@@ -7,12 +7,12 @@
|
|
7
7
|
|
8
8
|
.gem-c-govspeak {
|
9
9
|
.stat-headline {
|
10
|
-
margin-bottom:
|
11
|
-
margin-top:
|
10
|
+
margin-bottom: govuk-spacing(3);
|
11
|
+
margin-top: govuk-spacing(3);
|
12
12
|
|
13
13
|
@include govuk-media-query($from: tablet) {
|
14
|
-
margin-bottom:
|
15
|
-
margin-top:
|
14
|
+
margin-bottom: govuk-spacing(4);
|
15
|
+
margin-top: govuk-spacing(4);
|
16
16
|
}
|
17
17
|
|
18
18
|
p {
|
@@ -14,7 +14,7 @@
|
|
14
14
|
&:nth-child(#{$i}) {
|
15
15
|
background-image: image-url("icon-steps/icon-step-#{$i}.png");
|
16
16
|
|
17
|
-
@include device-pixel-ratio {
|
17
|
+
@include govuk-device-pixel-ratio {
|
18
18
|
background-image: image-url("icon-steps/icon-step-#{$i}-2x.png");
|
19
19
|
background-size: 24px 24px;
|
20
20
|
}
|
@@ -9,8 +9,8 @@
|
|
9
9
|
table {
|
10
10
|
border-collapse: collapse;
|
11
11
|
border-spacing: 0;
|
12
|
-
margin:
|
13
|
-
width:
|
12
|
+
margin: govuk-spacing(6) 0;
|
13
|
+
width: 100%;
|
14
14
|
@include govuk-font($size: 14);
|
15
15
|
|
16
16
|
caption {
|
@@ -21,14 +21,14 @@
|
|
21
21
|
th,
|
22
22
|
td {
|
23
23
|
vertical-align: top;
|
24
|
-
padding:
|
25
|
-
border-bottom: solid 1px
|
24
|
+
padding: govuk-spacing(2) govuk-spacing(2) govuk-spacing(2) 0;
|
25
|
+
border-bottom: solid 1px govuk-colour("grey-2");
|
26
26
|
}
|
27
27
|
|
28
28
|
th {
|
29
29
|
@include govuk-font($size: 14, $weight: bold);
|
30
30
|
text-align: left;
|
31
|
-
color: $
|
31
|
+
color: $govuk-text-colour;
|
32
32
|
}
|
33
33
|
|
34
34
|
td small {
|
data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_typography.scss
CHANGED
@@ -15,7 +15,7 @@
|
|
15
15
|
&.direction-rtl ol,
|
16
16
|
&.direction-rtl ul {
|
17
17
|
margin-left: 0;
|
18
|
-
margin-right:
|
18
|
+
margin-right: govuk-spacing(4);
|
19
19
|
|
20
20
|
ul,
|
21
21
|
ol {
|
@@ -27,26 +27,26 @@
|
|
27
27
|
// Block quotes
|
28
28
|
|
29
29
|
blockquote {
|
30
|
-
padding: 0 0 0
|
30
|
+
padding: 0 0 0 govuk-spacing(4);
|
31
31
|
margin: 0;
|
32
32
|
border: 0;
|
33
33
|
|
34
|
-
@include media(desktop) {
|
35
|
-
margin: 0 0 0 (
|
34
|
+
@include govuk-media-query($from: desktop) {
|
35
|
+
margin: 0 0 0 (- govuk-spacing(6));
|
36
36
|
}
|
37
37
|
|
38
38
|
p {
|
39
|
-
padding-left:
|
39
|
+
padding-left: govuk-spacing(3);
|
40
40
|
|
41
|
-
@include media(tablet) {
|
42
|
-
padding-left:
|
41
|
+
@include govuk-media-query($from: tablet) {
|
42
|
+
padding-left: govuk-spacing(6);
|
43
43
|
}
|
44
44
|
|
45
45
|
&:before {
|
46
46
|
content: "\201C";
|
47
47
|
float: left;
|
48
48
|
clear: both;
|
49
|
-
margin-left:
|
49
|
+
margin-left: (- govuk-spacing(3));
|
50
50
|
}
|
51
51
|
|
52
52
|
&:last-child:after {
|
@@ -56,25 +56,25 @@
|
|
56
56
|
}
|
57
57
|
|
58
58
|
&.direction-rtl blockquote {
|
59
|
-
padding: 0
|
59
|
+
padding: 0 govuk-spacing(4) 0 0;
|
60
60
|
|
61
61
|
@include govuk-media-query($from: desktop) {
|
62
|
-
margin: 0 (
|
62
|
+
margin: 0 (- govuk-spacing(6)) 0 0;
|
63
63
|
}
|
64
64
|
|
65
65
|
p {
|
66
|
-
padding-right:
|
66
|
+
padding-right: govuk-spacing(3);
|
67
67
|
padding-left: 0;
|
68
68
|
|
69
69
|
@include govuk-media-query($from: tablet) {
|
70
|
-
padding-right:
|
70
|
+
padding-right: govuk-spacing(6);
|
71
71
|
padding-left: 0;
|
72
72
|
}
|
73
73
|
|
74
74
|
&:before {
|
75
75
|
content: "\201D";
|
76
76
|
float: right;
|
77
|
-
margin-right:
|
77
|
+
margin-right: (- govuk-spacing(3));
|
78
78
|
margin-left: 0;
|
79
79
|
}
|
80
80
|
|
@@ -6,9 +6,9 @@
|
|
6
6
|
.info-notice,
|
7
7
|
.help-notice,
|
8
8
|
.call-to-action {
|
9
|
-
margin:
|
10
|
-
padding: 0
|
11
|
-
border: 1pt solid
|
9
|
+
margin: govuk-spacing(3) 0;
|
10
|
+
padding: 0 govuk-spacing(3);
|
11
|
+
border: 1pt solid govuk-colour("grey-2");
|
12
12
|
}
|
13
13
|
|
14
14
|
.help-notice p {
|
@@ -23,7 +23,7 @@
|
|
23
23
|
}
|
24
24
|
|
25
25
|
.attachment {
|
26
|
-
margin:
|
26
|
+
margin: govuk-spacing(6) 0;
|
27
27
|
|
28
28
|
&:first-child {
|
29
29
|
margin-top: 0;
|
@@ -41,7 +41,7 @@
|
|
41
41
|
|
42
42
|
.accessibility-warning {
|
43
43
|
h2 {
|
44
|
-
@include
|
44
|
+
@include govuk-font(14);
|
45
45
|
}
|
46
46
|
|
47
47
|
.toggler {
|
@@ -51,7 +51,7 @@
|
|
51
51
|
}
|
52
52
|
|
53
53
|
.footnotes {
|
54
|
-
border-top: 1px solid $text-colour;
|
54
|
+
border-top: 1px solid $govuk-text-colour;
|
55
55
|
}
|
56
56
|
|
57
57
|
.legislative-list {
|
@@ -1,7 +1,8 @@
|
|
1
1
|
<%
|
2
2
|
app_name ||= nil
|
3
3
|
phase ||= nil
|
4
|
-
message ||= nil
|
4
|
+
message ||= nil
|
5
|
+
inverse ||= false
|
5
6
|
|
6
7
|
unless phase.in?(%w[alpha beta])
|
7
8
|
raise ArgumentError, "The phase banner component expects a `phase` (`beta` or `alpha`), #{phase.inspect} given"
|
@@ -9,14 +10,17 @@ end
|
|
9
10
|
|
10
11
|
unless message.present?
|
11
12
|
if phase == "beta"
|
12
|
-
message = raw("This part of GOV.UK is being rebuilt – <a href=\"/help/beta\">find out what beta means</a>")
|
13
|
+
message = raw("This part of GOV.UK is being rebuilt – <a class=\"govuk-link\" href=\"/help/beta\">find out what beta means</a>")
|
13
14
|
elsif phase == "alpha"
|
14
|
-
message = raw("This part of GOV.UK is being built – <a href=\"/service-manual/phases/ideal-alphas\">find out what alpha means</a>")
|
15
|
+
message = raw("This part of GOV.UK is being built – <a class=\"govuk-link\" href=\"/service-manual/phases/ideal-alphas\">find out what alpha means</a>")
|
15
16
|
end
|
16
|
-
end
|
17
|
+
end
|
18
|
+
|
19
|
+
container_css_classes = %w(gem-c-phase-banner govuk-phase-banner)
|
20
|
+
container_css_classes << "gem-c-phase-banner--inverse" if inverse
|
17
21
|
%>
|
18
22
|
|
19
|
-
<%= tag.div class:
|
23
|
+
<%= tag.div class: container_css_classes do %>
|
20
24
|
<%= tag.p class: "govuk-phase-banner__content" do %>
|
21
25
|
<%= tag.strong app_name, class: "govuk-phase-banner__content__app-name" if app_name %>
|
22
26
|
<%= tag.strong phase, class: "govuk-tag govuk-phase-banner__content__tag" %>
|
@@ -18,8 +18,17 @@ examples:
|
|
18
18
|
data:
|
19
19
|
phase: beta
|
20
20
|
message: This is an optional different message to explain what the state means in this
|
21
|
-
context which can take <a href='https://www.gov.uk'>HTML</a>
|
21
|
+
context which can take <a class="govuk-link" href='https://www.gov.uk'>HTML</a>
|
22
22
|
with_app_name:
|
23
23
|
data:
|
24
24
|
app_name: Skittles Maker
|
25
25
|
phase: beta
|
26
|
+
inverse_for_blue_background:
|
27
|
+
data:
|
28
|
+
phase: beta
|
29
|
+
inverse: true
|
30
|
+
inverse_for_blue_background_with_app_name:
|
31
|
+
data:
|
32
|
+
app_name: Skittles Maker
|
33
|
+
phase: beta
|
34
|
+
inverse: true
|
@@ -49,7 +49,7 @@
|
|
49
49
|
"/"
|
50
50
|
],
|
51
51
|
"_resolved": "git://github.com/alphagov/accessible-autocomplete.git#3523dd9fffc70cbd9f6f555f75863c33a709f49e",
|
52
|
-
"_shasum": "
|
52
|
+
"_shasum": "1f80c0f6496bc9005bdc5742bd3a6f47e3a44be0",
|
53
53
|
"_shrinkwrap": null,
|
54
54
|
"_spec": "accessible-autocomplete@git://github.com/alphagov/accessible-autocomplete.git#add-multiselect-support",
|
55
55
|
"_where": "/var/lib/jenkins/workspace/ublishing_components_master-N4FWJIUY4CIFHKGZOAAEVVXODRY3YBORQOPIBBXWX72VUPSGJRRQ",
|