govuk_publishing_components 21.52.0 → 21.55.1
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/images/govuk_publishing_components/action-link--nhs.png +0 -0
- data/app/assets/images/govuk_publishing_components/action-link--nhs.svg +1 -0
- data/app/assets/images/govuk_publishing_components/action-link-arrow--dark.png +0 -0
- data/app/assets/images/govuk_publishing_components/action-link-arrow--simple.png +0 -0
- data/app/assets/images/govuk_publishing_components/action-link-arrow.png +0 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss +38 -7
- data/app/assets/stylesheets/govuk_publishing_components/components/_back-link.scss +0 -38
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_steps.scss +1 -1
- data/app/controllers/govuk_publishing_components/component_guide_controller.rb +34 -22
- data/app/views/govuk_publishing_components/components/_action_link.html.erb +23 -3
- data/app/views/govuk_publishing_components/components/_contextual_breadcrumbs.html.erb +5 -36
- data/app/views/govuk_publishing_components/components/_step_by_step_nav_header.html.erb +28 -8
- data/app/views/govuk_publishing_components/components/docs/action_link.yml +43 -15
- data/app/views/govuk_publishing_components/components/docs/step_by_step_nav_header.yml +23 -0
- data/lib/govuk_publishing_components.rb +1 -0
- data/lib/govuk_publishing_components/presenters/breadcrumb_selector.rb +107 -0
- data/lib/govuk_publishing_components/presenters/content_breadcrumbs_based_on_priority.rb +14 -1
- data/lib/govuk_publishing_components/presenters/content_breadcrumbs_based_on_taxons.rb +1 -3
- data/lib/govuk_publishing_components/presenters/contextual_navigation.rb +40 -19
- data/lib/govuk_publishing_components/presenters/machine_readable/faq_page_schema.rb +7 -6
- data/lib/govuk_publishing_components/presenters/machine_readable/html_publication_schema.rb +77 -0
- data/lib/govuk_publishing_components/presenters/schema_org.rb +24 -16
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/axe-core/CHANGELOG.md +6 -0
- data/node_modules/axe-core/axe.js +19 -3
- data/node_modules/axe-core/axe.min.js +2 -2
- data/node_modules/axe-core/bower.json +1 -1
- data/node_modules/axe-core/lib/commons/dom/get-element-stack.js +27 -1
- data/node_modules/axe-core/package.json +21 -21
- data/node_modules/axe-core/sri-history.json +4 -0
- data/node_modules/govuk-frontend/README.md +6 -6
- data/node_modules/govuk-frontend/govuk/_base.scss +3 -0
- data/node_modules/govuk-frontend/govuk/all.js +1 -1
- data/node_modules/govuk-frontend/govuk/all.scss +1 -3
- data/node_modules/govuk-frontend/govuk/components/_all.scss +31 -29
- data/node_modules/govuk-frontend/govuk/components/accordion/_accordion.scss +2 -208
- data/node_modules/govuk-frontend/govuk/components/accordion/_index.scss +207 -0
- data/node_modules/govuk-frontend/govuk/components/accordion/accordion.js +1 -1
- data/node_modules/govuk-frontend/govuk/components/back-link/_back-link.scss +2 -65
- data/node_modules/govuk-frontend/govuk/components/back-link/_index.scss +112 -0
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/_breadcrumbs.scss +2 -118
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/_index.scss +138 -0
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/macro-options.json +6 -0
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/template.njk +12 -1
- data/node_modules/govuk-frontend/govuk/components/button/_button.scss +2 -284
- data/node_modules/govuk-frontend/govuk/components/button/_index.scss +280 -0
- data/node_modules/govuk-frontend/govuk/components/character-count/_character-count.scss +2 -31
- data/node_modules/govuk-frontend/govuk/components/character-count/_index.scss +28 -0
- data/node_modules/govuk-frontend/govuk/components/checkboxes/_checkboxes.scss +2 -308
- data/node_modules/govuk-frontend/govuk/components/checkboxes/_index.scss +304 -0
- data/node_modules/govuk-frontend/govuk/components/date-input/_date-input.scss +2 -30
- data/node_modules/govuk-frontend/govuk/components/date-input/_index.scss +26 -0
- data/node_modules/govuk-frontend/govuk/components/details/_details.scss +2 -88
- data/node_modules/govuk-frontend/govuk/components/details/_index.scss +84 -0
- data/node_modules/govuk-frontend/govuk/components/error-message/_error-message.scss +2 -15
- data/node_modules/govuk-frontend/govuk/components/error-message/_index.scss +11 -0
- data/node_modules/govuk-frontend/govuk/components/error-summary/_error-summary.scss +2 -59
- data/node_modules/govuk-frontend/govuk/components/error-summary/_index.scss +55 -0
- data/node_modules/govuk-frontend/govuk/components/fieldset/_fieldset.scss +2 -68
- data/node_modules/govuk-frontend/govuk/components/fieldset/_index.scss +64 -0
- data/node_modules/govuk-frontend/govuk/components/file-upload/_file-upload.scss +2 -81
- data/node_modules/govuk-frontend/govuk/components/file-upload/_index.scss +77 -0
- data/node_modules/govuk-frontend/govuk/components/footer/_footer.scss +2 -244
- data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +238 -0
- data/node_modules/govuk-frontend/govuk/components/header/_header.scss +2 -318
- data/node_modules/govuk-frontend/govuk/components/header/_index.scss +312 -0
- data/node_modules/govuk-frontend/govuk/components/header/macro-options.json +7 -1
- data/node_modules/govuk-frontend/govuk/components/header/template.njk +2 -2
- data/node_modules/govuk-frontend/govuk/components/hint/_hint.scss +2 -50
- data/node_modules/govuk-frontend/govuk/components/hint/_index.scss +46 -0
- data/node_modules/govuk-frontend/govuk/components/input/_index.scss +99 -0
- data/node_modules/govuk-frontend/govuk/components/input/_input.scss +2 -103
- data/node_modules/govuk-frontend/govuk/components/inset-text/_index.scss +24 -0
- data/node_modules/govuk-frontend/govuk/components/inset-text/_inset-text.scss +2 -28
- data/node_modules/govuk-frontend/govuk/components/label/_index.scss +41 -0
- data/node_modules/govuk-frontend/govuk/components/label/_label.scss +2 -45
- data/node_modules/govuk-frontend/govuk/components/panel/_index.scss +40 -0
- data/node_modules/govuk-frontend/govuk/components/panel/_panel.scss +2 -44
- data/node_modules/govuk-frontend/govuk/components/phase-banner/_index.scss +27 -0
- data/node_modules/govuk-frontend/govuk/components/phase-banner/_phase-banner.scss +2 -31
- data/node_modules/govuk-frontend/govuk/components/radios/_index.scss +342 -0
- data/node_modules/govuk-frontend/govuk/components/radios/_radios.scss +2 -346
- data/node_modules/govuk-frontend/govuk/components/select/_index.scss +53 -0
- data/node_modules/govuk-frontend/govuk/components/select/_select.scss +2 -57
- data/node_modules/govuk-frontend/govuk/components/skip-link/_index.scss +33 -0
- data/node_modules/govuk-frontend/govuk/components/skip-link/_skip-link.scss +2 -37
- data/node_modules/govuk-frontend/govuk/components/summary-list/_index.scss +153 -0
- data/node_modules/govuk-frontend/govuk/components/summary-list/_summary-list.scss +2 -157
- data/node_modules/govuk-frontend/govuk/components/table/_index.scss +50 -0
- data/node_modules/govuk-frontend/govuk/components/table/_table.scss +2 -54
- data/node_modules/govuk-frontend/govuk/components/tabs/_index.scss +138 -0
- data/node_modules/govuk-frontend/govuk/components/tabs/_tabs.scss +2 -142
- data/node_modules/govuk-frontend/govuk/components/tag/_index.scss +87 -0
- data/node_modules/govuk-frontend/govuk/components/tag/_tag.scss +2 -91
- data/node_modules/govuk-frontend/govuk/components/textarea/_index.scss +51 -0
- data/node_modules/govuk-frontend/govuk/components/textarea/_textarea.scss +2 -55
- data/node_modules/govuk-frontend/govuk/components/warning-text/_index.scss +56 -0
- data/node_modules/govuk-frontend/govuk/components/warning-text/_warning-text.scss +2 -60
- data/node_modules/govuk-frontend/govuk/core/_global-styles.scss +5 -3
- data/node_modules/govuk-frontend/govuk/core/_links.scss +5 -3
- data/node_modules/govuk-frontend/govuk/core/_lists.scss +17 -3
- data/node_modules/govuk-frontend/govuk/core/_section-break.scss +5 -3
- data/node_modules/govuk-frontend/govuk/core/_template.scss +5 -3
- data/node_modules/govuk-frontend/govuk/core/_typography.scss +5 -3
- data/node_modules/govuk-frontend/govuk/helpers/_clearfix.scss +1 -1
- data/node_modules/govuk-frontend/govuk/helpers/_focused.scss +1 -1
- data/node_modules/govuk-frontend/govuk/helpers/_grid.scss +2 -1
- data/node_modules/govuk-frontend/govuk/helpers/_links.scss +1 -1
- data/node_modules/govuk-frontend/govuk/helpers/_media-queries.scss +1 -1
- data/node_modules/govuk-frontend/govuk/helpers/_shape-arrow.scss +1 -1
- data/node_modules/govuk-frontend/govuk/helpers/_spacing.scss +1 -1
- data/node_modules/govuk-frontend/govuk/helpers/_typography.scss +1 -1
- data/node_modules/govuk-frontend/govuk/helpers/_visually-hidden.scss +1 -1
- data/node_modules/govuk-frontend/govuk/objects/_form-group.scss +1 -3
- data/node_modules/govuk-frontend/govuk/objects/_grid.scss +1 -3
- data/node_modules/govuk-frontend/govuk/objects/_main-wrapper.scss +5 -3
- data/node_modules/govuk-frontend/govuk/objects/_width-container.scss +2 -4
- data/node_modules/govuk-frontend/govuk/overrides/_display.scss +5 -3
- data/node_modules/govuk-frontend/govuk/overrides/_spacing.scss +5 -3
- data/node_modules/govuk-frontend/govuk/overrides/_typography.scss +5 -3
- data/node_modules/govuk-frontend/govuk/overrides/_width.scss +5 -3
- data/node_modules/govuk-frontend/govuk/settings/_ie8.scss +1 -1
- data/node_modules/govuk-frontend/govuk/tools/_compatibility.scss +1 -1
- data/node_modules/govuk-frontend/govuk/tools/_font-url.scss +1 -1
- data/node_modules/govuk-frontend/govuk/tools/_ie8.scss +1 -1
- data/node_modules/govuk-frontend/govuk/tools/_image-url.scss +1 -1
- data/node_modules/govuk-frontend/govuk/tools/_px-to-em.scss +1 -1
- data/node_modules/govuk-frontend/govuk/tools/_px-to-rem.scss +1 -1
- data/node_modules/govuk-frontend/package.json +21 -21
- metadata +50 -2
|
@@ -39,7 +39,13 @@
|
|
|
39
39
|
"name": "text",
|
|
40
40
|
"type": "string",
|
|
41
41
|
"required": false,
|
|
42
|
-
"description": "Text
|
|
42
|
+
"description": "Text for the navigation item. If `html` is provided, the `text` argument will be ignored."
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
"name": "html",
|
|
46
|
+
"type": "string",
|
|
47
|
+
"required": false,
|
|
48
|
+
"description": "HTML for the navigation item. If `html` is provided, the `text` argument will be ignored."
|
|
43
49
|
},
|
|
44
50
|
{
|
|
45
51
|
"name": "href",
|
|
@@ -64,10 +64,10 @@
|
|
|
64
64
|
<nav>
|
|
65
65
|
<ul id="navigation" class="govuk-header__navigation {{ params.navigationClasses if params.navigationClasses }}" aria-label="Top Level Navigation">
|
|
66
66
|
{% for item in params.navigation %}
|
|
67
|
-
{% if item.href and item.text %}
|
|
67
|
+
{% if item.href and (item.text or item.html) %}
|
|
68
68
|
<li class="govuk-header__navigation-item{{ ' govuk-header__navigation-item--active' if item.active }}">
|
|
69
69
|
<a class="govuk-header__link" href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
|
|
70
|
-
{{ item.text }}
|
|
70
|
+
{{ item.html | safe if item.html else item.text }}
|
|
71
71
|
</a>
|
|
72
72
|
</li>
|
|
73
73
|
{% endif %}
|
|
@@ -1,50 +1,2 @@
|
|
|
1
|
-
@import "../../
|
|
2
|
-
@import "
|
|
3
|
-
@import "../../helpers/all";
|
|
4
|
-
|
|
5
|
-
@include govuk-exports("govuk/component/hint") {
|
|
6
|
-
.govuk-hint {
|
|
7
|
-
@include govuk-font($size: 19);
|
|
8
|
-
|
|
9
|
-
display: block;
|
|
10
|
-
|
|
11
|
-
margin-bottom: govuk-spacing(3);
|
|
12
|
-
|
|
13
|
-
color: $govuk-secondary-text-colour;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
// Reduces margin-bottom of hint when used after the default label (no class)
|
|
17
|
-
// or govuk-label--s for better vertical alignment.
|
|
18
|
-
|
|
19
|
-
// This adjustment will not work when the label is inside the <h1>, however it
|
|
20
|
-
// is unlikely that the default or govuk-label--s class would be used in this
|
|
21
|
-
// case.
|
|
22
|
-
|
|
23
|
-
// This adjustment will not work in browsers that do not support :not().
|
|
24
|
-
// Users with these browsers will see the default size margin (5px larger).
|
|
25
|
-
|
|
26
|
-
.govuk-label:not(.govuk-label--m):not(.govuk-label--l):not(.govuk-label--xl) + .govuk-hint {
|
|
27
|
-
margin-bottom: govuk-spacing(2);
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
// Reduces margin-bottom of hint when used after the default legend (no class)
|
|
31
|
-
// or govuk-fieldset__legend--s for better vertical alignment.
|
|
32
|
-
|
|
33
|
-
// This adjustment will not work when the legend is outside the <h1>, however
|
|
34
|
-
// it is unlikely that the default or govuk-fieldset__legend--s class would be
|
|
35
|
-
// used in this case.
|
|
36
|
-
|
|
37
|
-
// This adjustment will not work in browsers that do not support :not().
|
|
38
|
-
// Users with these browsers will see the default size margin (5px larger).
|
|
39
|
-
|
|
40
|
-
.govuk-fieldset__legend:not(.govuk-fieldset__legend--m):not(.govuk-fieldset__legend--l):not(.govuk-fieldset__legend--xl) + .govuk-hint {
|
|
41
|
-
margin-bottom: govuk-spacing(2);
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
// Reduces visual spacing of legend when there is a hint
|
|
45
|
-
|
|
46
|
-
.govuk-fieldset__legend + .govuk-hint,
|
|
47
|
-
.govuk-fieldset__legend + .govuk-hint {
|
|
48
|
-
margin-top: -(govuk-spacing(1));
|
|
49
|
-
}
|
|
50
|
-
}
|
|
1
|
+
@import "../../base";
|
|
2
|
+
@import "./index";
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
@include govuk-exports("govuk/component/hint") {
|
|
2
|
+
.govuk-hint {
|
|
3
|
+
@include govuk-font($size: 19);
|
|
4
|
+
|
|
5
|
+
display: block;
|
|
6
|
+
|
|
7
|
+
margin-bottom: govuk-spacing(3);
|
|
8
|
+
|
|
9
|
+
color: $govuk-secondary-text-colour;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
// Reduces margin-bottom of hint when used after the default label (no class)
|
|
13
|
+
// or govuk-label--s for better vertical alignment.
|
|
14
|
+
|
|
15
|
+
// This adjustment will not work when the label is inside the <h1>, however it
|
|
16
|
+
// is unlikely that the default or govuk-label--s class would be used in this
|
|
17
|
+
// case.
|
|
18
|
+
|
|
19
|
+
// This adjustment will not work in browsers that do not support :not().
|
|
20
|
+
// Users with these browsers will see the default size margin (5px larger).
|
|
21
|
+
|
|
22
|
+
.govuk-label:not(.govuk-label--m):not(.govuk-label--l):not(.govuk-label--xl) + .govuk-hint {
|
|
23
|
+
margin-bottom: govuk-spacing(2);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
// Reduces margin-bottom of hint when used after the default legend (no class)
|
|
27
|
+
// or govuk-fieldset__legend--s for better vertical alignment.
|
|
28
|
+
|
|
29
|
+
// This adjustment will not work when the legend is outside the <h1>, however
|
|
30
|
+
// it is unlikely that the default or govuk-fieldset__legend--s class would be
|
|
31
|
+
// used in this case.
|
|
32
|
+
|
|
33
|
+
// This adjustment will not work in browsers that do not support :not().
|
|
34
|
+
// Users with these browsers will see the default size margin (5px larger).
|
|
35
|
+
|
|
36
|
+
.govuk-fieldset__legend:not(.govuk-fieldset__legend--m):not(.govuk-fieldset__legend--l):not(.govuk-fieldset__legend--xl) + .govuk-hint {
|
|
37
|
+
margin-bottom: govuk-spacing(2);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
// Reduces visual spacing of legend when there is a hint
|
|
41
|
+
|
|
42
|
+
.govuk-fieldset__legend + .govuk-hint,
|
|
43
|
+
.govuk-fieldset__legend + .govuk-hint {
|
|
44
|
+
margin-top: -(govuk-spacing(1));
|
|
45
|
+
}
|
|
46
|
+
}
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
@import "../error-message/index";
|
|
2
|
+
@import "../hint/index";
|
|
3
|
+
@import "../label/index";
|
|
4
|
+
|
|
5
|
+
@include govuk-exports("govuk/component/input") {
|
|
6
|
+
.govuk-input {
|
|
7
|
+
@include govuk-font($size: 19);
|
|
8
|
+
|
|
9
|
+
box-sizing: border-box;
|
|
10
|
+
width: 100%;
|
|
11
|
+
height: 40px;
|
|
12
|
+
@if $govuk-typography-use-rem {
|
|
13
|
+
height: govuk-px-to-rem(40px);
|
|
14
|
+
}
|
|
15
|
+
margin-top: 0;
|
|
16
|
+
|
|
17
|
+
padding: govuk-spacing(1);
|
|
18
|
+
// setting any background-color makes text invisible when changing colours to dark backgrounds in Firefox (https://bugzilla.mozilla.org/show_bug.cgi?id=1335476)
|
|
19
|
+
// as background-color and color need to always be set together, color should not be set either
|
|
20
|
+
border: $govuk-border-width-form-element solid $govuk-input-border-colour;
|
|
21
|
+
border-radius: 0;
|
|
22
|
+
|
|
23
|
+
// Disable inner shadow and remove rounded corners
|
|
24
|
+
-webkit-appearance: none;
|
|
25
|
+
-moz-appearance: none;
|
|
26
|
+
appearance: none;
|
|
27
|
+
|
|
28
|
+
&:focus {
|
|
29
|
+
outline: $govuk-focus-width solid $govuk-focus-colour;
|
|
30
|
+
// Ensure outline appears outside of the element
|
|
31
|
+
outline-offset: 0;
|
|
32
|
+
// Double the border by adding its width again. Use `box-shadow` for this // instead of changing `border-width` - this is for consistency with
|
|
33
|
+
// components such as textarea where we avoid changing `border-width` as
|
|
34
|
+
// it will change the element size. Also, `outline` cannot be utilised
|
|
35
|
+
// here as it is already used for the yellow focus state.
|
|
36
|
+
box-shadow: inset 0 0 0 $govuk-border-width-form-element;
|
|
37
|
+
|
|
38
|
+
@include govuk-if-ie8 {
|
|
39
|
+
// IE8 doesn't support `box-shadow` so double the border with
|
|
40
|
+
// `border-width`.
|
|
41
|
+
border-width: $govuk-border-width-form-element * 2;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.govuk-input::-webkit-outer-spin-button,
|
|
47
|
+
.govuk-input::-webkit-inner-spin-button {
|
|
48
|
+
margin: 0;
|
|
49
|
+
-webkit-appearance: none;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.govuk-input[type="number"] {
|
|
53
|
+
-moz-appearance: textfield;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.govuk-input--error {
|
|
57
|
+
border: $govuk-border-width-form-element-error solid $govuk-error-colour;
|
|
58
|
+
|
|
59
|
+
&:focus {
|
|
60
|
+
border-color: $govuk-input-border-colour;
|
|
61
|
+
// Remove `box-shadow` inherited from `:focus` as `input--error`
|
|
62
|
+
// already has the thicker border.
|
|
63
|
+
box-shadow: none;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
// The ex measurements are based on the number of W's that can fit inside the input
|
|
68
|
+
// Extra space is left on the right hand side to allow for the Safari prefill icon
|
|
69
|
+
// Linear regression estimation based on visual tests: y = 1.76 + 1.81x
|
|
70
|
+
|
|
71
|
+
.govuk-input--width-30 {
|
|
72
|
+
max-width: 56ex + 3ex;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.govuk-input--width-20 {
|
|
76
|
+
max-width: 38ex + 3ex;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.govuk-input--width-10 {
|
|
80
|
+
max-width: 20ex + 3ex;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.govuk-input--width-5 {
|
|
84
|
+
max-width: 10.8ex;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.govuk-input--width-4 {
|
|
88
|
+
max-width: 9ex;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.govuk-input--width-3 {
|
|
92
|
+
max-width: 7.2ex;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
.govuk-input--width-2 {
|
|
96
|
+
max-width: 5.4ex;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
}
|
|
@@ -1,103 +1,2 @@
|
|
|
1
|
-
@import "../../
|
|
2
|
-
@import "
|
|
3
|
-
@import "../../helpers/all";
|
|
4
|
-
|
|
5
|
-
@import "../error-message/error-message";
|
|
6
|
-
@import "../hint/hint";
|
|
7
|
-
@import "../label/label";
|
|
8
|
-
|
|
9
|
-
@include govuk-exports("govuk/component/input") {
|
|
10
|
-
.govuk-input {
|
|
11
|
-
@include govuk-font($size: 19);
|
|
12
|
-
|
|
13
|
-
box-sizing: border-box;
|
|
14
|
-
width: 100%;
|
|
15
|
-
height: 40px;
|
|
16
|
-
@if $govuk-typography-use-rem {
|
|
17
|
-
height: govuk-px-to-rem(40px);
|
|
18
|
-
}
|
|
19
|
-
margin-top: 0;
|
|
20
|
-
|
|
21
|
-
padding: govuk-spacing(1);
|
|
22
|
-
// setting any background-color makes text invisible when changing colours to dark backgrounds in Firefox (https://bugzilla.mozilla.org/show_bug.cgi?id=1335476)
|
|
23
|
-
// as background-color and color need to always be set together, color should not be set either
|
|
24
|
-
border: $govuk-border-width-form-element solid $govuk-input-border-colour;
|
|
25
|
-
border-radius: 0;
|
|
26
|
-
|
|
27
|
-
// Disable inner shadow and remove rounded corners
|
|
28
|
-
-webkit-appearance: none;
|
|
29
|
-
-moz-appearance: none;
|
|
30
|
-
appearance: none;
|
|
31
|
-
|
|
32
|
-
&:focus {
|
|
33
|
-
outline: $govuk-focus-width solid $govuk-focus-colour;
|
|
34
|
-
// Ensure outline appears outside of the element
|
|
35
|
-
outline-offset: 0;
|
|
36
|
-
// Double the border by adding its width again. Use `box-shadow` for this // instead of changing `border-width` - this is for consistency with
|
|
37
|
-
// components such as textarea where we avoid changing `border-width` as
|
|
38
|
-
// it will change the element size. Also, `outline` cannot be utilised
|
|
39
|
-
// here as it is already used for the yellow focus state.
|
|
40
|
-
box-shadow: inset 0 0 0 $govuk-border-width-form-element;
|
|
41
|
-
|
|
42
|
-
@include govuk-if-ie8 {
|
|
43
|
-
// IE8 doesn't support `box-shadow` so double the border with
|
|
44
|
-
// `border-width`.
|
|
45
|
-
border-width: $govuk-border-width-form-element * 2;
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.govuk-input::-webkit-outer-spin-button,
|
|
51
|
-
.govuk-input::-webkit-inner-spin-button {
|
|
52
|
-
margin: 0;
|
|
53
|
-
-webkit-appearance: none;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
.govuk-input[type="number"] {
|
|
57
|
-
-moz-appearance: textfield;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.govuk-input--error {
|
|
61
|
-
border: $govuk-border-width-form-element-error solid $govuk-error-colour;
|
|
62
|
-
|
|
63
|
-
&:focus {
|
|
64
|
-
border-color: $govuk-input-border-colour;
|
|
65
|
-
// Remove `box-shadow` inherited from `:focus` as `input--error`
|
|
66
|
-
// already has the thicker border.
|
|
67
|
-
box-shadow: none;
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
// The ex measurements are based on the number of W's that can fit inside the input
|
|
72
|
-
// Extra space is left on the right hand side to allow for the Safari prefill icon
|
|
73
|
-
// Linear regression estimation based on visual tests: y = 1.76 + 1.81x
|
|
74
|
-
|
|
75
|
-
.govuk-input--width-30 {
|
|
76
|
-
max-width: 56ex + 3ex;
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
.govuk-input--width-20 {
|
|
80
|
-
max-width: 38ex + 3ex;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
.govuk-input--width-10 {
|
|
84
|
-
max-width: 20ex + 3ex;
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
.govuk-input--width-5 {
|
|
88
|
-
max-width: 10.8ex;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
.govuk-input--width-4 {
|
|
92
|
-
max-width: 9ex;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
.govuk-input--width-3 {
|
|
96
|
-
max-width: 7.2ex;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
.govuk-input--width-2 {
|
|
100
|
-
max-width: 5.4ex;
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
}
|
|
1
|
+
@import "../../base";
|
|
2
|
+
@import "./index";
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
@include govuk-exports("govuk/component/inset-text") {
|
|
2
|
+
.govuk-inset-text {
|
|
3
|
+
@include govuk-font($size: 19);
|
|
4
|
+
@include govuk-text-colour;
|
|
5
|
+
padding: govuk-spacing(3);
|
|
6
|
+
// Margin top intended to collapse
|
|
7
|
+
// This adds an additional 10px to the paragraph above
|
|
8
|
+
@include govuk-responsive-margin(6, "top");
|
|
9
|
+
@include govuk-responsive-margin(6, "bottom");
|
|
10
|
+
|
|
11
|
+
clear: both;
|
|
12
|
+
|
|
13
|
+
border-left: $govuk-border-width-wide solid $govuk-border-colour;
|
|
14
|
+
|
|
15
|
+
> :first-child {
|
|
16
|
+
margin-top: 0;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
> :only-child,
|
|
20
|
+
> :last-child {
|
|
21
|
+
margin-bottom: 0;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
}
|
|
@@ -1,28 +1,2 @@
|
|
|
1
|
-
@import "../../
|
|
2
|
-
@import "
|
|
3
|
-
@import "../../helpers/all";
|
|
4
|
-
|
|
5
|
-
@include govuk-exports("govuk/component/inset-text") {
|
|
6
|
-
.govuk-inset-text {
|
|
7
|
-
@include govuk-font($size: 19);
|
|
8
|
-
@include govuk-text-colour;
|
|
9
|
-
padding: govuk-spacing(3);
|
|
10
|
-
// Margin top intended to collapse
|
|
11
|
-
// This adds an additional 10px to the paragraph above
|
|
12
|
-
@include govuk-responsive-margin(6, "top");
|
|
13
|
-
@include govuk-responsive-margin(6, "bottom");
|
|
14
|
-
|
|
15
|
-
clear: both;
|
|
16
|
-
|
|
17
|
-
border-left: $govuk-border-width-wide solid $govuk-border-colour;
|
|
18
|
-
|
|
19
|
-
> :first-child {
|
|
20
|
-
margin-top: 0;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
> :only-child,
|
|
24
|
-
> :last-child {
|
|
25
|
-
margin-bottom: 0;
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
}
|
|
1
|
+
@import "../../base";
|
|
2
|
+
@import "./index";
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
@include govuk-exports("govuk/component/label") {
|
|
2
|
+
.govuk-label {
|
|
3
|
+
@include govuk-font($size: 19);
|
|
4
|
+
@include govuk-text-colour;
|
|
5
|
+
|
|
6
|
+
display: block;
|
|
7
|
+
|
|
8
|
+
margin-bottom: govuk-spacing(1);
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
// Modifiers that make labels look more like their equivalent headings
|
|
12
|
+
|
|
13
|
+
.govuk-label--xl {
|
|
14
|
+
@include govuk-font($size: 48, $weight: bold);
|
|
15
|
+
margin-bottom: govuk-spacing(3);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.govuk-label--l {
|
|
19
|
+
@include govuk-font($size: 36, $weight: bold);
|
|
20
|
+
margin-bottom: govuk-spacing(3);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.govuk-label--m {
|
|
24
|
+
@include govuk-font($size: 24, $weight: bold);
|
|
25
|
+
margin-bottom: govuk-spacing(2);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.govuk-label--s {
|
|
29
|
+
@include govuk-font($size: 19, $weight: bold);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
// When the label is nested inside a heading, override the heading so that it
|
|
33
|
+
// does not have a margin. Effectively we want to be able to treat the heading
|
|
34
|
+
// as if it is not there.
|
|
35
|
+
//
|
|
36
|
+
// This breaks BEM conventions because it exists as a parent of the 'block',
|
|
37
|
+
// so we can't really consider an element.
|
|
38
|
+
.govuk-label-wrapper {
|
|
39
|
+
margin: 0;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
@@ -1,45 +1,2 @@
|
|
|
1
|
-
@import "../../
|
|
2
|
-
@import "
|
|
3
|
-
@import "../../helpers/all";
|
|
4
|
-
|
|
5
|
-
@include govuk-exports("govuk/component/label") {
|
|
6
|
-
.govuk-label {
|
|
7
|
-
@include govuk-font($size: 19);
|
|
8
|
-
@include govuk-text-colour;
|
|
9
|
-
|
|
10
|
-
display: block;
|
|
11
|
-
|
|
12
|
-
margin-bottom: govuk-spacing(1);
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
// Modifiers that make labels look more like their equivalent headings
|
|
16
|
-
|
|
17
|
-
.govuk-label--xl {
|
|
18
|
-
@include govuk-font($size: 48, $weight: bold);
|
|
19
|
-
margin-bottom: govuk-spacing(3);
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
.govuk-label--l {
|
|
23
|
-
@include govuk-font($size: 36, $weight: bold);
|
|
24
|
-
margin-bottom: govuk-spacing(3);
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
.govuk-label--m {
|
|
28
|
-
@include govuk-font($size: 24, $weight: bold);
|
|
29
|
-
margin-bottom: govuk-spacing(2);
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
.govuk-label--s {
|
|
33
|
-
@include govuk-font($size: 19, $weight: bold);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
// When the label is nested inside a heading, override the heading so that it
|
|
37
|
-
// does not have a margin. Effectively we want to be able to treat the heading
|
|
38
|
-
// as if it is not there.
|
|
39
|
-
//
|
|
40
|
-
// This breaks BEM conventions because it exists as a parent of the 'block',
|
|
41
|
-
// so we can't really consider an element.
|
|
42
|
-
.govuk-label-wrapper {
|
|
43
|
-
margin: 0;
|
|
44
|
-
}
|
|
45
|
-
}
|
|
1
|
+
@import "../../base";
|
|
2
|
+
@import "./index";
|