Merge pull request #576 from alphagov/fix-grid-system

Allow grid system to be used in admin layout
alphagov · Oct 11, 2018 · 9e0c95d · 9e0c95d
2 parents 9b1b41a + e78ab62
commit 9e0c95d
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/app/assets/stylesheets/govuk_publishing_components/components/_layout-for-admin.scss b/app/assets/stylesheets/govuk_publishing_components/components/_layout-for-admin.scss
@@ -13,7 +13,7 @@
   @import "govuk-frontend/core/typography";
 
   // .govuk-grid-column-two-thirds
-  @import "govuk-frontend/helpers/grid";
+  @import "govuk-frontend/objects/grid";
 
   // .govuk-visually-hidden
   @import "govuk-frontend/utilities/visually-hidden";

diff --git a/spec/dummy/app/views/welcome/admin_example.html.erb b/spec/dummy/app/views/welcome/admin_example.html.erb
@@ -1,5 +1,17 @@
 <h1 class="govuk-heading-xl">Hello! I am an example admin page</h1>
 
 <p class="govuk-body">
-  Pages with the admin layout can use GOV.UK styles directly.
+  Pages with the admin layout can use some GOV.UK styles. For example, the grid:
+
+  <div class="govuk-grid-row">
+    <div class="govuk-grid-column-two-thirds">
+      <h1 class="govuk-heading-xl">Two-thirds column</h1>
+      <p class="govuk-body">This is a paragraph inside a two-thirds wide column</p>
+    </div>
+
+    <div class="govuk-grid-column-one-third">
+      <h3 class="govuk-heading-m">One-third column</h3>
+      <p class="govuk-body">This is a paragraph inside a one-third wide column</p>
+    </div>
+  </div>
 </p>