sdga-ui 1.0.1 → 1.0.3

package/theme/config/_colors.scss

@@ -1,303 +1,303 @@
-// Bootstrap 5.3 - Color System Variables
-// Customized with SDGA Palette System - All Shades Available
-
-// Grays
-$white: #FFFFFF;
-$gray-25: #FCFCFD;
-$gray-50: #F9FAFB;
-$gray-100: #F3F4F6;                   // --SDGA-neutral-100
-$gray-200: #E5E7EB;                   // --SDGA-neutral-200
-$gray-300: #D2D6DB;                   // --SDGA-neutral-300
-$gray-400: #9DA4AE;                   // --SDGA-neutral-400
-$gray-500: #6C737F;                   // --SDGA-neutral-500
-$gray-600: #4D5761;                   // --SDGA-neutral-600
-$gray-700: #384250;                   // --SDGA-neutral-700
-$gray-800: #1F2A37;                   // --SDGA-neutral-800
-$gray-900: #111927;                   // --SDGA-neutral-900
-$gray-950: #0D121C;                   // --SDGA-neutral-950
-$black: #161616;
-
-// SA Palette (full range)
-$sa-25: #F7FDF9;
-$sa-50: #F3FCF6;
-$sa-100: #DFF6E7;
-$sa-200: #B8EACB;
-$sa-300: #88D8AD;
-$sa-400: #54C08A;
-$sa-500: #25935F;
-$sa-600: #1B8354;
-$sa-700: #166A45;
-$sa-800: #14573A;
-$sa-900: #104631;
-$sa-950: #092A1E;
-
-
-// Gold Palette (full range)
-$gold-25: #FFFEF7;
-$gold-50: #FFFEF2;
-$gold-100: #FFFCE6;
-$gold-200: #FCF3BD;
-$gold-300: #FAE996;
-$gold-400: #F7D54D;
-$gold-500: #F5BD02;
-$gold-600: #DBA102;
-$gold-700: #B87B02;
-$gold-800: #945C01;
-$gold-900: #6E3C00;
-$gold-950: #472400;
-
-
-// Lavender Palette (full range)
-$lavender-25: #FEFCFF;
-$lavender-50: #F9F5FA;
-$lavender-100: #F2E9F5;
-$lavender-200: #E1CCE8;
-$lavender-300: #CCADD9;
-$lavender-400: #A57BBA;
-$lavender-500: #80519F;
-$lavender-600: #6D428F;
-$lavender-700: #532D75;
-$lavender-800: #3D1D5E;
-$lavender-900: #281047;
-$lavender-950: #16072E;
-
-// Error/Danger Palette (full range)
-$error-25: #FFFBFA;
-$error-50: #FEF3F2;
-$error-100: #FEE4E2;
-$error-200: #FECDCA;
-$error-300: #FDA29B;
-$error-400: #F97066;
-$error-500: #F04438;
-$error-600: #D92D20;
-$error-700: #B42318;
-$error-800: #912018;
-$error-900: #7A271A;
-$error-950: #55160C;
-
-// Warning Palette (full range)
-$warning-25: #FFFCF5;
-$warning-50: #FFFAEB;
-$warning-100: #FEF0C7;
-$warning-200: #FEDF89;
-$warning-300: #FEC84B;
-$warning-400: #FDB022;
-$warning-500: #F79009;
-$warning-600: #DC6803;
-$warning-700: #B54708;
-$warning-800: #93370D;
-$warning-900: #7A2E0E;
-$warning-950: #4E1D09;
-
-// Info Palette (full range)
-$info-25: #F5FAFF;
-$info-50: #EFF8FF;
-$info-100: #D1E9FF;
-$info-200: #B2DDFF;
-$info-300: #84CAFF;
-$info-400: #53B1FD;
-$info-500: #2E90FA;
-$info-600: #1570EF;
-$info-700: #175CD3;
-$info-800: #1849A9;
-$info-900: #194185;
-$info-950: #102A56;
-
-// Success Palette (full range)
-$success-25: #F6FEF9;
-$success-50: #ECFDF3;
-$success-100: #DCFAE6;
-$success-200: #ABEFC6;
-$success-300: #75E0A7;
-$success-400: #47CD89;
-$success-500: #17B26A;
-$success-600: #079455;
-$success-700: #067647;
-$success-800: #085D3A;
-$success-900: #074D31;
-$success-950: #053321;
-
-// ============================================
-// COLOR SYSTEM - Map SDGA Palette to Bootstrap
-// ============================================
-// semantic Palette (full range)
-$primary: $sa-600;
-$primary-25:  $sa-25;
-$primary-50:  $sa-50;
-$primary-100:  $sa-100;
-$primary-200:  $sa-200;
-$primary-300:  $sa-300;
-$primary-400:  $sa-400;
-$primary-500:  $sa-500;
-$primary-600:  $sa-600;
-$primary-700:  $sa-700;
-$primary-800:  $sa-800;
-$primary-900:  $sa-900;
-$primary-950:  $sa-950;
-
-$secondary: $gray-100;
-$secondary-25: $gray-25;
-$secondary-50: $gray-50;
-$secondary-100: $gray-100;
-$secondary-200: $gray-200;
-$secondary-300: $gray-300;
-$secondary-400: $gray-400;
-$secondary-500: $gray-500;
-$secondary-600: $gray-600;
-$secondary-700: $gray-700;
-$secondary-800: $gray-800;
-$secondary-900: $gray-900;
-$secondary-950: $gray-950;
-
-$danger: $error-600;
-$danger-25: $error-25;
-$danger-50: $error-50;
-$danger-100: $error-100;
-$danger-200: $error-200;
-$danger-300: $error-300;
-$danger-400: $error-400;
-$danger-500: $error-500;
-$danger-600: $error-600;
-$danger-700: $error-700;
-$danger-800: $error-800;
-$danger-900: $error-900;
-$danger-950: $error-950;
-
-$neutral: $gray-950;
-$neutral-25: $gray-25;
-$neutral-50: $gray-50;
-$neutral-100: $gray-100;
-$neutral-200: $gray-200;
-$neutral-300: $gray-300;
-$neutral-400: $gray-400;
-$neutral-500: $gray-500;
-$neutral-600: $gray-600;
-$neutral-700: $gray-700;
-$neutral-800: $gray-800;
-$neutral-900: $gray-900;
-$neutral-950: $gray-950;
-
-$success: $success-600;                    
-$info: $info-600;                       
-$warning: $warning-600;                   
-$light: $gray-50;                    
-$dark: $gray-800;                     
-
-
-$theme-colors: (
-  "primary": $primary,
-  "secondary": $secondary,
-  "success": $success,
-  "info": $info,
-  "warning": $warning,
-  "danger": $danger,
-  "light": $light,
-  "dark": $dark,
-  // Additional custom colors from SDGA palette
-  "lavender": $lavender-600,
-  "neutral": $neutral,
-  // Primary shades
-  "primary-25": $primary-25,
-  "primary-50": $primary-50,
-  "primary-100": $primary-100,
-  "primary-200": $primary-200,
-  "primary-300": $primary-300,
-  "primary-400": $primary-400,
-  "primary-500": $primary-500,
-  "primary-600": $primary-600,
-  "primary-700": $primary-700,
-  "primary-800": $primary-800,
-  "primary-900": $primary-900,
-  "primary-950": $primary-950,
-  // Secondary shades
-  "secondary-25": $secondary-25,
-  "secondary-50": $secondary-50,
-  "secondary-100": $secondary-100,
-  "secondary-200": $secondary-200,
-  "secondary-300": $secondary-300,
-  "secondary-400": $secondary-400,
-  "secondary-500": $secondary-500,
-  "secondary-600": $secondary-600,
-  "secondary-700": $secondary-700,
-  "secondary-800": $secondary-800,
-  "secondary-900": $secondary-900,
-  "secondary-950": $secondary-950,
-  // Success shades
-  "success-25": $success-25,
-  "success-50": $success-50,
-  "success-100": $success-100,
-  "success-200": $success-200,
-  "success-300": $success-300,
-  "success-400": $success-400,
-  "success-500": $success-500,
-  "success-600": $success-600,
-  "success-700": $success-700,
-  "success-800": $success-800,
-  "success-900": $success-900,
-  "success-950": $success-950,
-  // Info shades
-  "info-25": $info-25,
-  "info-50": $info-50,
-  "info-100": $info-100,
-  "info-200": $info-200,
-  "info-300": $info-300,
-  "info-400": $info-400,
-  "info-500": $info-500,
-  "info-600": $info-600,
-  "info-700": $info-700,
-  "info-800": $info-800,
-  "info-900": $info-900,
-  "info-950": $info-950,
-  // Warning shades
-  "warning-25": $warning-25,
-  "warning-50": $warning-50,
-  "warning-100": $warning-100,
-  "warning-200": $warning-200,
-  "warning-300": $warning-300,
-  "warning-400": $warning-400,
-  "warning-500": $warning-500,
-  "warning-600": $warning-600,
-  "warning-700": $warning-700,
-  "warning-800": $warning-800,
-  "warning-900": $warning-900,
-  "warning-950": $warning-950,
-  // Danger/Error shades
-  "danger-25": $danger-25,
-  "danger-50": $danger-50,
-  "danger-100": $danger-100,
-  "danger-200": $danger-200,
-  "danger-300": $danger-300,
-  "danger-400": $danger-400,
-  "danger-500": $danger-500,
-  "danger-600": $danger-600,
-  "danger-700": $danger-700,
-  "danger-800": $danger-800,
-  "danger-900": $danger-900,
-  "danger-950": $danger-950,
-  // Lavender shades
-  "lavender-25": $lavender-25,
-  "lavender-50": $lavender-50,
-  "lavender-100": $lavender-100,
-  "lavender-200": $lavender-200,
-  "lavender-300": $lavender-300,
-  "lavender-400": $lavender-400,
-  "lavender-500": $lavender-500,
-  "lavender-600": $lavender-600,
-  "lavender-700": $lavender-700,
-  "lavender-800": $lavender-800,
-  "lavender-900": $lavender-900,
-  "lavender-950": $lavender-950,
-  // Neutral shades
-  "neutral-25": $neutral-25,
-  "neutral-50": $neutral-50,
-  "neutral-100": $neutral-100,
-  "neutral-200": $neutral-200,
-  "neutral-300": $neutral-300,
-  "neutral-400": $neutral-400,
-  "neutral-500": $neutral-500,
-  "neutral-600": $neutral-600,
-  "neutral-700": $neutral-700,
-  "neutral-800": $neutral-800,
-  "neutral-900": $neutral-900,
-  "neutral-950": $neutral-950
-);
+// Bootstrap 5.3 - Color System Variables
+// Customized with SDGA Palette System - All Shades Available
+
+// Grays
+$white: #FFFFFF;
+$gray-25: #FCFCFD;
+$gray-50: #F9FAFB;
+$gray-100: #F3F4F6;                   // --SDGA-neutral-100
+$gray-200: #E5E7EB;                   // --SDGA-neutral-200
+$gray-300: #D2D6DB;                   // --SDGA-neutral-300
+$gray-400: #9DA4AE;                   // --SDGA-neutral-400
+$gray-500: #6C737F;                   // --SDGA-neutral-500
+$gray-600: #4D5761;                   // --SDGA-neutral-600
+$gray-700: #384250;                   // --SDGA-neutral-700
+$gray-800: #1F2A37;                   // --SDGA-neutral-800
+$gray-900: #111927;                   // --SDGA-neutral-900
+$gray-950: #0D121C;                   // --SDGA-neutral-950
+$black: #161616;
+
+// SA Palette (full range)
+$sa-25: #F7FDF9;
+$sa-50: #F3FCF6;
+$sa-100: #DFF6E7;
+$sa-200: #B8EACB;
+$sa-300: #88D8AD;
+$sa-400: #54C08A;
+$sa-500: #25935F;
+$sa-600: #1B8354;
+$sa-700: #166A45;
+$sa-800: #14573A;
+$sa-900: #104631;
+$sa-950: #092A1E;
+
+
+// Gold Palette (full range)
+$gold-25: #FFFEF7;
+$gold-50: #FFFEF2;
+$gold-100: #FFFCE6;
+$gold-200: #FCF3BD;
+$gold-300: #FAE996;
+$gold-400: #F7D54D;
+$gold-500: #F5BD02;
+$gold-600: #DBA102;
+$gold-700: #B87B02;
+$gold-800: #945C01;
+$gold-900: #6E3C00;
+$gold-950: #472400;
+
+
+// Lavender Palette (full range)
+$lavender-25: #FEFCFF;
+$lavender-50: #F9F5FA;
+$lavender-100: #F2E9F5;
+$lavender-200: #E1CCE8;
+$lavender-300: #CCADD9;
+$lavender-400: #A57BBA;
+$lavender-500: #80519F;
+$lavender-600: #6D428F;
+$lavender-700: #532D75;
+$lavender-800: #3D1D5E;
+$lavender-900: #281047;
+$lavender-950: #16072E;
+
+// Error/Danger Palette (full range)
+$error-25: #FFFBFA;
+$error-50: #FEF3F2;
+$error-100: #FEE4E2;
+$error-200: #FECDCA;
+$error-300: #FDA29B;
+$error-400: #F97066;
+$error-500: #F04438;
+$error-600: #D92D20;
+$error-700: #B42318;
+$error-800: #912018;
+$error-900: #7A271A;
+$error-950: #55160C;
+
+// Warning Palette (full range)
+$warning-25: #FFFCF5;
+$warning-50: #FFFAEB;
+$warning-100: #FEF0C7;
+$warning-200: #FEDF89;
+$warning-300: #FEC84B;
+$warning-400: #FDB022;
+$warning-500: #F79009;
+$warning-600: #DC6803;
+$warning-700: #B54708;
+$warning-800: #93370D;
+$warning-900: #7A2E0E;
+$warning-950: #4E1D09;
+
+// Info Palette (full range)
+$info-25: #F5FAFF;
+$info-50: #EFF8FF;
+$info-100: #D1E9FF;
+$info-200: #B2DDFF;
+$info-300: #84CAFF;
+$info-400: #53B1FD;
+$info-500: #2E90FA;
+$info-600: #1570EF;
+$info-700: #175CD3;
+$info-800: #1849A9;
+$info-900: #194185;
+$info-950: #102A56;
+
+// Success Palette (full range)
+$success-25: #F6FEF9;
+$success-50: #ECFDF3;
+$success-100: #DCFAE6;
+$success-200: #ABEFC6;
+$success-300: #75E0A7;
+$success-400: #47CD89;
+$success-500: #17B26A;
+$success-600: #079455;
+$success-700: #067647;
+$success-800: #085D3A;
+$success-900: #074D31;
+$success-950: #053321;
+
+// ============================================
+// COLOR SYSTEM - Map SDGA Palette to Bootstrap
+// ============================================
+// semantic Palette (full range)
+$primary: $sa-600;
+$primary-25:  $sa-25;
+$primary-50:  $sa-50;
+$primary-100:  $sa-100;
+$primary-200:  $sa-200;
+$primary-300:  $sa-300;
+$primary-400:  $sa-400;
+$primary-500:  $sa-500;
+$primary-600:  $sa-600;
+$primary-700:  $sa-700;
+$primary-800:  $sa-800;
+$primary-900:  $sa-900;
+$primary-950:  $sa-950;
+
+$secondary: $gray-100;
+$secondary-25: $gray-25;
+$secondary-50: $gray-50;
+$secondary-100: $gray-100;
+$secondary-200: $gray-200;
+$secondary-300: $gray-300;
+$secondary-400: $gray-400;
+$secondary-500: $gray-500;
+$secondary-600: $gray-600;
+$secondary-700: $gray-700;
+$secondary-800: $gray-800;
+$secondary-900: $gray-900;
+$secondary-950: $gray-950;
+
+$danger: $error-600;
+$danger-25: $error-25;
+$danger-50: $error-50;
+$danger-100: $error-100;
+$danger-200: $error-200;
+$danger-300: $error-300;
+$danger-400: $error-400;
+$danger-500: $error-500;
+$danger-600: $error-600;
+$danger-700: $error-700;
+$danger-800: $error-800;
+$danger-900: $error-900;
+$danger-950: $error-950;
+
+$neutral: $gray-950;
+$neutral-25: $gray-25;
+$neutral-50: $gray-50;
+$neutral-100: $gray-100;
+$neutral-200: $gray-200;
+$neutral-300: $gray-300;
+$neutral-400: $gray-400;
+$neutral-500: $gray-500;
+$neutral-600: $gray-600;
+$neutral-700: $gray-700;
+$neutral-800: $gray-800;
+$neutral-900: $gray-900;
+$neutral-950: $gray-950;
+
+$success: $success-600;                    
+$info: $info-600;                       
+$warning: $warning-600;                   
+$light: $gray-50;                    
+$dark: $gray-800;                     
+
+
+$theme-colors: (
+  "primary": $primary,
+  "secondary": $secondary,
+  "success": $success,
+  "info": $info,
+  "warning": $warning,
+  "danger": $danger,
+  "light": $light,
+  "dark": $dark,
+  // Additional custom colors from SDGA palette
+  "lavender": $lavender-600,
+  "neutral": $neutral,
+  // Primary shades
+  "primary-25": $primary-25,
+  "primary-50": $primary-50,
+  "primary-100": $primary-100,
+  "primary-200": $primary-200,
+  "primary-300": $primary-300,
+  "primary-400": $primary-400,
+  "primary-500": $primary-500,
+  "primary-600": $primary-600,
+  "primary-700": $primary-700,
+  "primary-800": $primary-800,
+  "primary-900": $primary-900,
+  "primary-950": $primary-950,
+  // Secondary shades
+  "secondary-25": $secondary-25,
+  "secondary-50": $secondary-50,
+  "secondary-100": $secondary-100,
+  "secondary-200": $secondary-200,
+  "secondary-300": $secondary-300,
+  "secondary-400": $secondary-400,
+  "secondary-500": $secondary-500,
+  "secondary-600": $secondary-600,
+  "secondary-700": $secondary-700,
+  "secondary-800": $secondary-800,
+  "secondary-900": $secondary-900,
+  "secondary-950": $secondary-950,
+  // Success shades
+  "success-25": $success-25,
+  "success-50": $success-50,
+  "success-100": $success-100,
+  "success-200": $success-200,
+  "success-300": $success-300,
+  "success-400": $success-400,
+  "success-500": $success-500,
+  "success-600": $success-600,
+  "success-700": $success-700,
+  "success-800": $success-800,
+  "success-900": $success-900,
+  "success-950": $success-950,
+  // Info shades
+  "info-25": $info-25,
+  "info-50": $info-50,
+  "info-100": $info-100,
+  "info-200": $info-200,
+  "info-300": $info-300,
+  "info-400": $info-400,
+  "info-500": $info-500,
+  "info-600": $info-600,
+  "info-700": $info-700,
+  "info-800": $info-800,
+  "info-900": $info-900,
+  "info-950": $info-950,
+  // Warning shades
+  "warning-25": $warning-25,
+  "warning-50": $warning-50,
+  "warning-100": $warning-100,
+  "warning-200": $warning-200,
+  "warning-300": $warning-300,
+  "warning-400": $warning-400,
+  "warning-500": $warning-500,
+  "warning-600": $warning-600,
+  "warning-700": $warning-700,
+  "warning-800": $warning-800,
+  "warning-900": $warning-900,
+  "warning-950": $warning-950,
+  // Danger/Error shades
+  "danger-25": $danger-25,
+  "danger-50": $danger-50,
+  "danger-100": $danger-100,
+  "danger-200": $danger-200,
+  "danger-300": $danger-300,
+  "danger-400": $danger-400,
+  "danger-500": $danger-500,
+  "danger-600": $danger-600,
+  "danger-700": $danger-700,
+  "danger-800": $danger-800,
+  "danger-900": $danger-900,
+  "danger-950": $danger-950,
+  // Lavender shades
+  "lavender-25": $lavender-25,
+  "lavender-50": $lavender-50,
+  "lavender-100": $lavender-100,
+  "lavender-200": $lavender-200,
+  "lavender-300": $lavender-300,
+  "lavender-400": $lavender-400,
+  "lavender-500": $lavender-500,
+  "lavender-600": $lavender-600,
+  "lavender-700": $lavender-700,
+  "lavender-800": $lavender-800,
+  "lavender-900": $lavender-900,
+  "lavender-950": $lavender-950,
+  // Neutral shades
+  "neutral-25": $neutral-25,
+  "neutral-50": $neutral-50,
+  "neutral-100": $neutral-100,
+  "neutral-200": $neutral-200,
+  "neutral-300": $neutral-300,
+  "neutral-400": $neutral-400,
+  "neutral-500": $neutral-500,
+  "neutral-600": $neutral-600,
+  "neutral-700": $neutral-700,
+  "neutral-800": $neutral-800,
+  "neutral-900": $neutral-900,
+  "neutral-950": $neutral-950
+);