@ministryofjustice/frontend 2.0.0-beta.0 → 2.0.0

package/moj/all.js

@@ -369,6 +369,91 @@ MOJFrontend.ButtonMenu.prototype.focusPrevious = function(currentButton) {
 		this.container.find('[role=menuitem]').last().focus();
 	}
 };
+MOJFrontend.FilterToggleButton = function(options) {
+  this.options = options;
+  this.container = this.options.toggleButton.container;
+  this.createToggleButton();
+  this.setupResponsiveChecks();
+  this.options.filter.container.attr('tabindex', '-1');
+  if(this.options.startHidden) {
+    this.hideMenu();
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.setupResponsiveChecks = function() {
+  this.mq = window.matchMedia(this.options.bigModeMediaQuery);
+  this.mq.addListener($.proxy(this, 'checkMode'));
+  this.checkMode(this.mq);
+};
+
+MOJFrontend.FilterToggleButton.prototype.createToggleButton = function() {
+  this.menuButton = $('<button class="govuk-button '+this.options.toggleButton.classes+'" type="button" aria-haspopup="true" aria-expanded="false">'+this.options.toggleButton.showText+'</button>');
+  this.menuButton.on('click', $.proxy(this, 'onMenuButtonClick'));
+  this.options.toggleButton.container.append(this.menuButton);
+};
+
+MOJFrontend.FilterToggleButton.prototype.checkMode = function(mq) {
+  if(mq.matches) {
+    this.enableBigMode();
+  } else {
+    this.enableSmallMode();
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.enableBigMode = function() {
+  this.showMenu();
+  this.removeCloseButton();
+};
+
+MOJFrontend.FilterToggleButton.prototype.enableSmallMode = function() {
+  this.hideMenu();
+  this.addCloseButton();
+};
+
+MOJFrontend.FilterToggleButton.prototype.addCloseButton = function() {
+  if(this.options.closeButton) {
+    this.closeButton = $('<button class="moj-filter__close" type="button">'+this.options.closeButton.text+'</button>');
+    this.closeButton.on('click', $.proxy(this, 'onCloseClick'));
+    this.options.closeButton.container.append(this.closeButton);
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.onCloseClick = function() {
+  this.hideMenu();
+  this.menuButton.focus();
+};
+
+MOJFrontend.FilterToggleButton.prototype.removeCloseButton = function() {
+  if(this.closeButton) {
+    this.closeButton.remove();
+    this.closeButton = null;
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.hideMenu = function() {
+  this.menuButton.attr('aria-expanded', 'false');
+  this.options.filter.container.addClass('moj-js-hidden');
+  this.menuButton.text(this.options.toggleButton.showText);
+};
+
+MOJFrontend.FilterToggleButton.prototype.showMenu = function() {
+  this.menuButton.attr('aria-expanded', 'true');
+  this.options.filter.container.removeClass('moj-js-hidden');
+  this.menuButton.text(this.options.toggleButton.hideText);
+};
+
+MOJFrontend.FilterToggleButton.prototype.onMenuButtonClick = function() {
+  this.toggle();
+};
+
+MOJFrontend.FilterToggleButton.prototype.toggle = function() {
+  if(this.menuButton.attr('aria-expanded') == 'false') {
+    this.showMenu();
+    this.options.filter.container.focus();
+  } else {
+    this.hideMenu();
+  }
+};
 MOJFrontend.FormValidator = function(form, options) {
   this.form = form;
   this.errors = [];
@@ -525,91 +610,6 @@ MOJFrontend.FormValidator.prototype.validate = function() {
   }
   return this.errors.length === 0;
 };
-MOJFrontend.FilterToggleButton = function(options) {
-  this.options = options;
-  this.container = this.options.toggleButton.container;
-  this.createToggleButton();
-  this.setupResponsiveChecks();
-  this.options.filter.container.attr('tabindex', '-1');
-  if(this.options.startHidden) {
-    this.hideMenu();
-  }
-};
-
-MOJFrontend.FilterToggleButton.prototype.setupResponsiveChecks = function() {
-  this.mq = window.matchMedia(this.options.bigModeMediaQuery);
-  this.mq.addListener($.proxy(this, 'checkMode'));
-  this.checkMode(this.mq);
-};
-
-MOJFrontend.FilterToggleButton.prototype.createToggleButton = function() {
-  this.menuButton = $('<button class="govuk-button '+this.options.toggleButton.classes+'" type="button" aria-haspopup="true" aria-expanded="false">'+this.options.toggleButton.showText+'</button>');
-  this.menuButton.on('click', $.proxy(this, 'onMenuButtonClick'));
-  this.options.toggleButton.container.append(this.menuButton);
-};
-
-MOJFrontend.FilterToggleButton.prototype.checkMode = function(mq) {
-  if(mq.matches) {
-    this.enableBigMode();
-  } else {
-    this.enableSmallMode();
-  }
-};
-
-MOJFrontend.FilterToggleButton.prototype.enableBigMode = function() {
-  this.showMenu();
-  this.removeCloseButton();
-};
-
-MOJFrontend.FilterToggleButton.prototype.enableSmallMode = function() {
-  this.hideMenu();
-  this.addCloseButton();
-};
-
-MOJFrontend.FilterToggleButton.prototype.addCloseButton = function() {
-  if(this.options.closeButton) {
-    this.closeButton = $('<button class="moj-filter__close" type="button">'+this.options.closeButton.text+'</button>');
-    this.closeButton.on('click', $.proxy(this, 'onCloseClick'));
-    this.options.closeButton.container.append(this.closeButton);
-  }
-};
-
-MOJFrontend.FilterToggleButton.prototype.onCloseClick = function() {
-  this.hideMenu();
-  this.menuButton.focus();
-};
-
-MOJFrontend.FilterToggleButton.prototype.removeCloseButton = function() {
-  if(this.closeButton) {
-    this.closeButton.remove();
-    this.closeButton = null;
-  }
-};
-
-MOJFrontend.FilterToggleButton.prototype.hideMenu = function() {
-  this.menuButton.attr('aria-expanded', 'false');
-  this.options.filter.container.addClass('moj-js-hidden');
-  this.menuButton.text(this.options.toggleButton.showText);
-};
-
-MOJFrontend.FilterToggleButton.prototype.showMenu = function() {
-  this.menuButton.attr('aria-expanded', 'true');
-  this.options.filter.container.removeClass('moj-js-hidden');
-  this.menuButton.text(this.options.toggleButton.hideText);
-};
-
-MOJFrontend.FilterToggleButton.prototype.onMenuButtonClick = function() {
-  this.toggle();
-};
-
-MOJFrontend.FilterToggleButton.prototype.toggle = function() {
-  if(this.menuButton.attr('aria-expanded') == 'false') {
-    this.showMenu();
-    this.options.filter.container.focus();
-  } else {
-    this.hideMenu();
-  }
-};
 if(MOJFrontend.dragAndDropSupported() && MOJFrontend.formDataSupported() && MOJFrontend.fileApiSupported()) {
   MOJFrontend.MultiFileUpload = function(params) {
     this.defaultParams = {

package/moj/all.scss

@@ -1,3 +1,5 @@
+@import "node_modules/govuk-frontend/dist/govuk/base";
+
 @import "settings/all";
 @import "helpers/all";
 @import "objects/all";

package/moj/components/cookie-banner/_cookie-banner.scss

@@ -1,3 +1,5 @@
+@import "node_modules/govuk-frontend/dist/govuk/objects/width-container";
+
 .moj-cookie-banner {
   display: none;
   @include govuk-font(16);

package/moj/components/progress-bar/_progress-bar.scss

@@ -15,13 +15,6 @@
   text-align: justify;
   vertical-align: top;
 
-  // IE8 does not support the text justify approach for spacing
-  @include govuk-if-ie8 {
-    display: table;
-    table-layout: fixed;
-    width: 100%;
-  }
-
   &::after {
     content: "";
     display: inline-block;
@@ -47,11 +40,6 @@
   text-align: center;
   vertical-align: top;
 
-  // IE8 does not support the text justify approach for spacing
-  @include govuk-if-ie8 {
-    display: table-cell;
-  }
-
   &:first-child,
   &:last-child {
     &::before {
@@ -91,7 +79,7 @@
   position: relative;
   background-color: govuk-colour("white");
   border: 6px solid govuk-colour("green");
-  border-radius: 50%; // IE8 does not support border radius but we’re ok with that
+  border-radius: 50%;
   box-sizing: border-box;
   display: block;
   height: 32px;
@@ -105,12 +93,6 @@
   background-image: url(#{$moj-images-path}icon-progress-tick.svg);
   background-position: 50% 50%;
   background-repeat: no-repeat;
-
-  // IE8 does not support box shadow, so use a standard border.
-  @include govuk-if-ie8 {
-    background-image: url(#{$moj-images-path}icon-progress-tick.png);
-  }
-
 }
 
 .moj-progress-bar__label {

package/moj/components/sub-navigation/_sub-navigation.scss

@@ -17,12 +17,6 @@
     box-shadow: inset 0 -1px 0 $govuk-border-colour;
     width: 100%;
   }
-
-  // IE8 does not support box shadow, so use a standard border.
-  @include govuk-if-ie8 {
-    border-bottom: 1px solid $govuk-border-colour;
-  }
-
 }
 
 

package/moj/components/timeline/_timeline.scss

@@ -106,10 +106,4 @@
   &:focus {
     color: govuk-colour("black"); // Focus colour on yellow should really be black.
   }
-
-  // IE8 does not support box shadow, so use a standard border.
-  @include govuk-if-ie8 {
-    background-image: url(#{$moj-images-path}icon-document.png);
-  }
-
 }

package/moj/helpers/_all.scss

@@ -1,2 +1 @@
 @import "hidden";
-@import "ie8";

package/moj/objects/_width-container.scss

@@ -2,10 +2,6 @@
   // Limit the width of the container to the page width
   max-width: $width;
 
-  @include govuk-if-ie8 {
-    width: $width;
-  }
-
   // On mobile, add half width gutters
   margin: 0 $moj-gutter-half;
 
@@ -19,4 +15,4 @@
   @include govuk-media-query($and: "(min-width: #{($width + $moj-gutter * 2)})") {
     margin: 0 auto;
   }
-}
+}

package/moj/settings/_all.scss

@@ -1,4 +1,3 @@
 @import "assets";
-@import "ie8";
 @import "measurements";
 @import "colours";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ministryofjustice/frontend",
   "description": "The MOJ Frontend contains the code you need to start building user interfaces for UK Ministry of Justice government services.",
-  "version": "2.0.0-beta.0",
+  "version": "2.0.0",
   "main": "moj/all.js",
   "sass": "moj/all.scss",
   "engines": {

package/moj/all-ie8.scss

@@ -1,3 +0,0 @@
-$govuk-is-ie8: true;
-
-@import "all";

package/moj/helpers/_ie8.scss

@@ -1,5 +0,0 @@
-@mixin govuk-if-ie8 {
-  @if $govuk-is-ie8 {
-    @content;
-  }
-}

package/moj/settings/_ie8.scss

@@ -1 +0,0 @@
-$govuk-is-ie8: false !default;