Merge pull request #28 from alphagov/add-smaller-page-headings

Add smaller page headings
Crown-Commercial-Service · Feb 19, 2015 · 6fab2e3 · 6fab2e3
2 parents d24340e + 146b2d4
commit 6fab2e3
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 0 deletions.
diff --git a/pages_builder/pages/page-headings/index.yml b/pages_builder/pages/page-headings/index.yml
@@ -27,6 +27,9 @@ content: >
         <li>
           <a href="page-heading-with-context.html">Page heading with context</a>
         </li>
+        <li>
+          <a href="page-heading-smaller.html">Page heading (smaller)</a>
+        </li>
       </ul>
     </div>
   </main>
diff --git a/pages_builder/pages/page-headings/page-heading-smaller.yml b/pages_builder/pages/page-headings/page-heading-smaller.yml
@@ -0,0 +1,30 @@
+pageTitle: Page heading - Page headings - Forms - Test toolkit
+assetPath: ../govuk_template/assets/
+head: >
+  <link rel="stylesheet" media="all" type="text/css" href="../public/stylesheets/index.css" />
+content: >
+  <div id="global-breadcrumb" class="header-context">
+    <nav>
+      <ol class="group" role="breadcrumbs">
+        <li>
+          <a href="../">Home</a>
+        </li>
+        <li>
+          <a href="./">Page headings</a>
+        </li>
+      </ol>
+    </nav>
+  </div>
+  <main role="main" id="content" class="wrapper">
+    <div id="wrapper">
+      <header class="page-heading-smaller">
+        <h1>Page heading (smaller)</h1>
+      </header>
+      <header class="page-heading-smaller">
+        <p class="context">
+          Context
+        </p>
+        <h1>Page heading (smaller)</h1>
+      </header>
+    </div>
+  </main>
diff --git a/toolkit/scss/_page-headings.scss b/toolkit/scss/_page-headings.scss
@@ -30,3 +30,13 @@
     margin-top: ($gutter * 1.5) + 44px;
   }
 }
+
+.page-heading-smaller {
+
+  @extend %page-heading;
+
+  h1 {
+    @include bold-36;
+  }
+
+}