Files
frp/web/frpc/src/assets/css/_variables.scss

62 lines
1.5 KiB
SCSS

// Typography
$font-size-xs: 11px;
$font-size-sm: 13px;
$font-size-md: 14px;
$font-size-lg: 15px;
$font-size-xl: 18px;
$font-weight-normal: 400;
$font-weight-medium: 500;
$font-weight-semibold: 600;
// Colors - Text
$color-text-primary: var(--color-text-primary);
$color-text-secondary: var(--color-text-secondary);
$color-text-muted: var(--color-text-muted);
$color-text-light: var(--color-text-light);
// Colors - Background
$color-bg-primary: var(--color-bg-primary);
$color-bg-secondary: var(--color-bg-secondary);
$color-bg-tertiary: var(--color-bg-tertiary);
$color-bg-muted: var(--color-bg-muted);
$color-bg-hover: var(--color-bg-hover);
$color-bg-active: var(--color-bg-active);
// Colors - Border
$color-border: var(--color-border);
$color-border-light: var(--color-border-light);
$color-border-lighter: var(--color-border-lighter);
// Colors - Status
$color-primary: var(--color-primary);
$color-danger: var(--color-danger);
$color-danger-dark: var(--color-danger-dark);
$color-danger-light: var(--color-danger-light);
// Colors - Button
$color-btn-primary: var(--color-btn-primary);
$color-btn-primary-hover: var(--color-btn-primary-hover);
// Spacing
$spacing-xs: 4px;
$spacing-sm: 8px;
$spacing-md: 12px;
$spacing-lg: 16px;
$spacing-xl: 20px;
// Border Radius
$radius-sm: 6px;
$radius-md: 8px;
// Transitions
$transition-fast: 0.15s ease;
$transition-medium: 0.2s ease;
// Layout
$header-height: 50px;
$sidebar-width: 200px;
// Breakpoints
$breakpoint-mobile: 768px;