@casoon/dragonfly
Version:
Modular, lightweight CSS framework and design system for modern web projects. Optimized for Astro JS, LightningCSS and Container Queries with @layer-based architecture and comprehensive accessibility.
42 lines (36 loc) • 1.03 kB
CSS
/**
* Day Theme Variant
*
* Standalone theme variant that can be loaded independently.
* Uses [data-theme="day"] scope for activation.
* CDN-compatible and opt-in via import or JS.
*
* @layer themes.variants
*/
@layer themes.variants {
[data-theme="day"] {
/* Primary Colors - Day indigo */
--color-primary: #2563eb;
--color-secondary: #7c3aed;
/* Status Colors */
--color-success: #10b981;
--color-warning: #f59e0b;
--color-error: #ef4444;
--color-info: #06b6d4;
/* Text Colors */
--color-text: #1f2937;
--color-text-muted: #6b7280;
--color-text-inverse: #fff;
/* Surface Colors */
--color-background: #fff;
--color-surface: #f9fafb;
--color-surface-elevated: #fff;
/* Border Colors */
--color-border: #e5e7eb;
--color-border-strong: #d1d5db;
/* Transition Colors for smooth animations */
--color-transition-primary: #2563eb;
--color-transition-surface: #fff;
--color-transition-text: #1f2937;
}
}