govuk_template 0.11.0 → 0.12.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.
Files changed (8) hide show
  1. data/README.md +13 -0
  2. data/app/assets/stylesheets/govuk-template-ie6.css.erb +59 -36
  3. data/app/assets/stylesheets/govuk-template-ie7.css.erb +59 -36
  4. data/app/assets/stylesheets/govuk-template-ie8.css.erb +53 -33
  5. data/app/assets/stylesheets/govuk-template.css.erb +61 -36
  6. data/app/views/layouts/govuk_template.html.erb +2 -0
  7. data/lib/govuk_template/version.rb +1 -1
  8. metadata +4 -4
data/README.md CHANGED
@@ -121,6 +121,19 @@ You can get a propositional title and navigation by setting the content for `hea
121
121
 
122
122
  This will then create a navigation block which is shown on desktop sized devices but collapsed down on smaller screens.
123
123
 
124
+ For menus with only one item, the collapsible functionality is not necessary, it is recommended that you use the following markup
125
+
126
+ <div class='header-proposition'>
127
+ <div class='content'>
128
+ <nav id='proposition-menu'>
129
+ <a href='/' id='proposition-name'>Service Name</a>
130
+ <p id='proposition-link'>
131
+ <a href='url-to-page-1'>Navigation item #1</a>
132
+ </p>
133
+ </nav>
134
+ </div>
135
+ </div>
136
+
124
137
  ## Contributing
125
138
 
126
139
  Please follow the [contribution guidelines](https://github.com/alphagov/govuk_template/blob/master/CONTRIBUTING.md).
data/app/assets/stylesheets/govuk-template-ie6.css.erb CHANGED
@@ -27,9 +27,11 @@
27
27
  @-o-viewport {
28
28
  width: device-width; }
29
29
 
30
- #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
30
+ #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-link,
31
+ #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
31
32
  zoom: 1; }
32
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
33
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
34
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
33
35
  content: "";
34
36
  display: block;
35
37
  clear: both; }
@@ -40,9 +42,11 @@
40
42
  @-o-viewport {
41
43
  width: device-width; }
42
44
 
43
- #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
45
+ #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-link,
46
+ #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
44
47
  zoom: 1; }
45
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
48
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
49
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
46
50
  content: "";
47
51
  display: block;
48
52
  clear: both; }
@@ -303,9 +307,11 @@ button:focus,
303
307
  @-o-viewport {
304
308
  width: device-width; }
305
309
 
306
- #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
310
+ #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-link,
311
+ #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
307
312
  zoom: 1; }
308
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
313
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
314
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
309
315
  content: "";
310
316
  display: block;
311
317
  clear: both; }
@@ -430,15 +436,19 @@ button:focus,
430
436
  margin-top: 5px; }
431
437
  #global-header .header-proposition #proposition-menu.no-proposition-name {
432
438
  margin-top: 37px; }
439
+ #global-header .header-proposition #proposition-link,
433
440
  #global-header .header-proposition #proposition-links {
434
441
  clear: both;
435
442
  margin: 2px 0 0 0;
436
443
  padding: 0; }
437
- .js-enabled #global-header .header-proposition #proposition-links {
444
+ .js-enabled #global-header .header-proposition #proposition-link, .js-enabled
445
+ #global-header .header-proposition #proposition-links {
438
446
  display: none;
439
447
  display: block; }
440
- .js-enabled #global-header .header-proposition #proposition-links.js-visible {
448
+ .js-enabled #global-header .header-proposition #proposition-link.js-visible, .js-enabled
449
+ #global-header .header-proposition #proposition-links.js-visible {
441
450
  display: block; }
451
+ #global-header .header-proposition #proposition-link li,
442
452
  #global-header .header-proposition #proposition-links li {
443
453
  float: left;
444
454
  width: 50%;
@@ -448,36 +458,49 @@ button:focus,
448
458
  width: auto;
449
459
  padding: 0 15px 0 0;
450
460
  border-bottom: 0; }
461
+ #global-header .header-proposition #proposition-link li.clear-child,
451
462
  #global-header .header-proposition #proposition-links li.clear-child {
452
463
  clear: left; }
453
- #global-header .header-proposition #proposition-links li a {
454
- color: white;
455
- text-decoration: none;
456
- font-family: "nta", Arial, sans-serif;
457
- font-size: 14px;
458
- line-height: 1.42857;
459
- font-weight: 700;
460
- text-transform: none;
461
- font-family: "nta", Arial, sans-serif;
462
- font-size: 16px;
463
- line-height: 1.25;
464
- font-weight: 700;
465
- text-transform: none;
466
- line-height: 23px; }
467
- @media (max-width: 640px) {
468
- #global-header .header-proposition #proposition-links li a {
469
- font-size: 12px;
470
- line-height: 1.25; } }
471
- @media (max-width: 640px) {
472
- #global-header .header-proposition #proposition-links li a {
473
- font-size: 14px;
474
- line-height: 1.14286; } }
475
- #global-header .header-proposition #proposition-links li a:hover {
476
- text-decoration: underline; }
477
- #global-header .header-proposition #proposition-links li a.active {
478
- color: #1d8feb; }
479
- #global-header .header-proposition #proposition-links li a:focus {
480
- color: #0b0c0c; }
464
+ #global-header .header-proposition #proposition-link a,
465
+ #global-header .header-proposition #proposition-links a {
466
+ color: white;
467
+ text-decoration: none;
468
+ font-family: "nta", Arial, sans-serif;
469
+ font-size: 14px;
470
+ line-height: 1.42857;
471
+ font-weight: 700;
472
+ text-transform: none;
473
+ font-family: "nta", Arial, sans-serif;
474
+ font-size: 16px;
475
+ line-height: 1.25;
476
+ font-weight: 700;
477
+ text-transform: none;
478
+ line-height: 23px; }
479
+ @media (max-width: 640px) {
480
+ #global-header .header-proposition #proposition-link a,
481
+ #global-header .header-proposition #proposition-links a {
482
+ font-size: 12px;
483
+ line-height: 1.25; } }
484
+ @media (max-width: 640px) {
485
+ #global-header .header-proposition #proposition-link a,
486
+ #global-header .header-proposition #proposition-links a {
487
+ font-size: 14px;
488
+ line-height: 1.14286; } }
489
+ #global-header .header-proposition #proposition-link a:hover,
490
+ #global-header .header-proposition #proposition-links a:hover {
491
+ text-decoration: underline; }
492
+ #global-header .header-proposition #proposition-link a.active,
493
+ #global-header .header-proposition #proposition-links a.active {
494
+ color: #1d8feb; }
495
+ #global-header .header-proposition #proposition-link a:focus,
496
+ #global-header .header-proposition #proposition-links a:focus {
497
+ color: #0b0c0c; }
498
+ #global-header .header-proposition #proposition-link {
499
+ float: right;
500
+ line-height: 22px;
501
+ float: none; }
502
+ .js-enabled #global-header .header-proposition #proposition-link {
503
+ display: block; }
481
504
 
482
505
  /* Global header bar */
483
506
  #global-header-bar {
data/app/assets/stylesheets/govuk-template-ie7.css.erb CHANGED
@@ -27,9 +27,11 @@
27
27
  @-o-viewport {
28
28
  width: device-width; }
29
29
 
30
- #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
30
+ #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-link,
31
+ #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
31
32
  zoom: 1; }
32
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
33
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
34
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
33
35
  content: "";
34
36
  display: block;
35
37
  clear: both; }
@@ -40,9 +42,11 @@
40
42
  @-o-viewport {
41
43
  width: device-width; }
42
44
 
43
- #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
45
+ #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-link,
46
+ #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
44
47
  zoom: 1; }
45
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
48
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
49
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
46
50
  content: "";
47
51
  display: block;
48
52
  clear: both; }
@@ -303,9 +307,11 @@ button:focus,
303
307
  @-o-viewport {
304
308
  width: device-width; }
305
309
 
306
- #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
310
+ #global-header .header-wrapper, #global-header .header-wrapper .header-global, #global-header .header-wrapper .header-global .header-logo, #global-header .header-proposition #proposition-link,
311
+ #global-header .header-proposition #proposition-links, #global-header-bar, #global-cookie-message .outer-block, #footer .footer-wrapper, #footer .footer-meta {
307
312
  zoom: 1; }
308
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
313
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
314
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
309
315
  content: "";
310
316
  display: block;
311
317
  clear: both; }
@@ -430,15 +436,19 @@ button:focus,
430
436
  margin-top: 5px; }
431
437
  #global-header .header-proposition #proposition-menu.no-proposition-name {
432
438
  margin-top: 37px; }
439
+ #global-header .header-proposition #proposition-link,
433
440
  #global-header .header-proposition #proposition-links {
434
441
  clear: both;
435
442
  margin: 2px 0 0 0;
436
443
  padding: 0; }
437
- .js-enabled #global-header .header-proposition #proposition-links {
444
+ .js-enabled #global-header .header-proposition #proposition-link, .js-enabled
445
+ #global-header .header-proposition #proposition-links {
438
446
  display: none;
439
447
  display: block; }
440
- .js-enabled #global-header .header-proposition #proposition-links.js-visible {
448
+ .js-enabled #global-header .header-proposition #proposition-link.js-visible, .js-enabled
449
+ #global-header .header-proposition #proposition-links.js-visible {
441
450
  display: block; }
451
+ #global-header .header-proposition #proposition-link li,
442
452
  #global-header .header-proposition #proposition-links li {
443
453
  float: left;
444
454
  width: 50%;
@@ -448,36 +458,49 @@ button:focus,
448
458
  width: auto;
449
459
  padding: 0 15px 0 0;
450
460
  border-bottom: 0; }
461
+ #global-header .header-proposition #proposition-link li.clear-child,
451
462
  #global-header .header-proposition #proposition-links li.clear-child {
452
463
  clear: left; }
453
- #global-header .header-proposition #proposition-links li a {
454
- color: white;
455
- text-decoration: none;
456
- font-family: "nta", Arial, sans-serif;
457
- font-size: 14px;
458
- line-height: 1.42857;
459
- font-weight: 700;
460
- text-transform: none;
461
- font-family: "nta", Arial, sans-serif;
462
- font-size: 16px;
463
- line-height: 1.25;
464
- font-weight: 700;
465
- text-transform: none;
466
- line-height: 23px; }
467
- @media (max-width: 640px) {
468
- #global-header .header-proposition #proposition-links li a {
469
- font-size: 12px;
470
- line-height: 1.25; } }
471
- @media (max-width: 640px) {
472
- #global-header .header-proposition #proposition-links li a {
473
- font-size: 14px;
474
- line-height: 1.14286; } }
475
- #global-header .header-proposition #proposition-links li a:hover {
476
- text-decoration: underline; }
477
- #global-header .header-proposition #proposition-links li a.active {
478
- color: #1d8feb; }
479
- #global-header .header-proposition #proposition-links li a:focus {
480
- color: #0b0c0c; }
464
+ #global-header .header-proposition #proposition-link a,
465
+ #global-header .header-proposition #proposition-links a {
466
+ color: white;
467
+ text-decoration: none;
468
+ font-family: "nta", Arial, sans-serif;
469
+ font-size: 14px;
470
+ line-height: 1.42857;
471
+ font-weight: 700;
472
+ text-transform: none;
473
+ font-family: "nta", Arial, sans-serif;
474
+ font-size: 16px;
475
+ line-height: 1.25;
476
+ font-weight: 700;
477
+ text-transform: none;
478
+ line-height: 23px; }
479
+ @media (max-width: 640px) {
480
+ #global-header .header-proposition #proposition-link a,
481
+ #global-header .header-proposition #proposition-links a {
482
+ font-size: 12px;
483
+ line-height: 1.25; } }
484
+ @media (max-width: 640px) {
485
+ #global-header .header-proposition #proposition-link a,
486
+ #global-header .header-proposition #proposition-links a {
487
+ font-size: 14px;
488
+ line-height: 1.14286; } }
489
+ #global-header .header-proposition #proposition-link a:hover,
490
+ #global-header .header-proposition #proposition-links a:hover {
491
+ text-decoration: underline; }
492
+ #global-header .header-proposition #proposition-link a.active,
493
+ #global-header .header-proposition #proposition-links a.active {
494
+ color: #1d8feb; }
495
+ #global-header .header-proposition #proposition-link a:focus,
496
+ #global-header .header-proposition #proposition-links a:focus {
497
+ color: #0b0c0c; }
498
+ #global-header .header-proposition #proposition-link {
499
+ float: right;
500
+ line-height: 22px;
501
+ float: none; }
502
+ .js-enabled #global-header .header-proposition #proposition-link {
503
+ display: block; }
481
504
 
482
505
  /* Global header bar */
483
506
  #global-header-bar {
data/app/assets/stylesheets/govuk-template-ie8.css.erb CHANGED
@@ -27,7 +27,8 @@
27
27
  @-o-viewport {
28
28
  width: device-width; }
29
29
 
30
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
30
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
31
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
31
32
  content: "";
32
33
  display: block;
33
34
  clear: both; }
@@ -38,7 +39,8 @@
38
39
  @-o-viewport {
39
40
  width: device-width; }
40
41
 
41
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
42
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
43
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
42
44
  content: "";
43
45
  display: block;
44
46
  clear: both; }
@@ -294,7 +296,8 @@ button:focus,
294
296
  @-o-viewport {
295
297
  width: device-width; }
296
298
 
297
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
299
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
300
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
298
301
  content: "";
299
302
  display: block;
300
303
  clear: both; }
@@ -419,15 +422,19 @@ button:focus,
419
422
  margin-top: 5px; }
420
423
  #global-header .header-proposition #proposition-menu.no-proposition-name {
421
424
  margin-top: 37px; }
425
+ #global-header .header-proposition #proposition-link,
422
426
  #global-header .header-proposition #proposition-links {
423
427
  clear: both;
424
428
  margin: 2px 0 0 0;
425
429
  padding: 0; }
426
- .js-enabled #global-header .header-proposition #proposition-links {
430
+ .js-enabled #global-header .header-proposition #proposition-link, .js-enabled
431
+ #global-header .header-proposition #proposition-links {
427
432
  display: none;
428
433
  display: block; }
429
- .js-enabled #global-header .header-proposition #proposition-links.js-visible {
434
+ .js-enabled #global-header .header-proposition #proposition-link.js-visible, .js-enabled
435
+ #global-header .header-proposition #proposition-links.js-visible {
430
436
  display: block; }
437
+ #global-header .header-proposition #proposition-link li,
431
438
  #global-header .header-proposition #proposition-links li {
432
439
  float: left;
433
440
  width: 50%;
@@ -437,36 +444,49 @@ button:focus,
437
444
  width: auto;
438
445
  padding: 0 15px 0 0;
439
446
  border-bottom: 0; }
447
+ #global-header .header-proposition #proposition-link li.clear-child,
440
448
  #global-header .header-proposition #proposition-links li.clear-child {
441
449
  clear: left; }
442
- #global-header .header-proposition #proposition-links li a {
443
- color: white;
444
- text-decoration: none;
445
- font-family: "nta", Arial, sans-serif;
446
- font-size: 14px;
447
- line-height: 1.42857;
448
- font-weight: 700;
449
- text-transform: none;
450
- font-family: "nta", Arial, sans-serif;
451
- font-size: 16px;
452
- line-height: 1.25;
453
- font-weight: 700;
454
- text-transform: none;
455
- line-height: 23px; }
456
- @media (max-width: 640px) {
457
- #global-header .header-proposition #proposition-links li a {
458
- font-size: 12px;
459
- line-height: 1.25; } }
460
- @media (max-width: 640px) {
461
- #global-header .header-proposition #proposition-links li a {
462
- font-size: 14px;
463
- line-height: 1.14286; } }
464
- #global-header .header-proposition #proposition-links li a:hover {
465
- text-decoration: underline; }
466
- #global-header .header-proposition #proposition-links li a.active {
467
- color: #1d8feb; }
468
- #global-header .header-proposition #proposition-links li a:focus {
469
- color: #0b0c0c; }
450
+ #global-header .header-proposition #proposition-link a,
451
+ #global-header .header-proposition #proposition-links a {
452
+ color: white;
453
+ text-decoration: none;
454
+ font-family: "nta", Arial, sans-serif;
455
+ font-size: 14px;
456
+ line-height: 1.42857;
457
+ font-weight: 700;
458
+ text-transform: none;
459
+ font-family: "nta", Arial, sans-serif;
460
+ font-size: 16px;
461
+ line-height: 1.25;
462
+ font-weight: 700;
463
+ text-transform: none;
464
+ line-height: 23px; }
465
+ @media (max-width: 640px) {
466
+ #global-header .header-proposition #proposition-link a,
467
+ #global-header .header-proposition #proposition-links a {
468
+ font-size: 12px;
469
+ line-height: 1.25; } }
470
+ @media (max-width: 640px) {
471
+ #global-header .header-proposition #proposition-link a,
472
+ #global-header .header-proposition #proposition-links a {
473
+ font-size: 14px;
474
+ line-height: 1.14286; } }
475
+ #global-header .header-proposition #proposition-link a:hover,
476
+ #global-header .header-proposition #proposition-links a:hover {
477
+ text-decoration: underline; }
478
+ #global-header .header-proposition #proposition-link a.active,
479
+ #global-header .header-proposition #proposition-links a.active {
480
+ color: #1d8feb; }
481
+ #global-header .header-proposition #proposition-link a:focus,
482
+ #global-header .header-proposition #proposition-links a:focus {
483
+ color: #0b0c0c; }
484
+ #global-header .header-proposition #proposition-link {
485
+ float: right;
486
+ line-height: 22px;
487
+ float: none; }
488
+ .js-enabled #global-header .header-proposition #proposition-link {
489
+ display: block; }
470
490
 
471
491
  /* Global header bar */
472
492
  #global-header-bar {
data/app/assets/stylesheets/govuk-template.css.erb CHANGED
@@ -27,7 +27,8 @@
27
27
  @-o-viewport {
28
28
  width: device-width; }
29
29
 
30
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
30
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
31
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
31
32
  content: "";
32
33
  display: block;
33
34
  clear: both; }
@@ -38,7 +39,8 @@
38
39
  @-o-viewport {
39
40
  width: device-width; }
40
41
 
41
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
42
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
43
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
42
44
  content: "";
43
45
  display: block;
44
46
  clear: both; }
@@ -300,7 +302,8 @@ button:focus,
300
302
  @-o-viewport {
301
303
  width: device-width; }
302
304
 
303
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
305
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-link:after,
306
+ #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
304
307
  content: "";
305
308
  display: block;
306
309
  clear: both; }
@@ -435,60 +438,82 @@ button:focus,
435
438
  @media (min-width: 769px) {
436
439
  #global-header .header-proposition #proposition-menu.no-proposition-name {
437
440
  margin-top: 37px; } }
441
+ #global-header .header-proposition #proposition-link,
438
442
  #global-header .header-proposition #proposition-links {
439
443
  clear: both;
440
444
  margin: 2px 0 0 0;
441
445
  padding: 0; }
442
- .js-enabled #global-header .header-proposition #proposition-links {
446
+ .js-enabled #global-header .header-proposition #proposition-link, .js-enabled
447
+ #global-header .header-proposition #proposition-links {
443
448
  display: none; }
444
449
  @media (min-width: 769px) {
445
- .js-enabled #global-header .header-proposition #proposition-links {
450
+ .js-enabled #global-header .header-proposition #proposition-link, .js-enabled
451
+ #global-header .header-proposition #proposition-links {
446
452
  display: block; } }
447
- .js-enabled #global-header .header-proposition #proposition-links.js-visible {
453
+ .js-enabled #global-header .header-proposition #proposition-link.js-visible, .js-enabled
454
+ #global-header .header-proposition #proposition-links.js-visible {
448
455
  display: block; }
456
+ #global-header .header-proposition #proposition-link li,
449
457
  #global-header .header-proposition #proposition-links li {
450
458
  float: left;
451
459
  width: 50%;
452
460
  padding: 3px 0;
453
461
  border-bottom: 1px solid #2e3133; }
454
462
  @media (min-width: 769px) {
463
+ #global-header .header-proposition #proposition-link li,
455
464
  #global-header .header-proposition #proposition-links li {
456
465
  display: block;
457
466
  width: auto;
458
467
  padding: 0 15px 0 0;
459
468
  border-bottom: 0; }
469
+ #global-header .header-proposition #proposition-link li.clear-child,
460
470
  #global-header .header-proposition #proposition-links li.clear-child {
461
471
  clear: left; } }
462
- #global-header .header-proposition #proposition-links li a {
463
- color: white;
464
- text-decoration: none;
465
- font-family: "nta", Arial, sans-serif;
466
- font-size: 14px;
467
- line-height: 1.42857;
468
- font-weight: 700;
469
- text-transform: none; }
470
- @media (max-width: 640px) {
471
- #global-header .header-proposition #proposition-links li a {
472
- font-size: 12px;
473
- line-height: 1.25; } }
474
- @media (min-width: 769px) {
475
- #global-header .header-proposition #proposition-links li a {
476
- font-family: "nta", Arial, sans-serif;
477
- font-size: 16px;
478
- line-height: 1.25;
479
- font-weight: 700;
480
- text-transform: none;
481
- line-height: 23px; } }
482
- @media (min-width: 769px) and (max-width: 640px) {
483
- #global-header .header-proposition #proposition-links li a {
484
- font-size: 14px;
485
- line-height: 1.14286; } }
486
- #global-header .header-proposition #proposition-links li a:hover {
487
- text-decoration: underline; }
488
- #global-header .header-proposition #proposition-links li a.active {
489
- color: #1d8feb; }
490
- #global-header .header-proposition #proposition-links li a:focus {
491
- color: #0b0c0c; }
472
+ #global-header .header-proposition #proposition-link a,
473
+ #global-header .header-proposition #proposition-links a {
474
+ color: white;
475
+ text-decoration: none;
476
+ font-family: "nta", Arial, sans-serif;
477
+ font-size: 14px;
478
+ line-height: 1.42857;
479
+ font-weight: 700;
480
+ text-transform: none; }
481
+ @media (max-width: 640px) {
482
+ #global-header .header-proposition #proposition-link a,
483
+ #global-header .header-proposition #proposition-links a {
484
+ font-size: 12px;
485
+ line-height: 1.25; } }
486
+ @media (min-width: 769px) {
487
+ #global-header .header-proposition #proposition-link a,
488
+ #global-header .header-proposition #proposition-links a {
489
+ font-family: "nta", Arial, sans-serif;
490
+ font-size: 16px;
491
+ line-height: 1.25;
492
+ font-weight: 700;
493
+ text-transform: none;
494
+ line-height: 23px; } }
495
+ @media (min-width: 769px) and (max-width: 640px) {
496
+ #global-header .header-proposition #proposition-link a,
497
+ #global-header .header-proposition #proposition-links a {
498
+ font-size: 14px;
499
+ line-height: 1.14286; } }
500
+ #global-header .header-proposition #proposition-link a:hover,
501
+ #global-header .header-proposition #proposition-links a:hover {
502
+ text-decoration: underline; }
503
+ #global-header .header-proposition #proposition-link a.active,
504
+ #global-header .header-proposition #proposition-links a.active {
505
+ color: #1d8feb; }
506
+ #global-header .header-proposition #proposition-link a:focus,
507
+ #global-header .header-proposition #proposition-links a:focus {
508
+ color: #0b0c0c; }
509
+ #global-header .header-proposition #proposition-link {
510
+ float: right;
511
+ line-height: 22px; }
512
+ .js-enabled #global-header .header-proposition #proposition-link {
513
+ display: block; }
514
+ @media (min-width: 769px) {
515
+ #global-header .header-proposition #proposition-link {
516
+ float: none; } }
492
517
 
493
518
  /* Global header bar */
494
519
  #global-header-bar {
data/app/views/layouts/govuk_template.html.erb CHANGED
@@ -59,6 +59,8 @@
59
59
  <body<%= content_for?(:body_classes) ? raw(" class=\"#{yield(:body_classes)}\"") : '' %>>
60
60
  <script type="text/javascript">document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');</script>
61
61
 
62
+ <%= yield :body_start %>
63
+
62
64
  <div id="skiplink-container">
63
65
  <div>
64
66
  <a href="#content" class="skiplink">Skip to main content</a>
data/lib/govuk_template/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module GovukTemplate
2
- VERSION = "0.11.0"
2
+ VERSION = "0.12.0"
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: govuk_template
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.11.0
4
+ version: 0.12.0
5
5
  prerelease:
6
6
  platform: ruby
7
7
  authors:
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2014-12-03 00:00:00.000000000 Z
12
+ date: 2014-12-09 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: rails
@@ -220,7 +220,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
220
220
  version: '0'
221
221
  segments:
222
222
  - 0
223
- hash: 4583894652161055407
223
+ hash: -979245565187890978
224
224
  required_rubygems_version: !ruby/object:Gem::Requirement
225
225
  none: false
226
226
  requirements:
@@ -229,7 +229,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
229
229
  version: '0'
230
230
  segments:
231
231
  - 0
232
- hash: 4583894652161055407
232
+ hash: -979245565187890978
233
233
  requirements: []
234
234
  rubyforge_project:
235
235
  rubygems_version: 1.8.23.2