bug fixes

alert.scss

@@ -1,13 +1,14 @@
-@each $tuple in
-    'ok' var(--green1-c) var(--green2-c) var(--green3-c),
-    'warning' var(--yellow1-c) var(--yellow2-c) var(--yellow3-c),
-    'error' var(--red1-c) var(--red2-c) var(--red3-c),
-    'info' var(--blue1-c) var(--blue2-c) var(--blue3-c) {
-    .log-lvl-#{nth($tuple, 1)} {
-        background: #{nth($tuple, 2)};
-        border: 1px solid #{nth($tuple, 3)};
-        color: #{nth($tuple, 4)};
-    }
+@each $name, $bg, $border, $text in (
+  ('ok', var(--green1-c), var(--green2-c), var(--green3-c)),
+  ('warning', var(--yellow1-c), var(--yellow2-c), var(--yellow3-c)),
+  ('error', var(--red1-c), var(--red2-c), var(--red3-c)),
+  ('info', var(--blue1-c), var(--blue2-c), var(--blue3-c))
+) {
+  .log-lvl-#{$name} {
+    background: $bg;
+    border: 1px solid $border;
+    color: $text;
+  }
 }
 
 #dim {

layout.scss

@@ -118,12 +118,18 @@ div.sticky, section.sticky {
     }
 }
 
-@each $tuple in
-    'wf-100' 100%, 'wf-80' 80%, 'wf-20' 20%, 'wf-66' 66.66%,
-    'wf-50' 50%, 'wf-33' 33.33%, 'wf-25' 25%, 'wf-75' 75% {
-    .#{nth($tuple, 1)} {
-        width: #{nth($tuple, 2)};
-    }
+@each $name, $width in
+  ('wf-100': 100%,
+   'wf-80': 80%,
+   'wf-20': 20%,
+   'wf-66': 66.66%,
+   'wf-50': 50%,
+   'wf-33': 33.33%,
+   'wf-25': 25%,
+   'wf-75': 75%) {
+  .#{$name} {
+    width: $width;
+  }
 }
 
 .spacer {

styles.scss

@@ -2,8 +2,36 @@
 
 // @todo cleanup the vars file and implement more vars.
 //      Additionally, create a default vars file in the "framework" which is used if the app doesn't define var values.
-@import "clean", "default", "grid";
-@import "colors", "article", "layout", "draggable", "text", "tooltip", "spinner", "canvas", "form", "image", "input", "accordion", "alert", "slider", "breadcrumb", "button", "link", "list", "nav", "pagination", "progress", "section", "tab", "table", "tag";
-@import "portlet", "menu";
-@import "editor", "cookie_consent";
-@import "develop";
+@use "clean";
+@use "default";
+@use "grid";
+@use "colors";
+@use "article";
+@use "layout";
+@use "draggable";
+@use "text";
+@use "tooltip";
+@use "spinner";
+@use "canvas";
+@use "form";
+@use "image";
+@use "input";
+@use "accordion";
+@use "alert";
+@use "slider";
+@use "breadcrumb";
+@use "button";
+@use "link";
+@use "list";
+@use "nav";
+@use "pagination";
+@use "progress";
+@use "section";
+@use "tab";
+@use "table";
+@use "tag";
+@use "portlet";
+@use "menu";
+@use "editor";
+@use "cookie_consent";
+@use "develop";