From 6a5b64a38259cb9d6216a1107aa7bdb04015df89 Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Sun, 9 Mar 2025 15:40:24 +0100
Subject: [PATCH] feat(styles): Add comprehensive border color utility classes

- Expand border color utility classes for more granular styling
- Add directional border color classes (border-x, border-y, border-t, border-r, border-b, border-l)
- Include border color utilities for various theme colors (primary, background, foreground, card, muted, accent, destructive)
- Enhance Tailwind CSS utility layer for more flexible border styling
---
 src/assets/index.css | 49 +++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 48 insertions(+), 1 deletion(-)

diff --git a/src/assets/index.css b/src/assets/index.css
index 2f637c2..a5400ff 100644
--- a/src/assets/index.css
+++ b/src/assets/index.css
@@ -237,13 +237,60 @@
 
 /* Add support for border colors */
 @layer utilities {
-  .box-border {
+  .border {
     border-color: var(--border);
   }
+  .border-x {
+    border-left-color: var(--border);
+    border-right-color: var(--border);
+  }
+  .border-y {
+    border-top-color: var(--border);
+    border-bottom-color: var(--border);
+  }
+  .border-t {
+    border-top-color: var(--border);
+  }
+  .border-r {
+    border-right-color: var(--border);
+  }
+  .border-b {
+    border-bottom-color: var(--border);
+  }
+  .border-l {
+    border-left-color: var(--border);
+  }
   .border-primary {
     border-color: var(--primary);
   }
   .border-background {
     border-color: var(--background);
   }
+  .border-foreground {
+    border-color: var(--foreground);
+  }
+  .border-card {
+    border-color: var(--card);
+  }
+  .border-card-foreground {
+    border-color: var(--card-foreground);
+  }
+  .border-muted {
+    border-color: var(--muted);
+  }
+  .border-muted-foreground {
+    border-color: var(--muted-foreground);
+  }
+  .border-accent {
+    border-color: var(--accent);
+  }
+  .border-accent-foreground {
+    border-color: var(--accent-foreground);
+  }
+  .border-destructive {
+    border-color: var(--destructive);
+  }
+  .border-destructive-foreground {
+    border-color: var(--destructive-foreground);
+  }
 }