@dimasbaguspm/versaur 0.0.10 → 0.0.11

package/dist/{styles.css → js/styles.css}

@@ -1,4 +1,3 @@
-
 @import url('https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&display=swap');
 @import 'tailwindcss';
 
@@ -16,51 +15,79 @@
 }
 
 /* Versaur Design System - Spenicle Color Palette */
+
 @theme {
-  /* Font Families */
   --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
 
-  /* Core Colors */
-  --color-coral: #e07a5f;
-  --color-coral-soft: #fff8f6;
-  --color-sage: #81b29a;
-  --color-sage-soft: #f6fffa;
-  --color-mist: #84a5c0;
-  --color-mist-soft: #f5faff;
-  --color-slate: #3d405b;
-  --color-slate-soft: #e3e4ea;
-  --color-cream: #f4f1de;
-  --color-cream-soft: #fefdfb;
-  --color-light-gray: #f8f9fa;
-  --color-light-gray-soft: #fcfcfd;
-
-  /* Semantic Colors */
+  /* Primary (Coral) */
+  --color-primary: #e07a5f;
+  --color-primary-light: #ffd9cb;
+  --color-primary-bold: #a95a3a;
+  --color-primary-soft: #fff8f6;
+
+  /* Secondary (Sage) */
+  --color-secondary: #81b29a;
+  --color-secondary-light: #d9ffe6;
+  --color-secondary-bold: #56806b;
+  --color-secondary-soft: #f6fffa;
+
+  /* Tertiary (Mist) */
+  --color-tertiary: #84a5c0;
+  --color-tertiary-light: #d8ebff;
+  --color-tertiary-bold: #5a7a99;
+  --color-tertiary-soft: #f5faff;
+
+  /* Ghost (Slate) */
+  --color-ghost: #3d405b;
+  --color-ghost-light: #b6b8db;
+  --color-ghost-bold: #23243a;
+  --color-ghost-soft: #e3e4ea;
+
+  /* Neutral (Light Gray) */
+  --color-neutral: #e9ecef;
+  --color-neutral-light: #f4f6f8;
+  --color-neutral-bold: #b0b3b8;
+  --color-neutral-soft: #f8f9fa;
+
+  /* Success */
   --color-success: #6db285;
+  --color-success-light: #c8ffdd;
+  --color-success-bold: #417a5a;
   --color-success-soft: #f4fff9;
+
+  /* Info */
   --color-info: #6b8fad;
+  --color-info-light: #b9e1ff;
+  --color-info-bold: #3c5a7a;
   --color-info-soft: #f0f8ff;
+
+  /* Warning */
   --color-warning: #e08a47;
-  --color-warning-soft: #fff9f2;
+  --color-warning-light: #ffdab5;
+  --color-warning-bold: #b86a2c;
+  --color-warning-soft: #fff1e4;
+
+  /* Danger */
   --color-danger: #e06650;
-  --color-danger-soft: #fff5f4;
+  --color-danger-light: #ffbfb3;
+  --color-danger-bold: #b83c2a;
+  --color-danger-soft: #ffeeeb;
 
   /* Background and Foreground */
-  --color-background: #ffffff; /* White */
-  --color-foreground: #2d3748; /* Darker Slate */
-
-  /* Button/Component Variants */
-  --color-primary: #e07a5f; /* Coral */
-  --color-primary-soft: #fff8f6; /* Soft Coral */
-  --color-secondary: #81b29a; /* Sage */
-  --color-secondary-soft: #f6fffa; /* Soft Sage */
-  --color-tertiary: #84a5c0; /* Mist */
-  --color-tertiary-soft: #f5faff; /* Soft Mist */
-  --color-ghost: #3d405b; /* Slate */
-  --color-ghost-soft: #e3e4ea; /* Soft Slate */
-  --color-neutral: #e9ecef; /* Light Gray */
-  --color-neutral-soft: #f8f9fa; /* Soft Light Gray */
-
-  /* Utility Colors */
+  --color-background: #ffffff;
+  --color-background-light: #f8f9fa;
+  --color-background-bold: #e9ecef;
+  --color-foreground: #2d3748;
+  --color-foreground-light: #6b7280;
+  --color-foreground-bold: #1a202c;
+
+  /* Cream */
+  --color-cream: #f4f1de;
+  --color-cream-light: #f9f7f3;
+  --color-cream-bold: #e2d9b8;
+  --color-cream-soft: #f9f7f3;
+
+  /* Border and Accent */
   --color-border: #e0e0e0;
   --color-accent: #84a5c0;
 }
@@ -108,7 +135,6 @@ Our palette follows these harmonious relationships:
   animation: loading-bar 1.2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
 }
 
-
 @keyframes spin-perfect {
   100% {
     transform: rotate(360deg);
@@ -131,4 +157,3 @@ Our palette follows these harmonious relationships:
 .animate-fab-in {
   animation: fab-in 0.32s cubic-bezier(0.4, 0, 0.2, 1);
 }
-