scss/toolkit/components/divider.scss in titon-toolkit-2.0.2 vs scss/toolkit/components/divider.scss in titon-toolkit-2.1.0

@@ -4,44 +4,46 @@
  * @link        http://titon.io
  */
 
 @import "../common";
 
-#{$divider-class} {
-    text-align: center;
-    overflow: hidden;
+@include export("divider") {
+    #{$divider-class} {
+        text-align: center;
+        overflow: hidden;
 
-    &::after,
-    &::before {
-        content: "";
-        display: inline-block;
-        vertical-align: middle;
-        position: relative;
-        width: 100%;
-        border-top: 1px solid black(.1);
-        border-bottom: 1px solid white(.75);
-    }
+        &::after,
+        &::before {
+            content: "";
+            display: inline-block;
+            vertical-align: middle;
+            position: relative;
+            width: 100%;
+            border-top: 1px solid black(.1);
+            border-bottom: 1px solid white(.75);
+        }
 
-    &::before {
-        margin-left: -100%;
-        left: -$margin;
-    }
+        &::before {
+            margin-#{$align-direction}: -100%;
+            #{$align-direction}: -$margin;
+        }
 
-    &::after {
-        margin-right: -100%;
-        right: -$margin;
-    }
-
-    // Collapse the middle when there is no content
-    &:empty {
-        &::before,
         &::after {
-            right: 0;
-            left: 0;
+            margin-#{$align-opposite-direction}: -100%;
+            #{$align-opposite-direction}: -$margin;
         }
-    }
 
-    > span {
-        display: inline-block;
-        vertical-align: middle;
+        // Collapse the middle when there is no content
+        &:empty {
+            &::before,
+            &::after {
+                right: 0;
+                left: 0;
+            }
+        }
+
+        > span {
+            display: inline-block;
+            vertical-align: middle;
+        }
     }
-}
\ No newline at end of file
+}