dvla_internal_frontend_toolkit 0.3.2 → 0.3.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.
Files changed (19) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/fonts/dvla-icons.woff +0 -0
  3. data/app/assets/stylesheets/_dvla-internal-elements.scss +1 -0
  4. data/app/assets/stylesheets/constants/_colours.scss +1 -1
  5. data/app/assets/stylesheets/dvla-internal-elements-styles.min.css +1 -1
  6. data/app/assets/stylesheets/elements/_data.scss +18 -0
  7. data/app/assets/stylesheets/elements/_forms.scss +314 -15
  8. data/app/assets/stylesheets/elements/_layout.scss +6 -3
  9. data/app/assets/stylesheets/elements/_navigation.scss +11 -2
  10. data/app/assets/stylesheets/elements/_typography.scss +29 -9
  11. data/app/assets/stylesheets/elements/_validation.scss +1 -0
  12. data/app/assets/stylesheets/styleguide/_styleguide.scss +74 -0
  13. data/app/views/layouts/erb/layout-fluid-tabs-left.html.erb +1 -1
  14. data/app/views/layouts/erb/layout-fluid-tabs-top.html.erb +1 -1
  15. data/app/views/layouts/erb/layout-fluid-tabs.html.erb +2 -2
  16. data/app/views/layouts/nunjucks/layout-fluid-tabs-left.html +1 -1
  17. data/app/views/layouts/nunjucks/layout-fluid-tabs.html +1 -1
  18. data/lib/dvla_internal_frontend_toolkit/version.rb +1 -1
  19. metadata +3 -2
data/app/assets/stylesheets/elements/_navigation.scss CHANGED
@@ -4,7 +4,7 @@
4
4
 
5
5
  ol {
6
6
  list-style-type: none;
7
- padding: 8px 8px 0;
7
+ padding: 16px 8px 0;
8
8
  margin: 0;
9
9
 
10
10
  li {
@@ -68,7 +68,7 @@
68
68
  }
69
69
  }
70
70
 
71
- #side-bar{
71
+ .side-bar{
72
72
  position: fixed;
73
73
  left: 0;
74
74
  width: 280px;
@@ -95,6 +95,15 @@
95
95
  text-decoration: underline;
96
96
  }
97
97
 
98
+ a{
99
+ text-decoration: none;
100
+ color: $primary;
101
+ &:visited{
102
+ text-decoration: none;
103
+ color: $primary;
104
+ }
105
+ }
106
+
98
107
  &:active, &.active{
99
108
  color: $primary;
100
109
  border-left: 8px solid $primary;
data/app/assets/stylesheets/elements/_typography.scss CHANGED
@@ -4,38 +4,47 @@ body {
4
4
  }
5
5
 
6
6
  @mixin heading() {
7
- font-weight: bold;
8
- color: $text-primary-colour;
7
+ font-weight: 500;
8
+ color: $primary;
9
+ margin-top: 1.25em;
10
+ margin-bottom: 0.25em;
9
11
  }
10
12
 
11
13
  h1 {
14
+ @include heading();
12
15
  font-size: 40px;
13
16
  line-height: 48px;
14
- color: $primary;
17
+ letter-spacing: -0.3px;
18
+ margin-top: 1em;
19
+ margin-bottom: 0.2em;
15
20
  }
16
21
 
17
22
  h2 {
23
+ @include heading();
18
24
  font-size: 32px;
19
25
  line-height: 40px;
20
- color: $primary;
26
+ letter-spacing: -0.2px;
21
27
  }
22
28
 
23
29
  h3 {
30
+ @include heading();
24
31
  font-size: 28px;
25
- line-height: 36px;
26
- color: $primary;
32
+ line-height: 32px;
33
+ letter-spacing: -0.1px;
27
34
  }
28
35
 
29
36
  h4 {
37
+ @include heading();
30
38
  font-size: 24px;
31
- line-height: 32px;
32
- color: $primary;
39
+ line-height: 28px;
40
+ letter-spacing: 0;
33
41
  }
34
42
 
35
43
  h5 {
44
+ @include heading();
36
45
  font-size: 20px;
37
46
  line-height: 24px;
38
- color: $primary;
47
+ letter-spacing: 0.1px;
39
48
  }
40
49
 
41
50
  .text-large {
@@ -52,6 +61,17 @@ h5 {
52
61
  font-weight: normal;
53
62
  }
54
63
 
64
+ .lede {
65
+ font-size: 24px;
66
+ line-height: 36px;
67
+ letter-spacing: 0.3px;
68
+ font-weight: normal;
69
+ }
70
+
71
+ h1 + p, h2 + p, h3 + p, h4 + p, h5 + p {
72
+ margin-top: 0;
73
+ }
74
+
55
75
  ul, ol {
56
76
  &.list-bulleted {
57
77
  list-style-type: disc;
data/app/assets/stylesheets/elements/_validation.scss CHANGED
@@ -54,6 +54,7 @@
54
54
  content: '\e90c';
55
55
  color: white;
56
56
  background: $warning;
57
+ padding-left: 2px;
57
58
  }
58
59
  }
59
60
  }
data/app/assets/stylesheets/styleguide/_styleguide.scss CHANGED
@@ -237,3 +237,77 @@ pre.language-markup{
237
237
  }
238
238
  }
239
239
  }
240
+
241
+ .icon-swatch-wrapper{
242
+ margin: 24px 16px;
243
+ display: inline-block;
244
+ width: 20%;
245
+ text-align: center;
246
+ span{
247
+ display: block;
248
+ &.code{
249
+ font-style: italic;
250
+ }
251
+ }
252
+
253
+ .swatch{
254
+ margin: 8px;
255
+ margin-left: 33%;
256
+ width: 60px;
257
+ height: 60px;
258
+ border-radius: 100%;
259
+ // background: $primary-light;
260
+ color: black;
261
+ position: relative;
262
+ padding-top: 18px;
263
+ text-align: center;
264
+ font-family: $icon-font;
265
+ font-size: 24px;
266
+ border: 1px solid $grey-2;
267
+
268
+ &.swatch-add::before{
269
+ content: '\e900';
270
+ }
271
+ &.swatch-calendar::before{
272
+ content: '\e901';
273
+ }
274
+ &.swatch-download::before{
275
+ content: '\e902';
276
+ }
277
+ &.swatch-info::before{
278
+ content: '\e903';
279
+ }
280
+ &.swatch-key::before{
281
+ content: '\e904';
282
+ }
283
+ &.swatch-manufacturer::before{
284
+ content: '\e905';
285
+ }
286
+ &.swatch-refresh::before{
287
+ content: '\e906';
288
+ }
289
+ &.swatch-retrospective-registration::before{
290
+ content: '\e907';
291
+ }
292
+ &.swatch-search::before{
293
+ content: '\e908';
294
+ }
295
+ &.swatch-tag::before{
296
+ content: '\e909';
297
+ }
298
+ &.swatch-tick::before{
299
+ content: '\e90a';
300
+ }
301
+ &.swatch-user::before{
302
+ content: '\e90b';
303
+ }
304
+ &.swatch-warning::before{
305
+ content: '\e90c';
306
+ }
307
+ }
308
+
309
+ }
310
+
311
+ .btn-pushdown{
312
+ margin-top: 8px;
313
+ }
data/app/views/layouts/erb/layout-fluid-tabs-left.html.erb CHANGED
@@ -34,7 +34,7 @@
34
34
  <main id="content">
35
35
  <div id="side-bar">
36
36
  <% if content_for?(:tabs_left) %>
37
- <% yield :tabs_left %>
37
+ <%= yield :tabs_left %>
38
38
  <% else %>
39
39
  <ul>
40
40
  <li>Tab title one</li>
data/app/views/layouts/erb/layout-fluid-tabs-top.html.erb CHANGED
@@ -28,7 +28,7 @@
28
28
  </div>
29
29
  </div>
30
30
  <% if content_for?(:tabs_top) %>
31
- <% yield :tabs_top %>
31
+ <%= yield :tabs_top %>
32
32
  <% else %>
33
33
  <ul>
34
34
  <li>Tab title one</li>
data/app/views/layouts/erb/layout-fluid-tabs.html.erb CHANGED
@@ -28,7 +28,7 @@
28
28
  </div>
29
29
  </div>
30
30
  <% if content_for?(:tabs_top) %>
31
- <% yield :tabs_top %>
31
+ <%= yield :tabs_top %>
32
32
  <% else %>
33
33
  <ul>
34
34
  <li>Tab title one</li>
@@ -44,7 +44,7 @@
44
44
  <main id="content">
45
45
  <div id="side-bar">
46
46
  <% if content_for?(:tabs_left) %>
47
- <% yield :tabs_left %>
47
+ <%= yield :tabs_left %>
48
48
  <% else %>
49
49
  <ul>
50
50
  <li>Tab title one</li>
data/app/views/layouts/nunjucks/layout-fluid-tabs-left.html CHANGED
@@ -34,7 +34,7 @@
34
34
  {% endblock %}
35
35
 
36
36
  <main id="content">
37
- <div id="side-bar">
37
+ <div class="side-bar">
38
38
  {% block tabs_left %}
39
39
  <ul>
40
40
  <li>Tab title one</li>
data/app/views/layouts/nunjucks/layout-fluid-tabs.html CHANGED
@@ -41,7 +41,7 @@
41
41
  {% endblock %}
42
42
 
43
43
  <main id="content">
44
- <div id="side-bar">
44
+ <div class="side-bar">
45
45
  {% block tabs_left %}
46
46
  <ul>
47
47
  <li>Tab title one</li>
data/lib/dvla_internal_frontend_toolkit/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module DvlaInternalFrontendToolkit
2
- VERSION = "0.3.2"
2
+ VERSION = "0.3.3"
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: dvla_internal_frontend_toolkit
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.3.2
4
+ version: 0.3.3
5
5
  platform: ruby
6
6
  authors:
7
7
  - Liam Betsworth
@@ -10,7 +10,7 @@ authors:
10
10
  autorequire:
11
11
  bindir: exe
12
12
  cert_chain: []
13
- date: 2017-10-19 00:00:00.000000000 Z
13
+ date: 2017-10-25 00:00:00.000000000 Z
14
14
  dependencies:
15
15
  - !ruby/object:Gem::Dependency
16
16
  name: railties
@@ -79,6 +79,7 @@ files:
79
79
  - app/assets/stylesheets/dvla-internal-elements-styles.min.css
80
80
  - app/assets/stylesheets/dvla-internal-elements-styles.scss
81
81
  - app/assets/stylesheets/elements/_buttons.scss
82
+ - app/assets/stylesheets/elements/_data.scss
82
83
  - app/assets/stylesheets/elements/_forms.scss
83
84
  - app/assets/stylesheets/elements/_layout.scss
84
85
  - app/assets/stylesheets/elements/_lists.scss