From df95fed26d90487eea6d7156c6236eecd63a0664 Mon Sep 17 00:00:00 2001
From: Josemi <josemijuanes@gmail.com>
Date: Tue, 24 Jan 2023 19:35:27 +0100
Subject: [PATCH] feat: added gradients utilities

---
 low/_config.scss    |  8 ++++++++
 low/_utilities.scss | 38 +++++++++++++++++++++++++++++---------
 2 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/low/_config.scss b/low/_config.scss
index 147ad99..61a6ca9 100644
--- a/low/_config.scss
+++ b/low/_config.scss
@@ -267,6 +267,14 @@ $background-clip: (
 
 $background-color: $colors !default;
 
+$background-image: (
+    none: none,
+    gradient-to-right: linear-gradient(to right, var(--low-gradient-start), var(--low-gradient-stop)),
+    gradient-to-lelft: linear-gradient(to left, var(--low-gradient-start), var(--low-gradient-stop)),
+    gradient-to-bottom: linear-gradient(to bottom, var(--low-gradient-start), var(--low-gradient-stop)),
+    gradient-to-top: linear-gradient(to top, var(--low-gradient-start), var(--low-gradient-stop)),
+) !default;
+
 $background-repeat: (
     repeat: repeat,
     no-repeat: no-repeat,
diff --git a/low/_utilities.scss b/low/_utilities.scss
index 3baaa04..18aeb60 100644
--- a/low/_utilities.scss
+++ b/low/_utilities.scss
@@ -2,9 +2,17 @@
 
 // @description All utilities
 $all-utilities: (
+    // Animations
+    animation: (
+        alias: "animation",
+        variants: ("default", "responsive"),
+        properties: (animation),
+        values: config.$animation,
+    ),
+
     // Background utilities
     background-clip: (
-        alias: "bg-clip",
+        alias: "bg",
         variants: ("default"),
         properties: (background-clip),
         values: config.$background-clip,
@@ -15,6 +23,12 @@ $all-utilities: (
         properties: (background-color),
         values: config.$background-color,
     ),
+    background-image: (
+        alias: "bg",
+        variants: ("default"),
+        properties: (background-image),
+        values: config.$background-image,
+    ),
     background-repeat: (
         alias: "bg",
         variants: ("default"),
@@ -28,6 +42,20 @@ $all-utilities: (
         values: config.$background-size,
     ),
 
+    // Gradients utilities
+    gradient-from: (
+        alias: "from",
+        variants: ("default"),
+        properties: (--low-gradient-start),
+        values: config.$background-color,
+    ),
+    gradient-to: (
+        alias: "to",
+        variants: ("default"),
+        properties: (--low-gradient-stop),
+        values: config.$background-color,
+    ),
+
     // Border utilities
     border-color: (
         alias: "b",
@@ -440,14 +468,6 @@ $all-utilities: (
         values: config.$vertical-align,
     ),
 
-    // Animations
-    animation: (
-        alias: "animation",
-        variants: ("default", "responsive"),
-        properties: (animation),
-        values: config.$animation,
-    ),
-
     // Filter
     filter-blur: (
         alias: "blur",