Merge pull request #565 from alphagov/release-0.0.24-alpha

Release v0.0.24-alpha

CHANGELOG.md

@@ -2,14 +2,14 @@
 
 Note: We're not following semantic versioning yet, we are going to talk about this soon.
 
-## Unreleased
+## 0.0.24-alpha (Breaking release)
 
 Breaking changes:
 
 - Namespace existing mixins and functions ( PR [#557](https://github.com/alphagov/govuk-frontend/pull/557))
 - The class `.govuk-section-break__visible` has been renamed to
   `.govuk-section-break--visible` as it is a modifier, not an element.
-  (PR [#547](https://github.com/alphagov/govuk-frontend/pull/547)
+  (PR [#547](https://github.com/alphagov/govuk-frontend/pull/547))
 - Simplify `src/` folder structure, remove tree and string manipulations from
 gulp tasks (PR [#545](https://github.com/alphagov/govuk-frontend/pull/545))
 
@@ -18,28 +18,32 @@ New features:
 - A new variable `$govuk-input-border-colour` has been introduced to define the
   border colour for inputs. The Input, Select and Textarea components have been
   updated to use it.
-  (PR [#551](https://github.com/alphagov/govuk-frontend/pull/551)
+  (PR [#551](https://github.com/alphagov/govuk-frontend/pull/551))
 
 Fixes:
 - Removes media query display on body from compiled CSS
-  (PR [#560](https://github.com/alphagov/govuk-frontend/pull/560)
+  (PR [#560](https://github.com/alphagov/govuk-frontend/pull/560))
 
 - Fieldset legends now correctly use 'full black' text colour when printed
-  (PR [#544](https://github.com/alphagov/govuk-frontend/pull/544)
+  (PR [#544](https://github.com/alphagov/govuk-frontend/pull/544))
 - Radio and Checkbox components now explicitly use currentColor for their
   borders, rather than relying on inheriting it
-  (PR [#551](https://github.com/alphagov/govuk-frontend/pull/551)
+  (PR [#551](https://github.com/alphagov/govuk-frontend/pull/551))
 
 Internal:
 
 - The 'prose scope' has been updated to extend only placeholder classes. The
   corresponding classes the prose scope extends have been updated to provide a
   placeholder class and separately create the concrete class. This allows us
   to be specific about which occurrences of the class are meant to be extended.
-  (PR [#550](https://github.com/alphagov/govuk-frontend/pull/550)
+  (PR [#550](https://github.com/alphagov/govuk-frontend/pull/550))
 - The sass-lint config has been updated to prevent the use of `@extend` with
   concrete classes.
-  (PR [#550](https://github.com/alphagov/govuk-frontend/pull/550)
+  (PR [#550](https://github.com/alphagov/govuk-frontend/pull/550))
+- Release process has been streamlined with fewer steps
+  (PR [#553](https://github.com/alphagov/govuk-frontend/pull/553))
+- Update `govuk-section-break__visible` new class name `govuk-section-break--visible` in the     review app's Typography page. 
+  (PR [#566](https://github.com/alphagov/govuk-frontend/pull/566))
 
 ## 0.0.23-alpha (Breaking release)
 

dist/VERSION.txt

@@ -1 +1 @@
-0.0.23-alpha
+0.0.24-alpha

dist/components/all/_all-old-ie.scss

@@ -6,7 +6,7 @@ $mq-responsive: false;
 
 // Set is-ie to true to output IE specific styles
 // uses the IE helpers in globals/_helpers.scss
-$is-ie: true;
-$ie-version: 8;
+$govuk-is-ie: true;
+$govuk-ie-version: 8;
 
 @import "all";

dist/components/back-link/_back-link.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("back-link") {
+@include govuk-exports("back-link") {
 
   .govuk-c-back-link {
     @include govuk-font-regular-16;
@@ -31,7 +31,7 @@
 
     // Prepend left pointing arrow
     &:before {
-      @include arrow($direction: left, $base: 10px, $height: 6px);
+      @include govuk-shape-arrow($direction: left, $base: 10px, $height: 6px);
 
       content: "";
 

dist/components/breadcrumbs/_breadcrumbs.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("breadcrumbs") {
+@include govuk-exports("breadcrumbs") {
 
   // Size of chevron (excluding border)
   $chevron-size: 7px;
@@ -86,7 +86,7 @@
       border-color: $chevron-border-colour;
 
       // Fall back to a greater than sign for IE8
-      @include ie(8) {
+      @include govuk-ie(8) {
         content: "\003e"; // Greater than sign (>)
         width: auto;
         height: auto;

dist/components/button/_button.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("button") {
+@include govuk-exports("button") {
 
   // Because the shadow (s0) is visually 'part of' the button, we need to reduce
   // the height of the button to compensate by adjusting its padding (s1) and
@@ -138,7 +138,7 @@
       top: 0;
       -webkit-box-shadow: 0 $button-shadow-size 0 $govuk-button-shadow-colour;
               box-shadow: 0 $button-shadow-size 0 $govuk-button-shadow-colour; // s0
-      @include ie-lte(8) {
+      @include govuk-ie-lte(8) {
         border-bottom: $button-shadow-size solid $govuk-button-shadow-colour; // s0
       }
     }
@@ -161,24 +161,24 @@
     padding-bottom: $govuk-spacing-scale-2 - $govuk-border-width-form-element;
     padding-left: $govuk-spacing-scale-3;
 
-    background-image: file-url("icon-pointer.png");
+    background-image: govuk-file-url("icon-pointer.png");
 
     @include govuk-h-device-pixel-ratio {
-      background-image: file-url("icon-pointer-2x.png");
+      background-image: govuk-file-url("icon-pointer-2x.png");
       background-size: 30px 19px;
     }
 
     background-repeat: no-repeat;
     background-position: 100% 50%;
     -webkit-box-shadow: 0 $button-shadow-size 0 $govuk-button-shadow-colour;
             box-shadow: 0 $button-shadow-size 0 $govuk-button-shadow-colour;
-    @include ie-lte(8) {
+    @include govuk-ie-lte(8) {
       border-bottom: $button-shadow-size solid $govuk-button-shadow-colour;
     }
   }
 
   // Fixes a bug where IE puts a black border around certain elements
-  @include ie-lte(8) {
+  @include govuk-ie-lte(8) {
     .govuk-c-button[type="submit"],
     .govuk-c-button[type="reset"],
     .govuk-c-button[type="button"] {

dist/components/checkboxes/_checkboxes.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("checkboxes") {
+@include govuk-exports("checkboxes") {
   .govuk-c-checkboxes__item {
     @include govuk-font-regular-19;
 
@@ -33,7 +33,7 @@
     cursor: pointer;
 
     // IE8 doesn’t support pseudoelements, so we don’t want to hide native elements there.
-    @if ($is-ie == false) or ($ie-version == 9) {
+    @if ($govuk-is-ie == false) or ($govuk-ie-version == 9) {
       margin: 0;
       opacity: 0;
     }
@@ -57,7 +57,7 @@
     left: 0;
     width: $govuk-spacing-scale-7;
     height: $govuk-spacing-scale-7;
-    border: $govuk-border-width-form-element solid $govuk-text-colour;
+    border: $govuk-border-width-form-element solid currentColor;
     background: transparent;
 
     // padding-bottom: 1px;

dist/components/date-input/_date-input.scss

@@ -3,7 +3,7 @@
 @import "../input/input";
 @import "../error-message/error-message";
 
-@include exports("date-input") {
+@include govuk-exports("date-input") {
   .govuk-c-date-input {
     @include govuk-h-clearfix;
   }

dist/components/details/_details.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("details") {
+@include govuk-exports("details") {
 
   .govuk-c-details {
     @include govuk-font-regular-19;
@@ -60,10 +60,10 @@
 
     margin: auto;
 
-    @include arrow($direction: right, $base: 14px);
+    @include govuk-shape-arrow($direction: right, $base: 14px);
 
     .govuk-c-details[open] > & {
-      @include arrow($direction: down, $base: 14px);
+      @include govuk-shape-arrow($direction: down, $base: 14px);
     }
   }
 

dist/components/error-message/_error-message.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("error-message") {
+@include govuk-exports("error-message") {
   .govuk-c-error-message {
     @include govuk-font-bold-19;
 

dist/components/error-summary/_error-summary.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("error-summary") {
+@include govuk-exports("error-summary") {
 
   .govuk-c-error-summary {
     @include govuk-text-colour;
@@ -14,7 +14,7 @@
     }
 
     // TODO: Fix IE < 8
-    @include ie-lte(6) {
+    @include govuk-ie-lte(6) {
       zoom: 1;
     }
   }

dist/components/fieldset/_fieldset.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("fieldset") {
+@include govuk-exports("fieldset") {
   .govuk-c-fieldset {
     margin: 0;
     padding: 0;
@@ -10,6 +10,7 @@
 
   .govuk-c-fieldset__legend {
     @include govuk-font-regular-19;
+    @include govuk-text-colour;
 
     // Fix legend text wrapping in Edge and IE
     // 1. IE9-11 & Edge 12-13
@@ -23,7 +24,6 @@
     // Hack to let legends or elements within legends have margins in webkit browsers
     overflow: hidden;
 
-    color: $govuk-text-colour;
     white-space: normal;    // 1
 
     .govuk-heading-s {

dist/components/file-upload/_file-upload.scss

@@ -1,6 +1,6 @@
 @import "../globals/common";
 
-@include exports("file-upload") {
+@include govuk-exports("file-upload") {
   .govuk-c-file-upload {
     @include govuk-font-regular-19;
     @include govuk-text-colour;

dist/components/globals/_common.scss

@@ -24,7 +24,7 @@
 @import "tools/px-to-em";
 
 // Helpers
-@import "helpers/arrow";
+@import "helpers/shape-arrow";
 @import "helpers/clearfix";
 @import "helpers/device-pixels";
 @import "helpers/focusable";

dist/components/globals/_font-face.scss

@@ -1,6 +1,6 @@
 @import "tools/exports";
 
-@include exports("font-face") {
+@include govuk-exports("font-face") {
 
   // sass-lint:disable no-css-comments
   /* Warning: this file is automatically generated by `gds/fonts` - do not edit by hand */

dist/components/globals/core/_links.scss

@@ -1,6 +1,10 @@
-@include exports("links") {
+@include govuk-exports("links") {
 
-  .govuk-link {
+  // We use placeholder classes here so that we can @extend from the prose scope
+  // without also applying every other occurrence of the .govuk-link selector to
+  // the prose scope.
+
+  %govuk-link {
     @include govuk-typography-common;
     @include govuk-focusable-fill;
 
@@ -45,6 +49,10 @@
     }
   }
 
+  .govuk-link {
+    @extend %govuk-link;
+  }
+
   // Muted link variant
   //
   // Used for secondary links on a page - the link will appear in muted colours

dist/components/globals/core/_lists.scss

@@ -1,25 +1,30 @@
-@include exports("lists") {
+@include govuk-exports("lists") {
 
-  .govuk-list {
+  // We use a placeholder class here so that we can @extend from the prose scope
+  // without also applying every other occurrence of the .govuk-list selector to
+  // the prose scope.
+
+  %govuk-list {
     @include govuk-font-regular-19;
     @include govuk-text-colour;
     margin-top: 0;
     @include govuk-responsive-margin($govuk-spacing-responsive-4, "bottom");
     padding-left: 0;
     list-style-type: none;
 
-    .govuk-list { // Margin for nested lists
+    // Add a top margin for nested lists
+    %govuk-list {
       margin-top: $govuk-spacing-scale-2;
     }
   }
 
-  .govuk-list > li {
+  %govuk-list > li {
     @include mq($from: tablet) {
       margin-bottom: $govuk-spacing-scale-1;
     }
   }
 
-  .govuk-list a {
+  %govuk-list a {
     &:link {
       color: $govuk-link-colour;
     }
@@ -37,18 +42,30 @@
     }
   }
 
-  .govuk-list--bullet {
+  .govuk-list {
+    @extend %govuk-list;
+  }
+
+  %govuk-list--bullet {
     padding-left: $govuk-spacing-scale-4;
 
     list-style-type: disc;
   }
 
-  .govuk-list--number {
+  .govuk-list--bullet {
+    @extend %govuk-list--bullet;
+  }
+
+  %govuk-list--number {
     // TODO: Fix IE < 8
-    @include ie-lte(7) {
+    @include govuk-ie-lte(7) {
       padding-left: $govuk-spacing-scale-6; //used to be 28
     }
     padding-left: $govuk-spacing-scale-4;
     list-style-type: decimal;
   }
+
+  .govuk-list--number {
+    @extend %govuk-list--number;
+  }
 }