visually-hidden devient un mixin

changelog.md

@@ -11,6 +11,7 @@
 - modification de l'ordre d'import des fichiers : les utilitaires sont importées à la fin à présent
 - ajout d'une variable pour supporter ou non IE11 : `$ie: true !default;`. 
 - ajout d'une variable pour supporter ou non WordPress : `$wordpress: false !default;`. 
+- `visually-hidden` devient un mixin
 - corrections typo
 
 ## Changelog v7.1.2 (30 janvier 2019)

sass/abstracts/_mixins.scss

@@ -1,3 +1,15 @@
+// Visually-hidden mixin
+@mixin visually-hidden {
+  position: absolute !important;
+  border: 0 !important;
+  height: 1px !important;
+  width: 1px !important;
+  padding: 0 !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+}
+
+
 // font-size Mixin
 // compiles to font-size mobile + font-size desktop on small-plus devices
 // ex. h2 { @include font-size(h2);}

sass/base/_utilities.scss

@@ -95,7 +95,7 @@
 
 /* simple blocks alignment */
 
-.left
+.left,
 .u-left {
   margin-right: auto;
 }
@@ -114,10 +114,8 @@
 /* Global Micro Layout */
 /* ------------------- */
 
-/* module, gains superpower "BFC" Block Formating Context */
+/* "BFC" Block Formating Context */
 
-.mod,
-.u-mod,
 .bfc,
 .u-bfc {
   overflow: hidden;
@@ -171,14 +169,14 @@ img.u-fr {
 }
 
 /* hidden but not for an assistive technology like a screen reader, Yahoo! method */
+// mixin in `abstracts/_mixins.scss`
 .visually-hidden {
-  position: absolute !important;
+  @include visually-hidden;
-  border: 0 !important;
+}
-  height: 1px !important;
+@include respond-to("small") {
-  width: 1px !important;
+  .small-visually-hidden {
-  padding: 0 !important;
+    @include visually-hidden;
-  overflow: hidden !important;
+  }
-  clip: rect(0, 0, 0, 0) !important;
 }
 
 .is-disabled,
@@ -199,9 +197,6 @@ ul {
   }
 }
 
-.color--inverse {
-  color: $white;
-}
 
 /* Width Helpers */
 /* ------------- */