@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.46 → 0.2.47

package/src/themes/themes/harvey.ts

@@ -1,679 +0,0 @@
-import { MultiThemeConfig } from '../types';
-
-/**
- * Harvey Creative Theme
- * Modern, vibrant design with Inter font and warm burgundy/gold color palette
- */
-export const harveyTheme: MultiThemeConfig = {
-  fonts: {
-    primary: {
-      family: 'Inter',
-      fallbacks: ['ui-sans-serif', 'system-ui', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', '"Noto Sans"', 'sans-serif'],
-      weights: [300, 400, 500, 600, 700],
-      display: 'swap',
-      source: {
-        type: 'google'
-      },
-      sizes: {
-        xs: '0.75rem',
-        sm: '0.875rem',
-        md: '1rem',
-        lg: '1.125rem',
-        xl: '1.25rem',
-        '2xl': '1.5rem',
-        '3xl': '1.875rem',
-        '4xl': '2.25rem',
-        '5xl': '3rem',
-        '6xl': '3.75rem'
-      },
-      lineHeights: {
-        tight: '1.25',
-        normal: '1.5',
-        relaxed: '1.75',
-        loose: '2'
-      },
-      letterSpacing: {
-        tight: '-0.025em',
-        normal: '0em',
-        wide: '0.025em',
-        wider: '0.05em',
-        widest: '0.1em'
-      }
-    },
-    secondary: {
-      family: 'Inter',
-      fallbacks: ['ui-sans-serif', 'system-ui', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', '"Noto Sans"', 'sans-serif'],
-      weights: [300, 400, 500, 600, 700],
-      display: 'swap',
-      source: {
-        type: 'google'
-      },
-      sizes: {
-        xs: '0.75rem',
-        sm: '0.875rem',
-        md: '1rem',
-        lg: '1.125rem',
-        xl: '1.25rem',
-        '2xl': '1.5rem',
-        '3xl': '1.875rem',
-        '4xl': '2.25rem',
-        '5xl': '3rem',
-        '6xl': '3.75rem'
-      },
-      lineHeights: {
-        tight: '1.25',
-        normal: '1.5',
-        relaxed: '1.75',
-        loose: '2'
-      },
-      letterSpacing: {
-        tight: '-0.025em',
-        normal: '0em',
-        wide: '0.025em',
-        wider: '0.05em',
-        widest: '0.1em'
-      }
-    },
-    display: {
-      family: 'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif',
-      weights: [400, 500, 600, 700],
-      sizes: {
-        xs: '1.5rem',
-        sm: '1.875rem',
-        md: '2.25rem',
-        lg: '3rem',
-        xl: '3.75rem',
-        '2xl': '4.5rem',
-        '3xl': '6rem',
-        '4xl': '7.5rem',
-        '5xl': '9rem',
-        '6xl': '12rem'
-      },
-      lineHeights: {
-        tight: '1.1',
-        normal: '1.2',
-        relaxed: '1.3',
-        loose: '1.4'
-      },
-      letterSpacing: {
-        tight: '-0.02em',
-        normal: '-0.01em',
-        wide: '0em',
-        wider: '0.01em',
-        widest: '0.02em'
-      }
-    },
-    body: {
-      family: 'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif',
-      weights: [300, 400, 500],
-      sizes: {
-        xs: '0.75rem',
-        sm: '0.875rem',
-        md: '1rem',
-        lg: '1.125rem',
-        xl: '1.25rem',
-        '2xl': '1.5rem',
-        '3xl': '1.875rem',
-        '4xl': '2.25rem',
-        '5xl': '3rem',
-        '6xl': '3.75rem'
-      },
-      lineHeights: {
-        tight: '1.4',
-        normal: '1.6',
-        relaxed: '1.8',
-        loose: '2'
-      },
-      letterSpacing: {
-        tight: '-0.01em',
-        normal: '0em',
-        wide: '0.01em',
-        wider: '0.02em',
-        widest: '0.05em'
-      }
-    },
-    mono: {
-      family: 'ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace',
-      weights: [400, 500, 600],
-      sizes: {
-        xs: '0.75rem',
-        sm: '0.875rem',
-        md: '1rem',
-        lg: '1.125rem',
-        xl: '1.25rem',
-        '2xl': '1.5rem',
-        '3xl': '1.875rem',
-        '4xl': '2.25rem',
-        '5xl': '3rem',
-        '6xl': '3.75rem'
-      },
-      lineHeights: {
-        tight: '1.25',
-        normal: '1.5',
-        relaxed: '1.75',
-        loose: '2'
-      },
-      letterSpacing: {
-        tight: '-0.025em',
-        normal: '0em',
-        wide: '0.025em',
-        wider: '0.05em',
-        widest: '0.1em'
-      }
-    }
-  },
-  colors: {
-    primary: {
-      50: '#FBEAEA',
-      100: '#F4CFCF',
-      200: '#E8A9A9',
-      300: '#D97D7D',
-      400: '#C55A5A',
-      500: '#A3485A',
-      600: '#8C3447',
-      700: '#752737',
-      800: '#662222',
-      900: '#421414',
-      // RGB versions for rgba() usage
-      '500-rgb': '163, 72, 90',
-      '600-rgb': '140, 52, 71',
-      '700-rgb': '117, 39, 55'
-    },
-    secondary: {
-      50: '#FFF8E8',
-      100: '#FFF1D1',
-      200: '#FDE5B3',
-      300: '#F5DAA7',
-      400: '#EACF8D',
-      500: '#D9BA71',
-      600: '#BCA059',
-      700: '#9C8245',
-      800: '#7B6534',
-      900: '#544521'
-    },
-    semantic: {
-      success: '#1E824C',
-      warning: '#E6A23C',
-      error: '#D93025',
-      errorDark: '#A12017',
-      info: '#007BCE',
-      // RGB versions for rgba() usage
-      successRgb: '30, 130, 76',
-      warningRgb: '230, 162, 60',
-      errorRgb: '217, 48, 37',
-      errorDarkRgb: '161, 32, 23',
-      infoRgb: '0, 123, 206',
-      // Additional RGB versions referenced in CSS
-      'success-rgb': '30, 130, 76',
-      'warning-rgb': '230, 162, 60',
-      'error-rgb': '217, 48, 37',
-      'error-dark-rgb': '161, 32, 23',
-      'info-rgb': '0, 123, 206'
-    },
-    neutral: {
-      50: '#FAFAFA',
-      100: '#F4F4F4',
-      200: '#E8E8E8',
-      300: '#D1D1D1',
-      400: '#B5B5B5',
-      500: '#999999',
-      600: '#7A7A7A',
-      700: '#5C5C5C',
-      800: '#3D3D3D',
-      900: '#1E1E1E'
-    },
-    surface: {
-      background: '#FFF9F3',
-      surface: '#FFFFFF',
-      border: '#EAD7C0',
-      divider: '#F0E2D0'
-    },
-    text: {
-      primary: '#2B1212',
-      secondary: '#5E3A3A',
-      muted: '#8C6F6F',
-      inverse: '#FFFFFF',
-      onPrimary: '#FFFFFF',
-      onSecondary: '#2B1212',
-      onSurface: '#2B1212'
-    },
-    interactive: {
-      hover: '#842A3B',
-      active: '#662222',
-      focus: '#A3485A',
-      disabled: '#C9B6B6'
-    },
-    // Additional colors referenced in CSS
-    accent: '#F5DAA7',
-    'bg-primary': '#FBEAEA',
-    'bg-secondary': '#FFF1D1',
-    'surface-bg': '#FFF9F3',
-    // Additional missing CSS variables
-    'primary-hover': '#842A3B',
-    'primary-active': '#662222',
-    'accent-rgb': '245, 218, 167',
-    'border': '#EAD7C0',
-    // Border semantic variables
-    'border-transparent': 'transparent',
-    // Text colors referenced in CSS
-    'text-primary': '#2B1212',
-    'text-secondary': '#5E3A3A'
-  },
-  navigation: {
-    layout: 'horizontal',
-    style: 'enhanced',
-    behavior: 'static',
-    responsive: 'mobile-first',
-    animations: {
-      duration: {
-        fast: '0.15s',
-        normal: '0.2s',
-        slow: '0.3s',
-        instant: '0s'
-      },
-      easing: {
-        linear: 'linear',
-        ease: 'ease',
-        easeIn: 'ease-in',
-        easeOut: 'ease-out',
-        easeInOut: 'ease-in-out',
-        bounce: 'cubic-bezier(0.68, -0.55, 0.265, 1.55)',
-        elastic: 'cubic-bezier(0.175, 0.885, 0.32, 1.275)'
-      },
-      stagger: {
-        enabled: true,
-        delay: '0.05s',
-        direction: 'forward'
-      },
-      transitions: {
-        enter: '0.2s ease-out',
-        exit: '0.15s ease-in',
-        move: '0.2s ease',
-        resize: '0.1s ease'
-      }
-    },
-    spacing: {
-      container: '1rem',
-      item: '0.5rem',
-      group: '1rem',
-      divider: '0.25rem',
-      icon: '0.5rem',
-      text: '0.25rem',
-      padding: {
-        horizontal: '1rem',
-        vertical: '0.75rem',
-        top: '0.75rem',
-        right: '1rem',
-        bottom: '0.75rem',
-        left: '1rem'
-      },
-      margin: {
-        horizontal: '0.5rem',
-        vertical: '0.25rem',
-        top: '0.25rem',
-        right: '0.5rem',
-        bottom: '0.25rem',
-        left: '0.5rem'
-      }
-    },
-    colors: {
-      background: {
-        primary: '#ffffff',
-        secondary: '#FFF9F3',
-        tertiary: '#FAFAFA',
-        light: '#ffffff',
-        dark: '#2B1212',
-        contrast: '#000000'
-      },
-      text: {
-        primary: '#2B1212',
-        secondary: '#5E3A3A',
-        tertiary: '#8C6F6F',
-        light: '#B5B5B5',
-        dark: '#2B1212',
-        contrast: '#ffffff'
-      },
-      border: {
-        primary: '#EAD7C0',
-        secondary: '#F0E2D0',
-        tertiary: '#B5B5B5',
-        light: '#F4F4F4',
-        dark: '#5E3A3A',
-        contrast: '#000000'
-      },
-      accent: {
-        primary: '#A3485A',
-        secondary: '#8C3447',
-        tertiary: '#752737',
-        light: '#E8A9A9',
-        dark: '#8C3447',
-        contrast: '#ffffff'
-      },
-      hover: {
-        primary: '#FFF9F3',
-        secondary: '#FAFAFA',
-        tertiary: '#F4F4F4',
-        light: '#ffffff',
-        dark: '#421414',
-        contrast: '#FFF9F3'
-      },
-      active: {
-        primary: '#A3485A',
-        secondary: '#8C3447',
-        tertiary: '#752737',
-        light: '#E8A9A9',
-        dark: '#8C3447',
-        contrast: '#ffffff'
-      },
-      disabled: {
-        primary: '#F4F4F4',
-        secondary: '#E8E8E8',
-        tertiary: '#D1D1D1',
-        light: '#FAFAFA',
-        dark: '#8C6F6F',
-        contrast: '#B5B5B5'
-      },
-      focus: {
-        primary: '#A3485A',
-        secondary: '#8C3447',
-        tertiary: '#752737',
-        light: '#E8A9A9',
-        dark: '#8C3447',
-        contrast: '#ffffff'
-      }
-    },
-    typography: {
-      fontFamily: 'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif',
-      fontSize: {
-        xs: '0.75rem',
-        sm: '0.875rem',
-        base: '1rem',
-        lg: '1.125rem',
-        xl: '1.25rem',
-        '2xl': '1.5rem'
-      },
-      fontWeight: {
-        light: '300',
-        normal: '400',
-        medium: '500',
-        semibold: '600',
-        bold: '700'
-      },
-      lineHeight: {
-        tight: '1.25',
-        normal: '1.5',
-        relaxed: '1.75',
-        loose: '2'
-      },
-      letterSpacing: {
-        tight: '-0.025em',
-        normal: '0',
-        wide: '0.025em',
-        wider: '0.05em'
-      }
-    },
-    breakpoints: {
-      mobile: '640px',
-      tablet: '768px',
-      desktop: '1024px',
-      wide: '1280px',
-      ultra: '1536px'
-    }
-  },
-  spacing: {
-    scale: {
-      xs: '0.25rem',
-      sm: '0.5rem',
-      md: '1rem',
-      lg: '1.5rem',
-      xl: '2rem',
-      '2xl': '3rem',
-      '3xl': '4rem',
-      '4xl': '6rem',
-      '5xl': '8rem',
-      '6xl': '12rem'
-    },
-    component: {
-      button: {
-        padding: '0.75rem 1.5rem',
-        margin: '0.5rem',
-        gap: '0.5rem'
-      },
-      input: {
-        padding: '0.75rem 1rem',
-        margin: '0.5rem',
-        gap: '0.5rem'
-      },
-      card: {
-        padding: '1.5rem',
-        margin: '1rem',
-        gap: '1rem'
-      }
-    },
-    layout: {
-      page: '2rem',
-      section: '3rem',
-      container: '1rem',
-      grid: '1.5rem'
-    }
-  },
-  shadows: {
-    sm: '0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)',
-    md: '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',
-    lg: '0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)',
-    xl: '0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)',
-    '2xl': '0 25px 50px -12px rgb(249 115 22 / 0.25)',
-    inner: 'inset 0 2px 4px 0 rgb(0 0 0 / 0.06)',
-    none: '0 0 #0000'
-  },
-  transitions: {
-    duration: {
-      fast: '0.15s',
-      normal: '0.2s',
-      slow: '0.3s'
-    },
-    easing: {
-      linear: 'linear',
-      ease: 'ease',
-      easeIn: 'ease-in',
-      easeOut: 'ease-out',
-      easeInOut: 'ease-in-out'
-    },
-    properties: {
-      colors: '0.2s ease',
-      transform: '0.2s ease',
-      opacity: '0.15s ease',
-      shadow: '0.2s ease'
-    }
-  },
-  borderRadius: {
-    none: '0',
-    sm: '0.125rem',
-    md: '0.375rem',
-    lg: '0.5rem',
-    xl: '0.75rem',
-    '2xl': '1rem',
-    full: '9999px'
-  },
-  borderWidth: {
-    none: '0',
-    thin: '0.5px',
-    normal: '1px',
-    focus: '2px',
-    thick: '3px',
-    extraThick: '4px'
-  },
-  animation: {
-    duration: {
-      fast: '0.3s',
-      normal: '0.2s',
-      slow: '1.5s'
-    },
-    easing: {
-      linear: 'linear',
-      ease: 'ease',
-      easeIn: 'ease-in',
-      easeOut: 'ease-out',
-      easeInOut: 'ease-in-out'
-    },
-    transforms: {
-      hoverY: '-2px',
-      offsetY: '10px',
-      scale: '1.02'
-    }
-  },
-  accessibility: {
-    focusRing: {
-      width: '3px',
-      offset: '2px',
-      color: 'var(--cs-colors-interactive-focus)'
-    },
-    outline: {
-      offset: '2px'
-    },
-    highContrast: {
-      borderWidth: '2px',
-      outlineWidth: '4px'
-    },
-    disabled: {
-      cursor: 'not-allowed',
-      opacity: '0.7'
-    }
-  },
-  print: {
-    borderColor: '#000',
-    textColor: '#000',
-    textSecondaryColor: '#333',
-    backgroundColor: 'transparent'
-  },
-  containerQuery: {
-    small: '400px',
-    medium: '600px',
-    large: '800px'
-  },
-  container: {
-    width: {
-      small: '16rem',
-      medium: '20rem',
-      large: '24rem',
-      xl: '32rem',
-      full: '100%'
-    }
-  },
-  shimmer: {
-    alpha: '0.2',
-    color: 'rgba(255, 255, 255, 0.2)'
-  },
-  meta: {
-    name: 'Harvey Creative',
-    description: 'Modern, vibrant design system with Inter typography and warm burgundy/gold color palette for creative projects',
-    author: 'Harvey Design Team',
-    version: '1.0.0',
-    category: 'creative',
-    tags: ['modern', 'vibrant', 'creative', 'inter', 'burgundy', 'gold', 'warm'],
-    preview: '/themes/harvey-creative-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: '#2B1212',
-          100: '#421414',
-          200: '#662222',
-          300: '#752737',
-          400: '#8C3447',
-          500: '#A3485A',
-          600: '#C55A5A',
-          700: '#D97D7D',
-          800: '#E8A9A9',
-          900: '#FBEAEA',
-          // RGB versions for rgba() usage
-          '500-rgb': '163, 72, 90',
-          '600-rgb': '197, 90, 90',
-          '700-rgb': '217, 125, 125'
-        },
-        secondary: {
-          50: '#2E2314',
-          100: '#3E2E17',
-          200: '#5E4722',
-          300: '#7B6534',
-          400: '#9C8245',
-          500: '#BCA059',
-          600: '#D9BA71',
-          700: '#EACF8D',
-          800: '#F5DAA7',
-          900: '#FFF1D1'
-        },
-        semantic: {
-          success: '#34D399',
-          warning: '#FBBF24',
-          error: '#F87171',
-          errorDark: '#B91C1C',
-          info: '#60A5FA',
-          // RGB versions for rgba() usage
-          successRgb: '52, 211, 153',
-          warningRgb: '251, 191, 36',
-          errorRgb: '248, 113, 113',
-          errorDarkRgb: '185, 28, 28',
-          infoRgb: '96, 165, 250',
-          // Additional RGB versions referenced in CSS
-          'success-rgb': '52, 211, 153',
-          'warning-rgb': '251, 191, 36',
-          'error-rgb': '248, 113, 113',
-          'error-dark-rgb': '185, 28, 28',
-          'info-rgb': '96, 165, 250'
-        },
-        neutral: {
-          50: '#121212',
-          100: '#1A1A1A',
-          200: '#232323',
-          300: '#2E2E2E',
-          400: '#3C3C3C',
-          500: '#565656',
-          600: '#7A7A7A',
-          700: '#A0A0A0',
-          800: '#C5C5C5',
-          900: '#E8E8E8'
-        },
-        surface: {
-          background: '#1B0D0D',
-          surface: '#2B1212',
-          border: '#3C1818',
-          divider: '#4A2222'
-        },
-        text: {
-          primary: '#F5DAA7',
-          secondary: '#EACF8D',
-          muted: '#C9B6B6',
-          inverse: '#1B0D0D',
-          onPrimary: '#1B0D0D',
-          onSecondary: '#1B0D0D',
-          onSurface: '#F5DAA7'
-        },
-        interactive: {
-          hover: '#A3485A',
-          active: '#842A3B',
-          focus: '#C55A5A',
-          disabled: '#3C1818'
-        },
-        // Additional colors referenced in CSS
-        accent: '#EACF8D',
-        'bg-primary': '#2B1212',
-        'bg-secondary': '#3E2E17',
-        'surface-bg': '#1B0D0D',
-        // Additional missing CSS variables
-        'primary-hover': '#C55A5A',
-        'primary-active': '#E8A9A9',
-        'accent-rgb': '234, 207, 141',
-        'border': '#3C1818',
-        // Text colors referenced in CSS
-        'text-primary': '#F5DAA7',
-        'text-secondary': '#EACF8D'
-      }
-    }
-  }
-};