barbican-reset 1.5.4 → 1.5.5

package/components/related_card.vue

@@ -2,11 +2,12 @@
   <b-card related no-body>
     <b-img v-if="content.image" :src="content.image" />
     <b-card-body>
-      <b-link :href="content.link" target="_blank">
-        <b-card-title v-html="content.title" />
-        <b-card-sub-title v-if="content.start_date" v-html="handleDate(content.start_date)" />
-        <b-card-text v-html="limitLength(content.description)" />
-      </b-link>
+      <b-card-title>
+        <b-link v-if="content.title" v-html="content.title" :href="content.link" target="_blank" />
+        <b-link v-else :href="content.link" target="_blank">More Info</b-link>
+      </b-card-title>
+      <b-card-sub-title v-if="content.start_date" v-html="handleDate(content.start_date)" />
+      <b-card-text v-html="limitLength(content.description)" />
     </b-card-body>
   </b-card>
 </template>

package/components/skip_link.vue

@@ -29,6 +29,7 @@ export default {
   opacity: 0;
   
   @include focus {
+    outline: none;
     opacity: 1;
     z-index: 2;
   }

package/helpers/mixins/_buttons.scss

@@ -74,6 +74,7 @@
     border: $border solid $color;
     background-color: $color;
     color: $background;
+    box-shadow: none;
     outline: none;
 
     svg {
@@ -95,10 +96,6 @@
   color: $color;
   
   @if $line { line-height: $line; }
-
-  @include focus {
-    @content;
-  }
 }
 
 @mixin btn-outline-header {
@@ -162,7 +159,8 @@
 }
 
 @mixin btn-link {
-  @include button-link {
+  @include button-link;
+  @include focus {
     @include single-box($c-grey-night);
     background-color: $c-grey-night;
     color: $white;
@@ -172,17 +170,20 @@
 @mixin btn-video-help {
   @include button-link(
     $padding: 1.25rem,
-    $background: $c-grey-alpine) {
-    background-color: $c-grey-steel;
-    color: $white;
-  }
+    $background: $c-grey-alpine);
   font-weight: 700;
   text-align: left;
   width: 100%;
+
+  @include focus {
+    background-color: $c-grey-steel;
+    color: $white;
+  }
 }
 
 @mixin btn-exit {
-  @include button-link {
+  @include button-link;
+  @include focus {
     @include single-box($c-grey-night);
     background-color: $white;
     border-radius: 50%;
@@ -269,20 +270,6 @@
   }
 }
 
-@mixin btn-invisible {
-  &, &:focus {
-    background: transparent;
-    line-height: 1;
-    padding: 0;
-
-    @include focus {
-      background: transparent;
-      line-height: 1;
-      padding: 0;
-    }
-  }
-}
-
 @mixin btn-expand {
   display: block;
 }

package/icons/city_of_london_lockup.vue

@@ -29,6 +29,7 @@ export default {
 
   @include focus {
     text-decoration: underline;
+    outline: none;
   }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "barbican-reset",
-  "version": "1.5.4",
+  "version": "1.5.5",
   "description": "A collection of useful scss imports and js scripts, that provide consistent styling and functionality across barbican projects.",
   "main": "index.js",
   "scripts": {

package/scss/_btn.scss

@@ -76,10 +76,6 @@
     @include btn-carousel;
   }
 
-  &.btn-invisible {
-    @include btn-invisible;
-  }
-
   // modifyers
   &.expand {
     @include btn-expand;

package/scss/_input.scss

@@ -9,12 +9,6 @@ input::placeholder {
   color: $c-grey-concrete;
 }
 
-input[type=number], input[type=text] {
-  @include focus {
-    @include input-focus;
-  }
-}
-
 input[type=checkbox],
 input[type=radio] {
   margin-bottom: 0.5rem;
@@ -27,6 +21,15 @@ input[type=submit] {
   appearance: none;
 }
 
+input[type=number] {
+  @include focus {
+    @include input-focus;
+  }
+}
+
 #{$all-text-inputs} {
   @include all-text-inputs;
+  @include focus {
+    @include input-focus;
+  }
 }

package/scss/card/_related.scss

@@ -13,11 +13,21 @@
 
   .card-title {
     font-size: $font-size-lg;
+    margin-bottom: 0.75rem;
+
+    a {
+      @include btn-link;
+    }
   }
 
+  .card-subtitle[date],
   .card-text:not(:last-child) {
     margin-bottom: 0.5rem;
   }
+
+  * + .card-text[date] {
+    margin-top: 0.75rem;
+  }
 }
 
 .card[related][hero=true] {