Update main wrapper and add variant

Update to use the responsive spacing mixin and add a large variant for use when the page does not contain back links or breadcrumbs

CHANGELOG.md

@@ -11,10 +11,13 @@ Breaking changes:
   `govuk-c-radios--inline` which will automatically make all the radio buttons
   within that block inline.
   (PR [#607](https://github.com/alphagov/govuk-frontend/pull/607))
-
+
+New features:
+- Add `govuk-main-wrapper--l` a variant of the main page wrapper to use when a design does not include back links, breadcrumbs or phase banners (PR [#602](https://github.com/alphagov/govuk-frontend/pull/602))
+
 Internal:
 - Update check script for new components and tweak docs
-  (PR [#589](https://github.com/alphagov/govuk-frontend/pull/589)) 
+  (PR [#589](https://github.com/alphagov/govuk-frontend/pull/589))
 
 ## 0.0.26-alpha (Breaking release)
 

src/globals/objects/_main-wrapper.scss

@@ -1,22 +1,37 @@
-// Example usage:
+// Example usage with Breadcrumbs, phase banners, back links:
 // <div class="govuk-o-width-container">
 //   <!-- Breadcrumbs, phase banners, back links are placed in here. -->
 //   <div class="govuk-o-main-wrapper">
 //       <!-- Wrapper for the main content of your page which applies padding
 //            to the top / bottom -->
 //   </div>
 // </div>
+//
+// Example usage without Breadcrumbs, phase banners, back links:
+// <div class="govuk-o-width-container">
+//   <div class="govuk-main-wrapper govuk-o-main-wrapper--l">
+//       <!-- Wrapper for the main content of your page which applies padding
+//            to the top / bottom -->
+//   </div>
+// </div>
+
 
 @mixin govuk-main-wrapper {
-  padding: $govuk-spacing-scale-3 0;
+  @include govuk-responsive-padding($govuk-spacing-responsive-6, "top");
+  @include govuk-responsive-padding($govuk-spacing-responsive-6, "bottom");
+}
 
-  @include mq($from: tablet) {
-    padding: $govuk-spacing-scale-6 0;
-  }
+// Use govuk-main-wrapper--l when you page does not have Breadcrumbs, phase banners or back links
+@mixin govuk-main-wrapper--l {
+  @include govuk-responsive-padding($govuk-spacing-responsive-8, "top");
 }
 
 @include govuk-exports("main-wrapper") {
   .govuk-o-main-wrapper {
     @include govuk-main-wrapper;
   }
+
+  .govuk-o-main-wrapper--l {
+    @include govuk-main-wrapper--l;
+  }
 }