@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.10 → 0.2.16

package/{dist/theme.d.ts → src/themes/themes/default.ts}

@@ -1,5 +1,12 @@
+import { MultiThemeConfig } from '../types';
 
-export const stanDesignTheme: MultiThemeConfig = {
+/**
+ * Default Base Theme Configuration
+ * This serves as the foundation for all other themes.
+ * Based on Stan Design theme - the primary brand theme.
+ * Any undefined values in specific themes will fall back to these defaults.
+ */
+export const defaultTheme: MultiThemeConfig = {
   fonts: {
     primary: {
       family: 'Clash Display',
@@ -170,46 +177,46 @@ export const stanDesignTheme: MultiThemeConfig = {
       200: '#bfdbfe',
       300: '#93c5fd',
       400: '#60a5fa',
-      500: '#2563eb', // Updated to match original poker project
-      600: '#1d4ed8',
-      700: '#1e40af',
-      800: '#1e3a8a',
+      500: '#3b82f6', // This is the main primary color
+      600: '#2563eb',
+      700: '#1d4ed8',
+      800: '#1e40af',
       900: '#1e3a8a',
       // RGB versions for rgba() usage
-      '500-rgb': '37, 99, 235',
-      '600-rgb': '29, 78, 216',
-      '700-rgb': '30, 64, 175'
+      '500-rgb': '59, 130, 246',
+      '600-rgb': '37, 99, 235',
+      '700-rgb': '29, 78, 216'
     },
     secondary: {
-      50: '#f9fafb',
-      100: '#f3f4f6',
-      200: '#e5e7eb',
-      300: '#d1d5db',
-      400: '#9ca3af',
-      500: '#6b7280',
-      600: '#4b5563',
-      700: '#374151',
-      800: '#1f2937',
-      900: '#111827'
+      50: '#f8fafc',
+      100: '#f1f5f9',
+      200: '#e2e8f0',
+      300: '#cbd5e1',
+      400: '#94a3b8',
+      500: '#64748b',
+      600: '#475569',
+      700: '#334155',
+      800: '#1e293b',
+      900: '#0f172a'
     },
     semantic: {
-      success: '#059669', // Updated to match original poker project
+      success: '#10b981',
       warning: '#f59e0b',
       error: '#ef4444',
       errorDark: '#dc2626', // Darker red for destructive hover states
-      info: '#2563eb', // Updated to match original poker project
+      info: '#3b82f6',
       // RGB versions for rgba() usage
-      successRgb: '5, 150, 105',
+      successRgb: '16, 185, 129',
       warningRgb: '245, 158, 11',
       errorRgb: '239, 68, 68',
       errorDarkRgb: '220, 38, 38',
-      infoRgb: '37, 99, 235',
+      infoRgb: '59, 130, 246',
       // Additional RGB versions referenced in CSS
-      'success-rgb': '5, 150, 105',
+      'success-rgb': '16, 185, 129',
       'warning-rgb': '245, 158, 11',
       'error-rgb': '239, 68, 68',
       'error-dark-rgb': '220, 38, 38',
-      'info-rgb': '37, 99, 235'
+      'info-rgb': '59, 130, 246'
     },
     neutral: {
       50: '#fafafa',
@@ -225,40 +232,40 @@ export const stanDesignTheme: MultiThemeConfig = {
     },
     surface: {
       background: '#ffffff',
-      surface: '#f3f4f6', // Updated to match original poker project
-      border: '#e5e7eb', // Updated to match original poker project
-      divider: '#d1d5db' // Updated to match original poker project
+      surface: '#f8fafc',
+      border: '#e2e8f0',
+      divider: '#cbd5e1'
     },
     text: {
-      primary: '#111827', // Updated to match original poker project
-      secondary: '#4b5563', // Updated to match original poker project
-      muted: '#6b7280', // Updated to match original poker project
+      primary: '#0f172a',
+      secondary: '#475569',
+      muted: '#64748b',
       inverse: '#ffffff',
       onPrimary: '#ffffff',
       onSecondary: '#ffffff',
-      onSurface: '#111827' // Updated to match original poker project
+      onSurface: '#0f172a'
     },
     interactive: {
-      hover: '#f8fafc', // Updated to match original poker project
-      active: '#f3f4f6', // Updated to match original poker project
-      focus: '#2563eb', // Updated to match original poker project
-      disabled: '#d1d5db' // Updated to match original poker project
+      hover: '#f1f5f9',
+      active: '#e2e8f0',
+      focus: '#3b82f6',
+      disabled: '#cbd5e1'
     },
     // Additional colors referenced in CSS
     accent: '#6366f1',
     'bg-primary': '#ffffff',
-    'bg-secondary': '#f3f4f6', // Updated to match original poker project
-    'surface-bg': '#f3f4f6', // Updated to match original poker project
+    'bg-secondary': '#f8fafc',
+    'surface-bg': '#f8fafc',
     // Additional missing CSS variables
-    'primary-hover': '#1d4ed8', // Updated to match original poker project
-    'primary-active': '#1e40af', // Updated to match original poker project
+    'primary-hover': '#2563eb',
+    'primary-active': '#1d4ed8',
     'accent-rgb': '99, 102, 241',
-    'border': '#e5e7eb', // Updated to match original poker project
+    'border': '#e2e8f0',
     // Border semantic variables
     'border-transparent': 'transparent',
     // Text colors referenced in CSS
-    'text-primary': '#111827', // Updated to match original poker project
-    'text-secondary': '#4b5563' // Updated to match original poker project
+    'text-primary': '#0f172a',
+    'text-secondary': '#475569'
   },
   navigation: {
     layout: 'horizontal',
@@ -320,66 +327,66 @@ export const stanDesignTheme: MultiThemeConfig = {
     colors: {
       background: {
         primary: '#ffffff',
-        secondary: '#f3f4f6', // Updated to match original poker project
-        tertiary: '#f8fafc', // Updated to match original poker project
+        secondary: '#f8fafc',
+        tertiary: '#f1f5f9',
         light: '#ffffff',
         dark: '#0f172a',
         contrast: '#000000'
       },
       text: {
-        primary: '#111827', // Updated to match original poker project
-        secondary: '#4b5563', // Updated to match original poker project
-        tertiary: '#6b7280', // Updated to match original poker project
-        light: '#9ca3af', // Updated to match original poker project
+        primary: '#0f172a',
+        secondary: '#475569',
+        tertiary: '#64748b',
+        light: '#94a3b8',
         dark: '#0f172a',
         contrast: '#ffffff'
       },
       border: {
-        primary: '#e5e7eb', // Updated to match original poker project
-        secondary: '#d1d5db', // Updated to match original poker project
-        tertiary: '#9ca3af', // Updated to match original poker project
-        light: '#f8fafc', // Updated to match original poker project
+        primary: '#e2e8f0',
+        secondary: '#cbd5e1',
+        tertiary: '#94a3b8',
+        light: '#f1f5f9',
         dark: '#475569',
         contrast: '#000000'
       },
       accent: {
-        primary: '#2563eb', // Updated to match original poker project
+        primary: '#3b82f6',
         secondary: '#6366f1',
         tertiary: '#8b5cf6',
         light: '#dbeafe',
-        dark: '#1d4ed8', // Updated to match original poker project
+        dark: '#1d4ed8',
         contrast: '#ffffff'
       },
       hover: {
-        primary: '#f8fafc', // Updated to match original poker project
-        secondary: '#f3f4f6', // Updated to match original poker project
-        tertiary: '#d1d5db', // Updated to match original poker project
+        primary: '#f1f5f9',
+        secondary: '#e2e8f0',
+        tertiary: '#cbd5e1',
         light: '#ffffff',
         dark: '#1e293b',
         contrast: '#f8fafc'
       },
       active: {
-        primary: '#2563eb', // Updated to match original poker project
+        primary: '#3b82f6',
         secondary: '#6366f1',
         tertiary: '#8b5cf6',
         light: '#dbeafe',
-        dark: '#1d4ed8', // Updated to match original poker project
+        dark: '#1d4ed8',
         contrast: '#ffffff'
       },
       disabled: {
-        primary: '#f8fafc', // Updated to match original poker project
-        secondary: '#f3f4f6', // Updated to match original poker project
-        tertiary: '#d1d5db', // Updated to match original poker project
-        light: '#f3f4f6', // Updated to match original poker project
+        primary: '#f1f5f9',
+        secondary: '#e2e8f0',
+        tertiary: '#cbd5e1',
+        light: '#f8fafc',
         dark: '#475569',
         contrast: '#94a3b8'
       },
       focus: {
-        primary: '#2563eb', // Updated to match original poker project
+        primary: '#3b82f6',
         secondary: '#6366f1',
         tertiary: '#8b5cf6',
         light: '#dbeafe',
-        dark: '#1d4ed8', // Updated to match original poker project
+        dark: '#1d4ed8',
         contrast: '#ffffff'
       }
     },
@@ -566,113 +573,14 @@ export const stanDesignTheme: MultiThemeConfig = {
     color: 'rgba(255, 255, 255, 0.2)'
   },
   meta: {
-    name: 'Stan Design',
-    description: 'Modern, professional design system with Clash Display typography and comprehensive theming',
-    author: 'Stan Design Team',
+    name: 'Default',
+    description: 'Default base theme configuration based on Stan Design - the primary brand theme',
+    author: 'Theme System',
     version: '1.0.0',
     category: 'brand',
-    tags: ['modern', 'professional', 'typography', 'clash-display', 'comprehensive'],
-    preview: '/themes/stan-design-preview.png',
+    tags: ['default', 'fallback', 'base', 'brand', 'clash-display', 'professional'],
+    preview: '/themes/default-preview.png',
     createdAt: '2024-12-01T00:00:00.000Z',
     updatedAt: '2024-12-01T00:00:00.000Z'
-  },
-
-  // NEW: Add dark mode overrides
-  modes: {
-    dark: {
-      colors: {
-        primary: {
-          50: '#1e3a8a',
-          100: '#1e40af',
-          200: '#1d4ed8',
-          300: '#2563eb',
-          400: '#3b82f6',
-          500: '#60a5fa',
-          600: '#93c5fd',
-          700: '#bfdbfe',
-          800: '#dbeafe',
-          900: '#eff6ff',
-          // RGB versions for rgba() usage
-          '500-rgb': '96, 165, 250',
-          '600-rgb': '147, 197, 253',
-          '700-rgb': '191, 219, 254'
-        },
-        secondary: {
-          50: '#111827',
-          100: '#1f2937',
-          200: '#374151',
-          300: '#4b5563',
-          400: '#6b7280',
-          500: '#9ca3af',
-          600: '#d1d5db',
-          700: '#e5e7eb',
-          800: '#f3f4f6',
-          900: '#f9fafb'
-        },
-        semantic: {
-          success: '#10b981',
-          warning: '#fbbf24',
-          error: '#f87171',
-          info: '#60a5fa',
-          // RGB versions for rgba() usage
-          successRgb: '16, 185, 129',
-          warningRgb: '251, 191, 36',
-          errorRgb: '248, 113, 113',
-          infoRgb: '96, 165, 250',
-          // Additional RGB versions referenced in CSS
-          'success-rgb': '16, 185, 129',
-          'warning-rgb': '251, 191, 36',
-          'error-rgb': '248, 113, 113',
-          'info-rgb': '96, 165, 250'
-        },
-        neutral: {
-          50: '#171717',
-          100: '#262626',
-          200: '#404040',
-          300: '#525252',
-          400: '#737373',
-          500: '#a3a3a3',
-          600: '#d4d4d4',
-          700: '#e5e5e5',
-          800: '#f5f5f5',
-          900: '#fafafa'
-        },
-        surface: {
-          background: '#0f172a',
-          surface: '#1e293b',
-          border: '#334155',
-          divider: '#475569'
-        },
-        text: {
-          primary: '#f8fafc',
-          secondary: '#cbd5e1',
-          muted: '#94a3b8',
-          inverse: '#0f172a',
-          onPrimary: '#0f172a',
-          onSecondary: '#0f172a',
-          onSurface: '#f8fafc'
-        },
-        interactive: {
-          hover: '#475569',
-          active: '#1e293b',
-          focus: '#3b82f6',
-          disabled: '#475569'
-        },
-        // Additional colors referenced in CSS
-        accent: '#8b5cf6',
-        'bg-primary': '#0f172a',
-        'bg-secondary': '#1e293b',
-        'surface-bg': '#1e293b',
-        // Additional missing CSS variables
-        'primary-hover': '#3b82f6',
-        'primary-active': '#60a5fa',
-        'accent-rgb': '139, 92, 246',
-        'border': '#334155',
-        // Text colors referenced in CSS
-        'text-primary': '#f8fafc',
-        'text-secondary': '#cbd5e1'
-      },
-
-      }
   }
 };