79 lines
2.2 KiB
SCSS
79 lines
2.2 KiB
SCSS
// =============================================================================
|
|
// Color Palette — edit these to change the entire site's color scheme
|
|
// =============================================================================
|
|
|
|
// Primary palette
|
|
$primary-blue: #1a3a5c;
|
|
$primary-blue-light: #2a5a8c;
|
|
$primary-blue-dark: #0e2440;
|
|
$primary-blue-muted: #3a6a9c;
|
|
|
|
// Accent palette
|
|
$accent-orange: #e87a2e;
|
|
$accent-orange-light: #f09a4e;
|
|
$accent-orange-dark: #c85a1e;
|
|
$accent-orange-muted: #f0a86a;
|
|
|
|
// Neutrals
|
|
$neutral-white: #ffffff;
|
|
$neutral-cream: #faf6f0;
|
|
$neutral-light: #f0ebe3;
|
|
$neutral-medium: #8a8580;
|
|
$neutral-dark: #3a3632;
|
|
$neutral-black: #1a1816;
|
|
|
|
// Semantic
|
|
$success-green: #4a9e4f;
|
|
$danger-red: #c83030;
|
|
$info-blue: #3a8abf;
|
|
|
|
// Gradients
|
|
$sky-gradient: linear-gradient(135deg, $primary-blue-dark 0%, $primary-blue 40%, $primary-blue-light 100%);
|
|
$sunset-gradient: linear-gradient(135deg, $accent-orange-dark 0%, $accent-orange 50%, $accent-orange-light 100%);
|
|
$mixed-gradient: linear-gradient(135deg, $primary-blue-dark 0%, $primary-blue 50%, $accent-orange 100%);
|
|
|
|
// Typography
|
|
$font-primary: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
$font-heading: 'Georgia', 'Times New Roman', serif;
|
|
$font-mono: 'Courier New', Courier, monospace;
|
|
|
|
// Spacing
|
|
$spacing-xs: 0.25rem;
|
|
$spacing-sm: 0.5rem;
|
|
$spacing-md: 1rem;
|
|
$spacing-lg: 2rem;
|
|
$spacing-xl: 3rem;
|
|
$spacing-2xl: 4rem;
|
|
$spacing-3xl: 6rem;
|
|
|
|
// Border radius
|
|
$radius-sm: 4px;
|
|
$radius-md: 8px;
|
|
$radius-lg: 16px;
|
|
$radius-xl: 24px;
|
|
$radius-full: 50%;
|
|
|
|
// Shadows
|
|
$shadow-sm: 0 1px 3px rgba(0,0,0,0.12);
|
|
$shadow-md: 0 4px 12px rgba(0,0,0,0.15);
|
|
$shadow-lg: 0 8px 30px rgba(0,0,0,0.18);
|
|
$shadow-xl: 0 12px 40px rgba(0,0,0,0.22);
|
|
|
|
// Breakpoints
|
|
$bp-sm: 576px;
|
|
$bp-md: 768px;
|
|
$bp-lg: 992px;
|
|
$bp-xl: 1200px;
|
|
|
|
// Transitions
|
|
$transition-fast: 150ms ease;
|
|
$transition-normal: 300ms ease;
|
|
$transition-slow: 500ms ease;
|
|
|
|
// Z-index scale
|
|
$z-dropdown: 100;
|
|
$z-sticky: 200;
|
|
$z-overlay: 300;
|
|
$z-modal: 400;
|
|
$z-toast: 500;
|