moj_template 0.22.0 → 0.23.0

data/app/assets/stylesheets/moj-template-ie7.css.erb

@@ -14,91 +14,24 @@
 @-o-viewport {
   width: device-width; }
 
-/* CSS 3 Mixins
-
-  Add them as you need them. This should let us manage vendor prefixes in one place.
- */
-/* Cross-browser shims
-
-  Ways of normalising properties across browsers.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/* Usage:
-   @include inline-block
-
-   or
-
-   @include inline-block("250px")
-
-   which gives a min-height to the inline-block elements.
-*/
-/* Contain floats usage:
-
-   .this-has-floated-children {
-     @extend %contain-floats;
-   }
-
-*/
-/* Cross-browser shims
-
-  Ways of normalising properties across browsers.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/* Usage:
-   @include inline-block
-
-   or
-
-   @include inline-block("250px")
-
-   which gives a min-height to the inline-block elements.
-*/
-/* Contain floats usage:
-
-   .this-has-floated-children {
-     @extend %contain-floats;
-   }
-
-*/
-/* CSS 3 Mixins
-
-  Add them as you need them. This should let us manage vendor prefixes in one place.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/*
-
-Mixin and defaults for making buttons on GOV.UK services.
-
-For guidance, see: https://www.gov.uk/service-manual/design-and-content/resources/buttons.html
-
-Example usage:
-
-.button{
-  @include button;
-}
-.button-secondary{
-  @include button($grey-3);
-}
-.button-warning{
-  @include button($red);
-}
-
-*/
 @font-face {
   font-family: GDS-Logo;
   src: local("HelveticaNeue"), local("Helvetica Neue"), local("Arial"), local("Helvetica"); }
@@ -109,32 +42,24 @@ Example usage:
 @-o-viewport {
   width: device-width; }
 
-/* Cross-browser shims
-
-  Ways of normalising properties across browsers.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/* Usage:
-   @include inline-block
-
-   or
+@-ms-viewport {
+  width: device-width; }
 
-   @include inline-block("250px")
+@-o-viewport {
+  width: device-width; }
 
-   which gives a min-height to the inline-block elements.
-*/
-/* Contain floats usage:
+@-ms-viewport {
+  width: device-width; }
 
-   .this-has-floated-children {
-     @extend %contain-floats;
-   }
+@-o-viewport {
+  width: device-width; }
 
-*/
 .clearfix, .cf {
   zoom: 1; }
   .clearfix:before, .cf:before, .clearfix:after, .cf:after {
@@ -176,26 +101,27 @@ header.page-header h1 {
     color: #6f777b; }
     @media (max-width: 640px) {
       header.page-header h1 span {
-        font-size: 18px;
+        font-size: 20px;
         line-height: 1.11111; } }
   header.page-header h1 .alpha {
     display: -moz-inline-stack;
     display: inline-block;
     zoom: 1;
     display: inline;
-    background-color: #d53880;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #d53880; }
     @media (max-width: 640px) {
       header.page-header h1 .alpha {
         font-size: 14px;
@@ -205,19 +131,20 @@ header.page-header h1 {
     display: inline-block;
     zoom: 1;
     display: inline;
-    background-color: #f47738;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #f47738; }
     @media (max-width: 640px) {
       header.page-header h1 .beta {
         font-size: 14px;
@@ -260,19 +187,20 @@ h2, h3, h4 {
     display: inline-block;
     zoom: 1;
     display: inline;
-    background-color: #d53880;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #d53880; }
     @media (max-width: 640px) {
       body.alpha #global-header .header-proposition .proposition-phase {
         font-size: 14px;
@@ -282,19 +210,20 @@ h2, h3, h4 {
     display: inline-block;
     zoom: 1;
     display: inline;
-    background-color: #f47738;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #f47738; }
     @media (max-width: 640px) {
       body.beta #global-header .header-proposition .proposition-phase {
         font-size: 14px;
@@ -318,7 +247,7 @@ h2, h3, h4 {
       font-family: "nta", Arial, sans-serif;
       font-size: 16px;
       line-height: 1.25;
-      font-weight: 300;
+      font-weight: 400;
       text-transform: none;
       background: url(https://assets.digital.cabinet-office.gov.uk/static/separator-73822610794bc3a64871f144d93d6526.png) 100% 50% no-repeat;
       float: left;
@@ -345,7 +274,7 @@ h2, h3, h4 {
   display: inline-block;
   zoom: 1;
   display: inline;
-  padding: 0.35em 0.5em 0.15em 0.5em;
+  padding: 0.3em 0.6em 0.2em 0.6em;
   border: none;
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
@@ -414,7 +343,7 @@ h2, h3, h4 {
   display: inline-block;
   zoom: 1;
   display: inline;
-  padding: 0.35em 0.5em 0.15em 0.5em;
+  padding: 0.3em 0.6em 0.2em 0.6em;
   border: none;
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
@@ -483,7 +412,7 @@ h2, h3, h4 {
   display: inline-block;
   zoom: 1;
   display: inline;
-  padding: 0.35em 0.5em 0.15em 0.5em;
+  padding: 0.3em 0.6em 0.2em 0.6em;
   border: none;
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
@@ -549,12 +478,11 @@ h2, h3, h4 {
   font-family: "nta", Arial, sans-serif;
   font-size: 24px;
   line-height: 1.25;
-  font-weight: 400;
-  text-transform: none;
-  font-weight: 700; }
+  font-weight: 700;
+  text-transform: none; }
   @media (max-width: 640px) {
     #footer h2 {
-      font-size: 20px;
+      font-size: 18px;
       line-height: 1.2; } }
 #footer .footer-categories {
   font-size: 0;
@@ -568,7 +496,7 @@ h2, h3, h4 {
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
+    font-weight: 400;
     text-transform: none;
     list-style: none;
     border-top: 1px solid #a1acb2;

data/app/assets/stylesheets/moj-template-ie8.css.erb

@@ -14,91 +14,24 @@
 @-o-viewport {
   width: device-width; }
 
-/* CSS 3 Mixins
-
-  Add them as you need them. This should let us manage vendor prefixes in one place.
- */
-/* Cross-browser shims
-
-  Ways of normalising properties across browsers.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/* Usage:
-   @include inline-block
-
-   or
-
-   @include inline-block("250px")
-
-   which gives a min-height to the inline-block elements.
-*/
-/* Contain floats usage:
-
-   .this-has-floated-children {
-     @extend %contain-floats;
-   }
-
-*/
-/* Cross-browser shims
-
-  Ways of normalising properties across browsers.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/* Usage:
-   @include inline-block
-
-   or
-
-   @include inline-block("250px")
-
-   which gives a min-height to the inline-block elements.
-*/
-/* Contain floats usage:
-
-   .this-has-floated-children {
-     @extend %contain-floats;
-   }
-
-*/
-/* CSS 3 Mixins
-
-  Add them as you need them. This should let us manage vendor prefixes in one place.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/*
-
-Mixin and defaults for making buttons on GOV.UK services.
-
-For guidance, see: https://www.gov.uk/service-manual/design-and-content/resources/buttons.html
-
-Example usage:
-
-.button{
-  @include button;
-}
-.button-secondary{
-  @include button($grey-3);
-}
-.button-warning{
-  @include button($red);
-}
-
-*/
 @font-face {
   font-family: GDS-Logo;
   src: local("HelveticaNeue"), local("Helvetica Neue"), local("Arial"), local("Helvetica"); }
@@ -109,32 +42,24 @@ Example usage:
 @-o-viewport {
   width: device-width; }
 
-/* Cross-browser shims
-
-  Ways of normalising properties across browsers.
- */
 @-ms-viewport {
   width: device-width; }
 
 @-o-viewport {
   width: device-width; }
 
-/* Usage:
-   @include inline-block
-
-   or
+@-ms-viewport {
+  width: device-width; }
 
-   @include inline-block("250px")
+@-o-viewport {
+  width: device-width; }
 
-   which gives a min-height to the inline-block elements.
-*/
-/* Contain floats usage:
+@-ms-viewport {
+  width: device-width; }
 
-   .this-has-floated-children {
-     @extend %contain-floats;
-   }
+@-o-viewport {
+  width: device-width; }
 
-*/
 .clearfix, .cf {
   zoom: 1; }
   .clearfix:before, .cf:before, .clearfix:after, .cf:after {
@@ -176,24 +101,25 @@ header.page-header h1 {
     color: #6f777b; }
     @media (max-width: 640px) {
       header.page-header h1 span {
-        font-size: 18px;
+        font-size: 20px;
         line-height: 1.11111; } }
   header.page-header h1 .alpha {
     display: -moz-inline-stack;
     display: inline-block;
-    background-color: #d53880;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #d53880; }
     @media (max-width: 640px) {
       header.page-header h1 .alpha {
         font-size: 14px;
@@ -201,19 +127,20 @@ header.page-header h1 {
   header.page-header h1 .beta {
     display: -moz-inline-stack;
     display: inline-block;
-    background-color: #f47738;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #f47738; }
     @media (max-width: 640px) {
       header.page-header h1 .beta {
         font-size: 14px;
@@ -254,19 +181,20 @@ h2, h3, h4 {
   body.alpha #global-header .header-proposition .proposition-phase {
     display: -moz-inline-stack;
     display: inline-block;
-    background-color: #d53880;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #d53880; }
     @media (max-width: 640px) {
       body.alpha #global-header .header-proposition .proposition-phase {
         font-size: 14px;
@@ -274,19 +202,20 @@ h2, h3, h4 {
   body.beta #global-header .header-proposition .proposition-phase {
     display: -moz-inline-stack;
     display: inline-block;
-    background-color: #f47738;
-    color: #fff;
+    vertical-align: top;
+    vertical-align: baseline;
+    margin: 0 8px 0 0;
+    padding: 2px 5px 0;
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
-    text-transform: none;
     font-weight: 700;
+    text-transform: none;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
-    margin: 3px 10px 0 5px;
-    padding: 2px 5px 0; }
+    color: #fff;
+    background-color: #f47738; }
     @media (max-width: 640px) {
       body.beta #global-header .header-proposition .proposition-phase {
         font-size: 14px;
@@ -310,7 +239,7 @@ h2, h3, h4 {
       font-family: "nta", Arial, sans-serif;
       font-size: 16px;
       line-height: 1.25;
-      font-weight: 300;
+      font-weight: 400;
       text-transform: none;
       background: url(https://assets.digital.cabinet-office.gov.uk/static/separator-73822610794bc3a64871f144d93d6526.png) 100% 50% no-repeat;
       float: left;
@@ -335,7 +264,7 @@ h2, h3, h4 {
   position: relative;
   display: -moz-inline-stack;
   display: inline-block;
-  padding: 0.35em 0.5em 0.15em 0.5em;
+  padding: 0.3em 0.6em 0.2em 0.6em;
   border: none;
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
@@ -402,7 +331,7 @@ h2, h3, h4 {
   position: relative;
   display: -moz-inline-stack;
   display: inline-block;
-  padding: 0.35em 0.5em 0.15em 0.5em;
+  padding: 0.3em 0.6em 0.2em 0.6em;
   border: none;
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
@@ -469,7 +398,7 @@ h2, h3, h4 {
   position: relative;
   display: -moz-inline-stack;
   display: inline-block;
-  padding: 0.35em 0.5em 0.15em 0.5em;
+  padding: 0.3em 0.6em 0.2em 0.6em;
   border: none;
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
@@ -535,12 +464,11 @@ h2, h3, h4 {
   font-family: "nta", Arial, sans-serif;
   font-size: 24px;
   line-height: 1.25;
-  font-weight: 400;
-  text-transform: none;
-  font-weight: 700; }
+  font-weight: 700;
+  text-transform: none; }
   @media (max-width: 640px) {
     #footer h2 {
-      font-size: 20px;
+      font-size: 18px;
       line-height: 1.2; } }
 #footer .footer-categories {
   font-size: 0;
@@ -554,7 +482,7 @@ h2, h3, h4 {
     font-family: "nta", Arial, sans-serif;
     font-size: 16px;
     line-height: 1.25;
-    font-weight: 300;
+    font-weight: 400;
     text-transform: none;
     list-style: none;
     border-top: 1px solid #a1acb2;