barbican-reset 2.23.0 → 2.25.0

package/helpers/mixins/_breakpoints.scss

@@ -0,0 +1,122 @@
+$xsmall: 416;
+$small: 520;
+$medium: 768;
+$large: 960;
+$xlarge: 1200;
+$xxlarge: 1600;
+
+@mixin max-width($width) {
+  @media only screen and (max-width: #{$width - 1}px) {
+    @content;
+  }
+}
+
+@mixin min-width($width) {
+  @media only screen and (min-width: #{$width}px) {
+    @content;
+  }
+}
+
+@mixin x-small-up {
+  @include min-width($xsmall) {
+    @content
+  }
+}
+
+@mixin x-small-down {
+  @include max-width($xsmall) {
+    @content
+  }
+}
+
+@mixin small-down {
+  @include max-width($small) {
+    @content
+  }
+}
+
+@mixin small-up {
+  @include min-width($small) {
+    @content
+  }
+}
+
+@mixin small-only {
+  @include x-small-up {
+    @include small-down {
+      @content;
+    }
+  }
+}
+
+@mixin medium-up {
+  @include min-width($medium) {
+    @content
+  }
+}
+
+@mixin medium-down {
+  @include max-width($medium) {
+    @content
+  }
+}
+
+@mixin medium-only {
+  @include small-up {
+    @include medium-down {
+      @content;
+    }
+  }
+}
+
+@mixin large-up {
+  @include min-width($large) {
+    @content
+  }
+}
+
+@mixin large-down {
+  @include max-width($large) {
+    @content
+  }
+}
+
+@mixin large-only {
+  @include medium-up {
+    @include large-down {
+      @content;
+    }
+  }
+}
+
+@mixin x-large-up {
+  @include min-width($xlarge) {
+    @content
+  }
+}
+
+@mixin x-large-down {
+  @include max-width($xlarge) {
+    @content
+  }
+}
+
+@mixin xlarge-only {
+  @include large-up {
+    @include x-large-down {
+      @content;
+    }
+  }
+}
+
+@mixin xx-large-up {
+  @include min-width($xxlarge) {
+    @content
+  }
+}
+
+@mixin xx-large-down {
+  @include max-width($xxlarge) {
+    @content
+  }
+}

package/helpers/mixins/_buttons.scss

@@ -310,7 +310,13 @@
 @mixin btn-login-to-book {
   @include display-button(flex, 0.5);
   @include btn-primary;
+  justify-content: center;
   min-width: initial;
+
+  @include media-breakpoint-down(md) {
+    margin-top: 1rem;
+    width: 100%;
+  }
 }
 
 @mixin btn-sold-out {
@@ -321,7 +327,7 @@
 }
 
 @mixin btn-add-membership-to-basket {
-  @include solid-button($background:$c-brand-membership);
+  @include solid-button($background: $c-brand-membership);
   @include display-button(flex, 0.5);
 }
 

package/helpers/mixins/index.scss

@@ -24,6 +24,7 @@
 @import "br-footer";
 @import "account/orders";
 @import "basket";
+@import "breakpoints";
 @import "buttons";
 @import "content";
 @import "city-of-london";

package/helpers/mixins/input/_checkbox.scss

@@ -6,10 +6,6 @@
 @mixin br-spx-checkbox($state: neutral) {
   @include br-checkbox($state);
 
-  label {
-    @include fontfamily-light;
-  }
-
   input:focus {
     @include generic-input-target-focus;
   }

package/helpers/variables/index.scss

@@ -2,5 +2,4 @@
 @import 'typography';
 @import 'alerts';
 @import 'layout';
-@import 'breakpoints';
 @import 'columns';

package/package.json

@@ -103,5 +103,5 @@
     "watch:patterns": "cd patterns && gulp watch"
   },
   "style": "dist/css/barbican-reset.css",
-  "version": "2.23.0"
+  "version": "2.25.0"
 }

package/helpers/variables/_breakpoints.scss

@@ -1,9 +0,0 @@
-$grid-breakpoints: (
-  xxs: 0,      /* required */
-  xs: 26em,    /* 416px */
-  sm: 32.5em,  /* 520px */
-  md: 48em,    /* 768px */
-  lg: 60em,    /* 960px */
-  xl: 75em,    /* 1200px */
-  xxl: 100em,  /* 1600px */
-);