yummacss 3.0.1 → 3.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yummacss",
-  "version": "3.0.1",
+  "version": "3.0.3",
   "description": "A CSS framework for the web with abbreviated styles.",
   "keywords": [
     "css-framework",
@@ -32,12 +32,12 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/yumma-lib/yumma-css"
+    "url": "git+https://github.com/yumma-lib/yumma-css.git"
   },
   "scripts": {
     "build:cli": "tsc -p tsconfig.cli.json",
     "build:css": "gulp build",
-    "build": "pnpm build:cli",
+    "build": "pnpm build:css && pnpm build:cli",
     "dev": "tsc -p tsconfig.cli.json --watch",
     "format:cli": "pnpx prettier --write cli",
     "prepublishOnly": "pnpm build:cli"

package/src/abstracts/mixins/_create-colors.scss

@@ -1,6 +1,6 @@
 @use "sass:color";
 
-@mixin mod-color-scaling($property, $prefix, $k, $v) {
+@mixin color-scaling($property, $prefix, $k, $v) {
   .#{$prefix}-#{$k} {
     #{$property}: $v;
   }
@@ -14,7 +14,7 @@
 
 @mixin shade-scaling($property, $prefix, $k, $v, $percentage) {
   @for $i from 1 through 13 {
-    @if $i <= 6 {
+    @if $i <=6 {
       .#{$prefix}-#{$k}-#{$i} {
         #{$property}: color.mix(white, $v, (7 - $i) * $percentage);
       }
@@ -24,7 +24,9 @@
           #{$property}: color.mix(white, $v, (7 - $i) * $percentage);
         }
       }
-    } @else if $i > 7 {
+    }
+
+    @else if $i >7 {
       .#{$prefix}-#{$k}-#{$i - 1} {
         #{$property}: color.mix(black, $v, ($i - 7) * $percentage);
       }
@@ -36,4 +38,4 @@
       }
     }
   }
-}
+}

package/src/abstracts/mixins/_index.scss

@@ -1,3 +1,2 @@
 @forward "create-colors";
 @forward "create-utilities";
-@forward "extend-utilities";

package/src/utilities/_color.scss

@@ -5,68 +5,55 @@
 @use "../abstracts/_theme" as theme;
 
 $yma-color-utils: (
-  "accent-color": (
-    "prefix": "ac",
+  "accent-color": ("prefix": "ac",
     "property": "accent-color",
   ),
 
-  "background-color": (
-    "prefix": "bg",
+  "background-color": ("prefix": "bg",
     "property": "background-color",
   ),
 
-  "border-color": (
-    "prefix": "bc",
+  "border-color": ("prefix": "bc",
     "property": "border-color",
   ),
 
-  "border-bottom-color": (
-    "prefix": "bc-b",
+  "border-bottom-color": ("prefix": "bc-b",
     "property": "border-bottom-color",
   ),
 
-  "border-left-color": (
-    "prefix": "bc-l",
+  "border-left-color": ("prefix": "bc-l",
     "property": "border-left-color",
   ),
 
-  "border-right-color": (
-    "prefix": "bc-r",
+  "border-right-color": ("prefix": "bc-r",
     "property": "border-right-color",
   ),
 
-  "border-top-color": (
-    "prefix": "bc-t",
+  "border-top-color": ("prefix": "bc-t",
     "property": "border-top-color",
   ),
 
-  "caret-color": (
-    "prefix": "cc",
+  "caret-color": ("prefix": "cc",
     "property": "caret-color",
   ),
 
-  "color": (
-    "prefix": "tc",
+  "color": ("prefix": "tc",
     "property": "color",
   ),
 
-  "fill": (
-    "prefix": "f",
+  "fill": ("prefix": "f",
     "property": "fill",
   ),
 
-  "outline-color": (
-    "prefix": "oc",
+  "outline-color": ("prefix": "oc",
     "property": "outline-color",
   ),
 
-  "stroke": (
-    "prefix": "s",
+  "stroke": ("prefix": "s",
     "property": "stroke",
   ),
 
-  "text-decoration-color": (
-    "prefix": "tdc",
+  "text-decoration-color": ("prefix": "tdc",
     "property": "text-decoration-color",
   ),
 );
@@ -76,10 +63,10 @@ $yma-color-utils: (
   $prefix: map.get($map, "prefix");
 
   @each $k, $v in theme.$yma-theme {
-    @include mix.mod-color-scaling($property, $prefix, $k, $v);
+    @include mix.color-scaling($property, $prefix, $k, $v);
 
     @if (fun.ignore-neutral($v, theme.$yma-theme)) {
       @include mix.shade-scaling($property, $prefix, $k, $v, 14%);
     }
   }
-}
+}

package/src/utilities/_flexbox.scss

@@ -5,13 +5,10 @@
 @use "../utilities/maps/" as maps;
 
 $yma-flexbox-utils: (
-  "align-content": (
-    "prefix": "ac",
-    "properties": (
-      "align-content",
+  "align-content": ("prefix": "ac",
+    "properties": ("align-content",
     ),
-    "values": (
-      "b": baseline,
+    "values": ("b": baseline,
       "c": center,
       "fe": flex-end,
       "fs": flex-start,
@@ -23,13 +20,10 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "align-items": (
-    "prefix": "ai",
-    "properties": (
-      "align-items",
+  "align-items": ("prefix": "ai",
+    "properties": ("align-items",
     ),
-    "values": (
-      "b": baseline,
+    "values": ("b": baseline,
       "c": center,
       "fe": flex-end,
       "fs": flex-start,
@@ -37,13 +31,10 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "align-self": (
-    "prefix": "as",
-    "properties": (
-      "align-self",
+  "align-self": ("prefix": "as",
+    "properties": ("align-self",
     ),
-    "values": (
-      "auto": auto,
+    "values": ("auto": auto,
       "b": baseline,
       "c": center,
       "fe": flex-end,
@@ -52,34 +43,26 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "flex-basis": (
-    "prefix": "fb",
-    "properties": (
-      "flex-basis",
+  "flex-basis": ("prefix": "fb",
+    "properties": ("flex-basis",
     ),
     "values": maps.$yma-flex-basis-map,
   ),
 
-  "flex-direction": (
-    "prefix": "fd",
-    "properties": (
-      "flex-direction",
+  "flex-direction": ("prefix": "fd",
+    "properties": ("flex-direction",
     ),
-    "values": (
-      "c": column,
+    "values": ("c": column,
       "cr": column-reverse,
       "r": row,
       "rr": row-reverse,
     ),
   ),
 
-  "flex-grow": (
-    "prefix": "fg",
-    "properties": (
-      "flex-grow",
+  "flex-grow": ("prefix": "fg",
+    "properties": ("flex-grow",
     ),
-    "values": (
-      "0": 0,
+    "values": ("0": 0,
       "1": 1,
       "2": 2,
       "3": 3,
@@ -91,13 +74,10 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "flex-shrink": (
-    "prefix": "fs",
-    "properties": (
-      "flex-shrink",
+  "flex-shrink": ("prefix": "fs",
+    "properties": ("flex-shrink",
     ),
-    "values": (
-      "0": 0,
+    "values": ("0": 0,
       "1": 1,
       "2": 2,
       "3": 3,
@@ -109,25 +89,19 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "flex-wrap": (
-    "prefix": "fw",
-    "properties": (
-      "flex-wrap",
+  "flex-wrap": ("prefix": "fw",
+    "properties": ("flex-wrap",
     ),
-    "values": (
-      "nw": nowrap,
+    "values": ("nw": nowrap,
       "w": wrap,
       "wr": wrap-reverse,
     ),
   ),
 
-  "flex": (
-    "prefix": "f",
-    "properties": (
-      "flex",
+  "flex": ("prefix": "f",
+    "properties": ("flex",
     ),
-    "values": (
-      "1": 1 1 0%,
+    "values": ("1": 1 1 0%,
       "2": 2 2 0%,
       "3": 3 3 0%,
       "4": 4 4 0%,
@@ -138,13 +112,10 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "justify-content": (
-    "prefix": "jc",
-    "properties": (
-      "justify-content",
+  "justify-content": ("prefix": "jc",
+    "properties": ("justify-content",
     ),
-    "values": (
-      "c": center,
+    "values": ("c": center,
       "fe": flex-end,
       "fs": flex-start,
       "n": normal,
@@ -155,26 +126,20 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "justify-items": (
-    "prefix": "ji",
-    "properties": (
-      "justify-items",
+  "justify-items": ("prefix": "ji",
+    "properties": ("justify-items",
     ),
-    "values": (
-      "c": center,
+    "values": ("c": center,
       "e": end,
       "s": start,
       "st": stretch,
     ),
   ),
 
-  "justify-self": (
-    "prefix": "js",
-    "properties": (
-      "justify-self",
+  "justify-self": ("prefix": "js",
+    "properties": ("justify-self",
     ),
-    "values": (
-      "auto": auto,
+    "values": ("auto": auto,
       "c": center,
       "e": end,
       "s": start,
@@ -182,13 +147,10 @@ $yma-flexbox-utils: (
     ),
   ),
 
-  "order": (
-    "prefix": "or",
-    "properties": (
-      "order",
+  "order": ("prefix": "or",
+    "properties": ("order",
     ),
-    "values": (
-      "l": -9999,
+    "values": ("l": -9999,
       "0": 0,
       "1": 1,
       "2": 2,
@@ -203,51 +165,6 @@ $yma-flexbox-utils: (
       "f": 9999,
     ),
   ),
-
-  "place-content": (
-    "prefix": "pc",
-    "properties": (
-      "place-content",
-    ),
-    "values": (
-      "b": baseline,
-      "c": center,
-      "e": end,
-      "s": start,
-      "sa": space-around,
-      "sb": space-between,
-      "se": space-evenly,
-      "st": stretch,
-    ),
-  ),
-
-  "place-items": (
-    "prefix": "pi",
-    "properties": (
-      "place-items",
-    ),
-    "values": (
-      "b": baseline,
-      "c": center,
-      "e": end,
-      "s": start,
-      "st": stretch,
-    ),
-  ),
-
-  "place-self": (
-    "prefix": "ps",
-    "properties": (
-      "place-self",
-    ),
-    "values": (
-      "auto": auto,
-      "c": center,
-      "e": end,
-      "s": start,
-      "st": stretch,
-    ),
-  ),
 );
 
 @each $name, $map in $yma-flexbox-utils {
@@ -255,4 +172,4 @@ $yma-flexbox-utils: (
   $properties: map.get($map, "properties");
 
   @include mix.create-utilities($map, $prefix, $properties);
-}
+}

package/src/utilities/_grid.scss

@@ -260,6 +260,51 @@ $yma-grid-utils: (
     ),
   ),
 
+  "place-content": (
+    "prefix": "pc",
+    "properties": (
+      "place-content",
+    ),
+    "values": (
+      "b": baseline,
+      "c": center,
+      "e": end,
+      "s": start,
+      "sa": space-around,
+      "sb": space-between,
+      "se": space-evenly,
+      "st": stretch,
+    ),
+  ),
+
+  "place-items": (
+    "prefix": "pi",
+    "properties": (
+      "place-items",
+    ),
+    "values": (
+      "b": baseline,
+      "c": center,
+      "e": end,
+      "s": start,
+      "st": stretch,
+    ),
+  ),
+
+  "place-self": (
+    "prefix": "ps",
+    "properties": (
+      "place-self",
+    ),
+    "values": (
+      "auto": auto,
+      "c": center,
+      "e": end,
+      "s": start,
+      "st": stretch,
+    ),
+  ),
+
   "row-gap": (
     "prefix": "rg",
     "properties": (

package/dist/cli/lang.js

@@ -1,23 +0,0 @@
-export const messages = {
-    build: {
-        start: "Building...",
-        compiling: "Compiling...",
-        usingCache: "Using cache...",
-        purging: "Purging...",
-        minifying: "Minifying...",
-        success: (ms, output) => `Build done in ${ms}ms. (${output})`,
-        fail: "Build failed.",
-    },
-    init: {
-        start: "Creating config...",
-        success: "Config created.",
-        fail: "Config failed.",
-    },
-    watch: {
-        start: "Watching for changes...",
-        fail: "Watch failed.",
-    },
-    common: {
-        unknownError: "Unknown error.",
-    },
-};

package/dist/cli/utils/cli-ui.js

@@ -1,13 +0,0 @@
-import ora from "ora";
-export const spinner = ora({
-    spinner: "sand",
-});
-export const cli = {
-    success: (msg) => console.log(`✔ ${msg}`),
-    info: (msg) => console.log(`ℹ ${msg}`),
-    error: (msg) => console.log(`✗ ${msg}`),
-    startSpinner: (text) => {
-        const spinner = ora({ spinner: "sand", color: "white" }).start(text);
-        return spinner;
-    },
-};

package/dist/cli/utils/ui.js

@@ -1,15 +0,0 @@
-import ora from "ora";
-import chalk from "chalk";
-export const spinner = ora();
-const { green, yellow, cyan, red } = chalk;
-export const ui = {
-    success: (msg) => console.log(green(`✓ ${msg}`)),
-    warn: (msg) => console.log(yellow(`⚠ ${msg}`)),
-    info: (msg) => console.log(cyan(`ℹ ${msg}`)),
-    error: (msg) => console.log(red(`✗ ${msg}`)),
-    startSpinner: (text) => {
-        spinner.text = text;
-        spinner.start();
-        return spinner;
-    },
-};

package/src/abstracts/mixins/_extend-utilities.scss

@@ -1,24 +0,0 @@
-@mixin extensions($map, $prefixes) {
-  @each $k, $v in $map {
-    @each $prefix, $property in $prefixes {
-      // base styles
-      .#{$prefix}-#{$k} {
-        #{$property}: $v;
-      }
-
-      // hover styles
-      .h\:#{$prefix}-#{$k}:hover {
-        #{$property}: $v;
-      }
-
-      @each $bp, $bp-value in $yma-breakpoints {
-        // responsive styles
-        .#{$bp}\:#{$prefix}-#{$k} {
-          @include breakpoint($bp-value) {
-            #{$property}: $v;
-          }
-        }
-      }
-    }
-  }
-}