cacao-css 6.0.0 → 6.2.0

package/dist/gutter/xs/vertical.css

@@ -1,30 +1,70 @@
-/* =========================================================================== *\
-    Vertical gutter utilities
-\* =========================================================================== */
+/* =========================================================================== *
+   Vertical gutter utilities
+ * =========================================================================== */
 
 @media (--m-xs) {
     .gy-0-xs {
-        --row-gap: 0px;
+        --row-gap: var(--gutter-0);
     }
 
     .gy-1-xs {
-        --row-gap: 10px;
+        --row-gap: var(--gutter-1);
     }
 
     .gy-2-xs {
-        --row-gap: 20px;
+        --row-gap: var(--gutter-2);
     }
 
     .gy-3-xs {
-        --row-gap: 30px;
+        --row-gap: var(--gutter-3);
     }
 
     .gy-4-xs {
-        --row-gap: 40px;
+        --row-gap: var(--gutter-4);
     }
 
     .gy-5-xs {
-        --row-gap: 50px;
+        --row-gap: var(--gutter-5);
+    }
+
+    .gy-6-xs {
+        --row-gap: var(--gutter-6);
+    }
+
+    .gy-7-xs {
+        --row-gap: var(--gutter-7);
+    }
+
+    .gy-8-xs {
+        --row-gap: var(--gutter-8);
+    }
+
+    .gy-9-xs {
+        --row-gap: var(--gutter-9);
+    }
+
+    .gy-10-xs {
+        --row-gap: var(--gutter-10);
+    }
+
+    .gy-11-xs {
+        --row-gap: var(--gutter-11);
+    }
+
+    .gy-12-xs {
+        --row-gap: var(--gutter-12);
+    }
+
+    .gy-13-xs {
+        --row-gap: var(--gutter-13);
+    }
+
+    .gy-14-xs {
+        --row-gap: var(--gutter-14);
+    }
+
+    .gy-15-xs {
+        --row-gap: var(--gutter-15);
     }
 
     .gy-0-xs,
@@ -32,7 +72,17 @@
     .gy-2-xs,
     .gy-3-xs,
     .gy-4-xs,
-    .gy-5-xs {
+    .gy-5-xs,
+    .gy-6-xs,
+    .gy-7-xs,
+    .gy-8-xs,
+    .gy-9-xs,
+    .gy-10-xs,
+    .gy-11-xs,
+    .gy-12-xs,
+    .gy-13-xs,
+    .gy-14-xs,
+    .gy-15-xs {
         row-gap: var(--row-gap);
     }
 }

package/dist/height/2xl/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - 2xl - imports all the 2xl height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/2xs/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - 2xs - imports all the 2xs height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/3xl/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - 3xl - imports all the 3xl height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/3xs/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - 3xs - imports all the 3xs height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/4xl/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - 4xl - imports all the 4xl height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/5xl/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - 5xl - imports all the 5xl height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - imports all the  height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/lg/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - lg - imports all the lg height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/md/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - md - imports all the md height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/sm/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - sm - imports all the sm height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/xl/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - xl - imports all the xl height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/height/xs/combined-import.css

@@ -0,0 +1,18 @@
+/* =========================================================================== *
+   Height utilities - xs - imports all the xs height utility files
+ * =========================================================================== */
+
+@import './height-0.css';
+@import './height-1.css';
+@import './height-10.css';
+@import './height-11.css';
+@import './height-12.css';
+@import './height-2.css';
+@import './height-3.css';
+@import './height-4.css';
+@import './height-5.css';
+@import './height-6.css';
+@import './height-7.css';
+@import './height-8.css';
+@import './height-9.css';
+@import './height-auto.css';

package/dist/image/image.css

@@ -6,32 +6,31 @@
 .image-right {
     display: block;
     height: auto;
-    margin-bottom: 10px;
-    width: 100%;
+    margin-bottom: var(--image-bottom-margin);
+    max-width: var(--image-max-width);
 }
 
 @media (--m-sm) {
     .image-left,
     .image-right {
         display: inline;
-        max-width: 50%;
-        width: unset;
+        max-width: var(--image-max-width-sm);
     }
 
     .image-left {
         float: left;
-        margin-right: 20px;
+        margin-right: var(--image-right-margin);
     }
 
     .image-right {
         float: right;
-        margin-left: 20px;
+        margin-left: var(--image-left-margin);
     }
 }
 
 @media (--m-md) {
     .image-left,
     .image-right {
-        max-width: 40%;
+        max-width: var(--image-max-width-md);
     }
 }

package/dist/image/variables.css

@@ -0,0 +1,14 @@
+/* =========================================================================== *\
+    Image utility variables
+\* =========================================================================== */
+
+/* :where() is used to give the variables no specificity so that they are easily overriden. https://developer.mozilla.org/en-US/docs/Web/CSS/:where */
+
+:where(html) {
+    --image-bottom-margin: 10px;
+    --image-left-margin: 20px;
+    --image-max-width: 100%;
+    --image-max-width-md: 40%;
+    --image-max-width-sm: 50%;
+    --image-right-margin: 20px;
+}