govuk_elements_rails 3.1.2 → 3.1.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +33 -26
- data/vendor/assets/stylesheets/elements/_details.scss +38 -3
- data/vendor/assets/stylesheets/elements/_elements-typography.scss +4 -0
- data/vendor/assets/stylesheets/elements/_forms.scss +10 -0
- data/vendor/assets/stylesheets/elements/forms/_form-validation.scss +1 -0
- metadata +5 -5
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 6cb7e24707e0534aa3a4ec8fd685fdece120b47e
|
4
|
+
data.tar.gz: 70931c278192344e600cf18aa3e64633a31e1ebe
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: b99ee900c45b45ea6af9126696e62998b8fcaea2dfa0bc1c06bdbbe69afc635636e32d8b45bc9023c0ac8c6915a29bd536f2e043c774ae65998f4112c363c21d
|
7
|
+
data.tar.gz: a64a98535b9f4487a634856e50b313f8d7175aafe3163dc3e742a3f646dd8578fa38ae82d5d6172d91f998a707d991b0c880686cb24d11ca6f3bbc9e72977270
|
data/README.md
CHANGED
@@ -48,14 +48,14 @@ For detailed information on usage see the
|
|
48
48
|
|
49
49
|
### Stylesheets usage
|
50
50
|
|
51
|
-
At the top of
|
52
|
-
|
51
|
+
At the top of your projects main stylesheet you should use `@import` rules to
|
52
|
+
include the files that you require.
|
53
53
|
|
54
|
-
|
55
|
-
|
54
|
+
If you are using the `scss` format instead of `sass` you will need to add
|
55
|
+
semicolons and reformat the comments.
|
56
56
|
|
57
57
|
```sass
|
58
|
-
//
|
58
|
+
// GOV.UK Frontend Toolkit (alphagov/govuk_frontend_toolkit)
|
59
59
|
@import 'colours'
|
60
60
|
@import 'font_stack'
|
61
61
|
@import 'measurements'
|
@@ -69,31 +69,38 @@ lines if you are using the `scss` format instead of `sass`:
|
|
69
69
|
@import 'design-patterns/buttons'
|
70
70
|
@import 'design-patterns/breadcrumbs'
|
71
71
|
|
72
|
-
//
|
73
|
-
|
74
|
-
|
72
|
+
// GOV.UK elements (alphagov/govuk_elements)
|
73
|
+
|
74
|
+
// Helper functions and classes
|
75
|
+
@import "elements/helpers"
|
76
|
+
|
77
|
+
// Generic (normalize/reset.css)
|
78
|
+
@import "elements/reset"
|
75
79
|
|
76
80
|
// Base (unclassed HTML elements)
|
77
81
|
// These are predefined by govuk_template
|
78
82
|
// If you're not using govuk_template, uncomment the line below.
|
79
|
-
//
|
80
|
-
|
81
|
-
|
82
|
-
@import
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
@import
|
87
|
-
|
88
|
-
@import
|
89
|
-
@import
|
90
|
-
@import
|
91
|
-
@import
|
92
|
-
@import
|
93
|
-
@import
|
94
|
-
@import
|
95
|
-
@import
|
96
|
-
@import
|
83
|
+
// @import "elements/govuk-template-base"
|
84
|
+
|
85
|
+
// Main content container. Grid layout - rows and column widths
|
86
|
+
@import "elements/layout"
|
87
|
+
|
88
|
+
// Components (chunks of UI)
|
89
|
+
@import "elements/elements-typography"
|
90
|
+
@import "elements/buttons"
|
91
|
+
@import "elements/icons"
|
92
|
+
@import "elements/lists"
|
93
|
+
@import "elements/tables"
|
94
|
+
@import "elements/details"
|
95
|
+
@import "elements/panels"
|
96
|
+
@import "elements/forms"
|
97
|
+
@import "elements/forms/form-multiple-choice"
|
98
|
+
@import "elements/forms/form-date"
|
99
|
+
@import "elements/forms/form-validation"
|
100
|
+
@import "elements/breadcrumbs"
|
101
|
+
@import "elements/phase-banner"
|
102
|
+
@import "elements/components"
|
103
|
+
@import "elements/shame"
|
97
104
|
```
|
98
105
|
|
99
106
|
For further detailed information on usage see the
|
@@ -11,6 +11,25 @@ details {
|
|
11
11
|
cursor: pointer;
|
12
12
|
position: relative;
|
13
13
|
margin-bottom: em(5);
|
14
|
+
padding-left: 25px;
|
15
|
+
|
16
|
+
&:before {
|
17
|
+
content: "";
|
18
|
+
position: absolute;
|
19
|
+
top: 0;
|
20
|
+
bottom: 0;
|
21
|
+
left: 0;
|
22
|
+
margin: auto;
|
23
|
+
display: block;
|
24
|
+
width: 0;
|
25
|
+
height: 0;
|
26
|
+
border-style: solid;
|
27
|
+
border-color: transparent;
|
28
|
+
-webkit-clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
|
29
|
+
clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
|
30
|
+
border-width: 7px 0 7px 12.124px;
|
31
|
+
border-left-color: inherit;
|
32
|
+
}
|
14
33
|
|
15
34
|
&:hover {
|
16
35
|
color: $link-hover-colour;
|
@@ -19,6 +38,23 @@ details {
|
|
19
38
|
&:focus {
|
20
39
|
outline: 3px solid $focus-colour;
|
21
40
|
}
|
41
|
+
|
42
|
+
&::-webkit-details-marker {
|
43
|
+
display: none;
|
44
|
+
}
|
45
|
+
|
46
|
+
}
|
47
|
+
|
48
|
+
&[open]>summary:before {
|
49
|
+
display: block;
|
50
|
+
width: 0;
|
51
|
+
height: 0;
|
52
|
+
border-style: solid;
|
53
|
+
border-color: transparent;
|
54
|
+
-webkit-clip-path: polygon(0% 0%, 50% 100%, 100% 0%);
|
55
|
+
clip-path: polygon(0% 0%, 50% 100%, 100% 0%);
|
56
|
+
border-width: 12.124px 7px 0 7px;
|
57
|
+
border-top-color: inherit;
|
22
58
|
}
|
23
59
|
|
24
60
|
// Underline only summary text (not the arrow)
|
@@ -26,10 +62,9 @@ details {
|
|
26
62
|
text-decoration: underline;
|
27
63
|
}
|
28
64
|
|
29
|
-
//
|
65
|
+
// fallback no longer needed
|
30
66
|
.arrow {
|
31
|
-
|
32
|
-
font-style: normal;
|
67
|
+
display: none;
|
33
68
|
}
|
34
69
|
|
35
70
|
}
|
@@ -72,6 +72,7 @@ main {
|
|
72
72
|
.heading-xlarge {
|
73
73
|
@include bold-48();
|
74
74
|
|
75
|
+
display: block;
|
75
76
|
margin-top: em(15, 32);
|
76
77
|
margin-bottom: em(30, 32);
|
77
78
|
|
@@ -92,6 +93,7 @@ main {
|
|
92
93
|
.heading-large {
|
93
94
|
@include bold-36();
|
94
95
|
|
96
|
+
display: block;
|
95
97
|
margin-top: em(25, 24);
|
96
98
|
margin-bottom: em(10, 24);
|
97
99
|
|
@@ -112,6 +114,7 @@ main {
|
|
112
114
|
.heading-medium {
|
113
115
|
@include bold-24();
|
114
116
|
|
117
|
+
display: block;
|
115
118
|
margin-top: em(25, 20);
|
116
119
|
margin-bottom: em(10, 20);
|
117
120
|
|
@@ -125,6 +128,7 @@ main {
|
|
125
128
|
.heading-small {
|
126
129
|
@include bold-19();
|
127
130
|
|
131
|
+
display: block;
|
128
132
|
margin-top: em(10, 16);
|
129
133
|
margin-bottom: em(5, 16);
|
130
134
|
|
@@ -18,6 +18,16 @@
|
|
18
18
|
fieldset {
|
19
19
|
@extend %contain-floats;
|
20
20
|
width: 100%;
|
21
|
+
|
22
|
+
// Avoid extra vertical space (caused by fieldsets preventing margin collapse) when fieldsets with an h1 in the legend appear after the error-summary element.
|
23
|
+
// (Class used instead of adjacent sibling selector for IE 8 compatibility.)
|
24
|
+
&.after-error-summary {
|
25
|
+
margin-top: -$gutter-half;
|
26
|
+
|
27
|
+
@include media(tablet) {
|
28
|
+
margin-top: -$gutter;
|
29
|
+
}
|
30
|
+
}
|
21
31
|
}
|
22
32
|
|
23
33
|
// Hack to let legends or elements within legends have margins in webkit browsers
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: govuk_elements_rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 3.1.
|
4
|
+
version: 3.1.3
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- GOV.UK Design System Team (Government Digital Service)
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date:
|
11
|
+
date: 2018-07-17 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: rails
|
@@ -53,8 +53,8 @@ dependencies:
|
|
53
53
|
- !ruby/object:Gem::Version
|
54
54
|
version: 6.0.2
|
55
55
|
description: |-
|
56
|
-
A gem wrapper around govuk_elements v3.1.
|
57
|
-
that pulls stylesheet and javascript files into a Rails app. Changelog: https://github.com/alphagov/govuk_elements/blob/
|
56
|
+
A gem wrapper around govuk_elements v3.1.3
|
57
|
+
that pulls stylesheet and javascript files into a Rails app. Changelog: https://github.com/alphagov/govuk_elements/blob/3a7f21838d7849d90434731488e1a0f0f209250d
|
58
58
|
/CHANGELOG.md
|
59
59
|
email: design-system-developers@digital.cabinet-office.gov.uk
|
60
60
|
executables: []
|
@@ -108,7 +108,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
108
108
|
version: '0'
|
109
109
|
requirements: []
|
110
110
|
rubyforge_project:
|
111
|
-
rubygems_version: 2.
|
111
|
+
rubygems_version: 2.5.1
|
112
112
|
signing_key:
|
113
113
|
specification_version: 4
|
114
114
|
summary: A gem wrapper around http://github.com/alphagov/govuk_elements that pulls
|