Merge branch 'master' of github.com:alphagov/static into payments-tem…

…plates
alphagov · Mar 26, 2013 · b63f325 · b63f325
2 parents 2eb8913 + d9ae7a7
commit b63f325
Show file tree

Hide file tree

Showing 29 changed files with 204 additions and 81 deletions.
diff --git a/Gemfile b/Gemfile
@@ -28,4 +28,4 @@ end
 gem 'plek', '1.0.0'
 gem 'jasmine', '1.1.2'
 
-gem 'govuk_frontend_toolkit', '0.14.1'
+gem 'govuk_frontend_toolkit', '0.15.0'
diff --git a/Gemfile.lock b/Gemfile.lock
@@ -53,7 +53,7 @@ GEM
     execjs (1.4.0)
       multi_json (~> 1.0)
     ffi (1.1.5)
-    govuk_frontend_toolkit (0.14.1)
+    govuk_frontend_toolkit (0.15.0)
       rails (>= 3.1.0)
       sass (>= 3.2.0)
     hike (1.2.1)
@@ -167,7 +167,7 @@ DEPENDENCIES
   aws-ses
   capybara (= 1.1.0)
   exception_notification
-  govuk_frontend_toolkit (= 0.14.1)
+  govuk_frontend_toolkit (= 0.15.0)
   jasmine (= 1.1.2)
   lograge (~> 0.1.0)
   mocha (= 0.13.3)

diff --git a/app/assets/images/icon-pointer-black-2x.png b/app/assets/images/icon-pointer-black-2x.png
diff --git a/app/assets/images/icon-pointer-black.png b/app/assets/images/icon-pointer-black.png
diff --git a/app/assets/images/external-link-blue.png → app/assets/images/new-window-link-blue.png b/app/assets/images/external-link-blue.png → app/assets/images/new-window-link-blue.png
diff --git a/app/assets/images/external-link.png → app/assets/images/new-window-link.png b/app/assets/images/external-link.png → app/assets/images/new-window-link.png
diff --git a/app/assets/javascripts/header-footer-only.js b/app/assets/javascripts/header-footer-only.js
@@ -1,3 +1,4 @@
 //= require core
+//= require cookie-functions
 //= require welcome
 //= require analytics
diff --git a/app/assets/stylesheets/_buttons.scss b/app/assets/stylesheets/_buttons.scss
@@ -143,7 +143,8 @@
 .transaction .get-started .button,
 .local_transaction .get-started .button,
 .business_support .get-started .button,
-.licence .get-started .button {
+.licence .get-started .button,
+.next-steps-promo .get-started .button {
   padding: 0.45em 1.7em 0.45em 0.67em;
   background-image: image-url("icon-pointer.png");
   background-position: 100% 50%;

diff --git a/app/assets/stylesheets/basic.scss b/app/assets/stylesheets/basic.scss
@@ -65,25 +65,19 @@ a:active {
   color: $link-active-colour;
 }
 
-a[rel="external"]:after,
-.external-link:after {
-  content: "";
-  display: inline-block;
-
-  width: 20px;
-  height: 12px;
-
-  margin-right: 0.2em;
-  margin-left: -0.2em;
-
-  background: image-url("external-link.png") no-repeat;
-
-  @include device-pixel-ratio() {
-    background-image: image-url("external-link-2x.png");
-    background-size: 20px 12px;
+a[rel="external"] {
+  @include external-link-default;
+  @include external-link-19;
+  @include media(mobile) {
+    @include external-link-16;
   }
 }
 
+.external-link {
+  @include external-link-12-no-hover;
+  @include external-link-heading;
+}
+
 // adjustments to normalize.css
 
 /*
@@ -125,4 +119,4 @@ button {
 
 abbr[title] {
   cursor: help;
-}
+}
diff --git a/app/assets/stylesheets/core.scss b/app/assets/stylesheets/core.scss
@@ -180,6 +180,7 @@ h4 {
     list-style: none;
     margin: 0;
     padding: 0;
+    overflow: hidden;
   }
 
   li {
@@ -1230,3 +1231,51 @@ article {
     height: 60px;
   }
 }
+
+.next-steps-promo {
+  border-top: solid 5px $yellow;
+  border-bottom: solid 5px $yellow;
+  position: relative;
+  margin-top: 3em;
+  padding: 1em 200px 1em 0;
+
+  @include media(mobile) {
+    padding-right: 0;
+  }
+
+  @include ie(6) {
+    zoom: 1;
+  }
+
+  h2 {
+    margin-top: 0;
+  }
+
+  img {
+    position: absolute;
+    top: 1em;
+    right: 0;
+
+    @include media(mobile) {
+      position: static;
+      display: block;
+    }
+  }
+
+  .get-started .button {
+    background-color: #FFBF47;
+    background-image: image-url("icon-pointer-black.png");
+    color: #333;
+
+    &:hover,
+    &:focus {
+      background-color: #ffdf94;
+      color: #333;
+    }
+  }
+}
+
+.linear-promo {
+  position: static;
+  padding-right: 0;
+}
diff --git a/app/assets/stylesheets/static-pages/campaigns.scss b/app/assets/stylesheets/static-pages/campaigns.scss
@@ -4,10 +4,24 @@ section.campaign {
     padding-bottom: 3em;
   }
 
+  article.campaign,
   #extra-links {
-    float: left;
-    margin-left: 1em;
-    max-width: 960px;
+    max-width: 662px;
+
+    @include media(mobile) {
+      width: auto;
+      padding-right: 0;
+    }
+
+   @include ie(6) {
+      width: 662px;
+    }
+  }
+
+  #extra-links {
+    margin: 0 1em;
+    overflow: hidden;
+    border-top: solid 1px $grey-6;
 
     @include ie(6) {
       width:928px;
@@ -30,7 +44,6 @@ section.campaign {
     display: block;
     max-width: 960px;
     margin: 0 auto;
-    padding-bottom: 2.5em;
     background-color: #fff;
 
     @include ie-lte(7) {
@@ -60,20 +73,15 @@ section.campaign {
       }
 
       @include ie(6) {
-        width: 500px;
+        width: 700px;
       }
     }
-
-    p {
-      max-width: 662px;
-    }
-
   }
 }
 
 .campaign-image {
   position: relative;
-  float: left;
+  clear: both;
   width: 100%;
   height: 300px;
 
@@ -116,7 +124,6 @@ section.campaign {
 
     @include media ($max-width: 900px) {
       position: static;
-      float: left;
       width: auto;
       padding: 2em 0 0 1em;
     }
@@ -130,12 +137,16 @@ section.campaign {
       margin: 0;
       padding: 0;
     }
+
+    a[rel="external"] {
+      @include external-link-16;
+    }
   }
 }
 
 .organisation {
   float: right;
-  padding: 2.5em 2em 0 0;
+  padding: 2.5em 2em 1em 0;
 
   @include media (mobile) {
     float: left;
@@ -159,13 +170,11 @@ section.campaign {
 }
 
 article.campaign {
+  float: none;
   height: auto;
   min-height: 0;
-  width: auto;
-  max-width: 95%;
   margin: 0 1em;
   padding: 0 2em 1em 0;
-  border-bottom: solid 1px $grey-6;
 
   h2:first-of-type {
     margin-top: 1.5em;
@@ -177,6 +186,10 @@ ul.links {
   margin: 0;
   padding: 0;
 
+  @include ie(6) {
+    list-style-image: none;
+  }
+
   li {
     margin: 0;
     padding: 0;

diff --git a/app/assets/stylesheets/static-pages/tour.scss b/app/assets/stylesheets/static-pages/tour.scss
@@ -66,9 +66,14 @@
           margin-bottom:0;
         }
         a{
-          @include core-16
+          @include core-16;
+          &[rel="external"] {
+            @include external-link-16;
+            @include media(mobile) {
+              @include external-link-14;
+            }
+          }
         }
-
       }
     }
 
@@ -134,6 +139,9 @@
             margin-left:0;
           }
         }
+        a[rel="external"] {
+          @include external-link-16;
+        }
       }
 
       &.tour-topics {

diff --git a/app/assets/stylesheets/text.scss b/app/assets/stylesheets/text.scss
@@ -199,6 +199,13 @@ article th, article td {
   @include core-16;
   vertical-align: top;
   padding: 0.7em 0.5em 0.7em 1em;
+
+  a[rel="external"] {
+    @include external-link-16;
+    @include media(mobile) {
+      @include external-link-14;
+    }
+  }
 }
 
 article tr:nth-child(even) td {

diff --git a/app/controllers/root_controller.rb b/app/controllers/root_controller.rb
@@ -1,6 +1,6 @@
 class RootController < ApplicationController
 
-  caches_page :campaign, :wrapper, :print, :related, :report_a_problem, :homepage, :admin, :beta_notice
+  caches_page :campaign, :wrapper, :print, :related, :report_a_problem, :homepage, :admin, :beta_notice, :header_footer_only, :chromeless
   caches_page *%w(404 406 418 500 501 503 504)
 
   def related

diff --git a/app/views/root/_base.html.erb b/app/views/root/_base.html.erb
@@ -7,36 +7,15 @@
 
     <title><%= content_for?(:title) ? yield(:title) : "GOV.UK - The best place to find government services and information" %></title>
 
-    <script type="text/javascript">
-      (function(){if(navigator.userAgent.match(/IEMobile\/10\.0/)){var d=document,c="appendChild",a=d.createElement("style");a[c](d.createTextNode("@-ms-viewport{width:auto!important}"));d.getElementsByTagName("head")[0][c](a);}})();
-    </script>
-
-    <!--[if gt IE 8]><!--><%= stylesheet_link_tag local_assigns[:css_file] || 'application' %><!--<![endif]-->
-    <!--[if IE 6]><%= stylesheet_link_tag local_assigns[:css_file] || 'application-ie6' %><![endif]-->
-    <!--[if IE 7]><%= stylesheet_link_tag local_assigns[:css_file] || 'application-ie7' %><![endif]-->
-    <!--[if IE 8]><%= stylesheet_link_tag local_assigns[:css_file] || 'application-ie8' %><![endif]-->
-
-    <%= stylesheet_link_tag "print", :media => "print" %>
+    <%= render partial: 'stylesheet', locals: { css_file: local_assigns[:css_file] || 'application' } %>
 
     <%= render partial: "fonts" %>
 
     <!--[if lt IE 9]>
       <%= javascript_include_tag 'ie.js' %>
     <![endif]-->
 
-    <link rel="shortcut icon" href="<%= asset_path 'favicon.ico' %>" type="image/x-icon" />
-
-    <!-- For third-generation iPad with high-resolution Retina display: -->
-    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="<%= asset_path "apple-touch-icon-144x144.png" %>">
-    <!-- For iPhone with high-resolution Retina display: -->
-    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="<%= asset_path "apple-touch-icon-114x114.png" %>">
-    <!-- For first- and second-generation iPad: -->
-    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="<%= asset_path "apple-touch-icon-72x72.png" %>">
-    <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
-    <link rel="apple-touch-icon-precomposed" href="<%= asset_path "apple-touch-icon-57x57.png" %>">
-
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <meta name="og:image" content="<%= asset_path "opengraph-image.png" %>">
+    <%= render partial: "icons" %>
 
     <%= render partial: 'javascript', locals: { js_file: local_assigns[:js_file] || 'application' } unless local_assigns[:js_at_the_end] %>
   </head>
@@ -125,23 +104,7 @@
 
         </nav>
 
-        <div class="footer-meta">
-          <nav>
-            <ul>
-              <li><a href="/support">Support</a></li>
-              <li><a href="/support/cookies">Cookies</a></li>
-              <li><a href="/feedback">Feedback</a></li>
-              <li><a href="/cymraeg">Cymraeg</a></li>
-              <li>Built by the <a href="http://digital.cabinetoffice.gov.uk/">Government Digital Service</a></li>
-            </ul>
-
-            <p>All content is available under the <a href="http://www.nationalarchives.gov.uk/doc/open-government-licence/">Open Government Licence</a>, except where otherwise stated</p>
-          </nav>
-
-          <div class="copyright">
-            <a href="http://www.nationalarchives.gov.uk/information-management/our-services/crown-copyright.htm">&copy; Crown Copyright</a>
-          </div>
-        </div>
+        <%= render partial: 'footer_meta' %>
       </div>
     </footer>
 

diff --git a/app/views/root/_footer_meta.html.erb b/app/views/root/_footer_meta.html.erb
@@ -0,0 +1,17 @@
+<div class="footer-meta">
+  <nav>
+    <ul>
+      <li><a href="/support">Support</a></li>
+      <li><a href="/support/cookies">Cookies</a></li>
+      <li><a href="/feedback">Feedback</a></li>
+      <li><a href="/cymraeg">Cymraeg</a></li>
+      <li>Built by the <a href="http://digital.cabinetoffice.gov.uk/">Government Digital Service</a></li>
+    </ul>
+
+    <p>All content is available under the <a href="http://www.nationalarchives.gov.uk/doc/open-government-licence/">Open Government Licence</a>, except where otherwise stated</p>
+  </nav>
+
+  <div class="copyright">
+    <a href="http://www.nationalarchives.gov.uk/information-management/our-services/crown-copyright.htm">&copy; Crown Copyright</a>
+  </div>
+</div>
diff --git a/app/views/root/_icons.html.erb b/app/views/root/_icons.html.erb
@@ -0,0 +1,13 @@
+<link rel="shortcut icon" href="<%= asset_path 'favicon.ico' %>" type="image/x-icon" />
+
+<!-- For third-generation iPad with high-resolution Retina display: -->
+<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<%= asset_path "apple-touch-icon-144x144.png" %>">
+<!-- For iPhone with high-resolution Retina display: -->
+<link rel="apple-touch-icon-precomposed" sizes="114x114" href="<%= asset_path "apple-touch-icon-114x114.png" %>">
+<!-- For first- and second-generation iPad: -->
+<link rel="apple-touch-icon-precomposed" sizes="72x72" href="<%= asset_path "apple-touch-icon-72x72.png" %>">
+<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
+<link rel="apple-touch-icon-precomposed" href="<%= asset_path "apple-touch-icon-57x57.png" %>">
+
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta name="og:image" content="<%= asset_path "opengraph-image.png" %>">