73 lines
2.7 KiB
CSS
73 lines
2.7 KiB
CSS
/*
|
|
* AE Firefly — Axonius variant
|
|
* Primary: #ff6112 (Axonius)
|
|
* A minimal variant file that provides the primary color ramp and
|
|
* a couple of anchor / spacing tokens. This file follows the
|
|
* AE_Firefly_<Variant> naming pattern so it can be selected at runtime
|
|
* via the `data-theme` attribute on <html>.
|
|
*/
|
|
|
|
html[data-theme='AE_Firefly_Axonius'] {
|
|
--text-scaling: 1.067;
|
|
--background: var(--color-surface-50) !important;
|
|
--base-font-color: var(--color-surface-950);
|
|
--base-font-color-dark: var(--color-surface-50);
|
|
--base-font-family: system-ui, sans-serif;
|
|
--base-font-size: inherit;
|
|
--base-line-height: inherit;
|
|
--base-font-weight: normal;
|
|
--base-font-style: normal;
|
|
--base-letter-spacing: 0em;
|
|
--heading-font-color: inherit;
|
|
--heading-font-color-dark: inherit;
|
|
--heading-font-family: inherit;
|
|
--heading-font-weight: bold;
|
|
--heading-font-style: normal;
|
|
--heading-letter-spacing: inherit;
|
|
|
|
/* Anchors: Axonius orange in light, lighter in dark */
|
|
--anchor-font-color: var(--color-primary-600);
|
|
--anchor-font-color-dark: var(--color-primary-300);
|
|
--anchor-font-family: inherit;
|
|
--anchor-font-size: inherit;
|
|
--anchor-line-height: inherit;
|
|
--anchor-font-weight: inherit;
|
|
--anchor-font-style: inherit;
|
|
--anchor-letter-spacing: inherit;
|
|
--anchor-text-decoration: none;
|
|
--anchor-text-decoration-hover: underline;
|
|
--anchor-text-decoration-active: none;
|
|
--anchor-text-decoration-focus: none;
|
|
|
|
--spacing: 0.25rem;
|
|
--radius-base: 0.375rem;
|
|
--radius-container: 0.875rem;
|
|
|
|
/* Primary ramp (hex fallbacks centered on #ff6112) */
|
|
--color-primary-50: #fff5ef;
|
|
--color-primary-100: #ffe0d1;
|
|
--color-primary-200: #ffc7a8;
|
|
--color-primary-300: #ffad7f;
|
|
--color-primary-400: #ff9356;
|
|
--color-primary-500: #ff6112;
|
|
--color-primary-600: #e6550f;
|
|
--color-primary-700: #bf4b0d;
|
|
--color-primary-800: #993f0b;
|
|
--color-primary-900: #7c3509;
|
|
--color-primary-950: #5f2b08;
|
|
--color-primary-contrast-dark: var(--color-primary-950);
|
|
--color-primary-contrast-light: var(--color-primary-50);
|
|
}
|
|
|
|
/* Dark mode tweaks */
|
|
html.dark[data-theme='AE_Firefly_Axonius'] {
|
|
--background: var(--color-surface-950) !important;
|
|
/* Keep a minimal set of contrast tokens in dark mode */
|
|
--color-primary-contrast-50: var(--color-primary-contrast-dark);
|
|
--color-primary-contrast-100: var(--color-primary-contrast-dark);
|
|
--color-primary-contrast-200: var(--color-primary-contrast-dark);
|
|
--color-primary-contrast-300: var(--color-primary-contrast-dark);
|
|
--color-primary-contrast-400: var(--color-primary-contrast-dark);
|
|
--color-primary-contrast-500: var(--color-primary-contrast-light);
|
|
}
|