WIP: Refactoring

1 files changed, 23 insertions, 28 deletions

diff --git a/src/objects/_divider.scss b/src/objects/_divider.scss
index 655080f..465bbcf 100644
--- a/src/objects/_divider.scss
+++ b/src/objects/_divider.scss
@@ -4,7 +4,7 @@
 @include iro.props-namespace('divider') {
     @include iro.props-store((
         --dims: (
-            --margin-y: fn.global-dim(--size --85),
+            --margin-b: fn.global-dim(--size --85),
     
             --strong: (
                 --border:          fn.global-dim(--border --thick),
@@ -19,52 +19,48 @@
                 --label-font-size: fn.global-dim(--font-size --50),
             ),
         ),
-    ), 'dims');
-
-    @include iro.props-store((
         --colors: (
             --strong: (
-                --bg:    fn.global-color(--fg),
-                --label: fn.global-color(--fg),
+                --bg:    fn.global-color(--text),
+                --label: fn.global-color(--text),
             ),
             --medium: (
-                --bg:    fn.global-color(--obj),
-                --label: fn.global-color(--fg-hi),
+                --bg:    fn.global-color(--border),
+                --label: fn.global-color(--text-mute),
             ),
             --faint: (
-                --bg:    fn.global-color(--obj),
-                --label: fn.global-color(--fg-hi2),
+                --bg:    fn.global-color(--border),
+                --label: fn.global-color(--text-mute-more),
             ),
             --blue: (
-                --bg:    fn.global-color(--blue --solid --bg),
-                --label: fn.global-color(--blue --solid --obj),
+                --bg:    fn.global-color(--blue --700),
+                --label: fn.global-color(--blue --1000),
             ),
             --purple: (
-                --bg:    fn.global-color(--purple --solid --bg),
-                --label: fn.global-color(--purple --solid --obj),
+                --bg:    fn.global-color(--purple --700),
+                --label: fn.global-color(--purple --1000),
             ),
             --red: (
-                --bg:    fn.global-color(--red --solid --bg),
-                --label: fn.global-color(--red --solid --obj),
+                --bg:    fn.global-color(--red --700),
+                --label: fn.global-color(--red --1000),
             ),
             --green: (
-                --bg:    fn.global-color(--green --solid --bg),
-                --label: fn.global-color(--green --solid --obj),
+                --bg:    fn.global-color(--green --700),
+                --label: fn.global-color(--green --1000),
             ),
             --yellow: (
-                --bg:    fn.global-color(--yellow --solid --bg),
-                --label: fn.global-color(--yellow --solid --obj),
+                --bg:    fn.global-color(--yellow --700),
+                --label: fn.global-color(--yellow --1000),
             ),
         ),
-    ), 'colors');
+    ));
 
     @include iro.bem-object(iro.props-namespace()) {
         display:        flex;
         flex-direction: row;
         align-items:    center;
         height:         1em;
-        margin-top:     fn.dim(--margin-y);
-        margin-bottom:  fn.dim(--margin-y);
+        margin-block:   fn.dim(--margin-b);
         color:          fn.color(--strong --label);
         font-size:      fn.dim(--strong --label-font-size);
         font-weight:    700;
@@ -93,8 +89,7 @@
             align-self:       stretch;
             width:            1px;
             height:           auto;
-            margin-top:       0;
-            margin-bottom:    0;
+            margin-block:     0;
             background-color: fn.color(--faint --bg);
 
             &::before,
@@ -129,12 +124,12 @@
 
         @include iro.bem-modifier('labelled') {
             &::before {
-                margin-right: 1em;
+                margin-inline-end: 1em;
             }
 
             &::after {
-                display:     block;
-                margin-left: 1em;
+                display:             block;
+                margin-inline-start: 1em;
             }
         }