feat(Global): Build unicode convenience function.

Unicode escapes are hard to remember! And even harder for maintainers to decipher! This adds a function to abstract \00a0 into `unicode(nbsp)` or \00d7 into `unicode(multiplication-sign). Fixes #29.
Pier1 · Nov 3, 2016 · 76faefd · 76faefd
1 parent 05ed683
commit 76faefd
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 10 deletions.
diff --git a/rocketbelt/base/_typography.scss b/rocketbelt/base/_typography.scss
@@ -129,7 +129,7 @@ h4 {
     font-weight: font-weight(light);
 
     &::before {
-      content: '\a0\a0';
+      content: unicode(nbsp) + unicode(nbsp);
     }
   }
 }
@@ -214,7 +214,7 @@ blockquote {
     font-size: font-size(2);
 
     &::before {
-      content: '\2015\a0';
+      content: unicode('horizontal-bar') + unicode(nbsp);
     }
   }
 

diff --git a/rocketbelt/components/alerts/_alerts.scss b/rocketbelt/components/alerts/_alerts.scss
@@ -88,7 +88,7 @@ $message-families: (success, error, warning, info);
     align-items: center;
 
     &::after {
-      content: '\00d7';
+      content: unicode(multiplication-sign);
     }
   }
 }

diff --git a/rocketbelt/components/forms/_forms.scss b/rocketbelt/components/forms/_forms.scss
@@ -28,7 +28,7 @@ fieldset {
 
     .validation-message::after {
       color: color(gray, plus1);
-      content: '\00A0\2014\00A0';
+      content: unicode(nbsp) + unicode('horizontal-bar') + unicode(nbsp);
     }
   }
 }
@@ -196,13 +196,13 @@ select {
 
     &[required] {
       & + label::after {
-        content: '\00a0(required)';
+        content: unicode(nbsp) + '(required)';
       }
     }
 
     &:not([required]) {
       & + label::after {
-        content: '\00a0(optional)';
+        content: unicode(nbsp) + '(optional)';
       }
     }
   }
@@ -241,13 +241,13 @@ fieldset {
 
   &[required] {
     legend::after {
-      content: '\00a0(required)';
+      content: unicode(nbsp) + '(required)';
     }
   }
 
   &:not([required]) {
     legend::after {
-      content: '\00a0(optional)';
+      content: unicode(nbsp) + '(optional)';
     }
   }
 }
diff --git a/rocketbelt/components/modals/_modal-standard.scss b/rocketbelt/components/modals/_modal-standard.scss
@@ -121,7 +121,7 @@
 
 .modal_header_close::before {
   display: block;
-  content: '\00d7';
+  content: unicode(multiplication-sign);
   font-size: ms(6);
   line-height: 1;
 }

diff --git a/rocketbelt/tools/functions/_functions.scss b/rocketbelt/tools/functions/_functions.scss
@@ -7,4 +7,5 @@
         'opposite-direction',
         'padding',
         'str-replace',
-        'strip-unit';
+        'strip-unit',
+        'unicode';
diff --git a/rocketbelt/tools/functions/_unicode.scss b/rocketbelt/tools/functions/_unicode.scss
@@ -0,0 +1,22 @@
+@function unicode($character: '') {
+  $style: to_lower_case($character);
+  $characters: (
+    nbsp: '\00a0',
+    en-dash: '\2013',
+    em-dash: '\2014',
+    horizontal-bar: '\2015',
+    dagger: '\2020',
+    double-dagger: '\2021',
+    bullet: '\2022',
+    ellipsis: '\2026',
+    right-chevron: '\203a',
+    multiplication-sign: '\00d7'
+  );
+
+  @if map-has-key($characters, $character) {
+    @return map-get($characters, $character);
+  }
+  @else {
+    @error 'Character `#{$character}` does not exist in the map.';
+  }
+}