2025-06-18 18:38:20 +03:00
|
|
|
:root {
|
2025-08-10 17:05:40 +03:00
|
|
|
--citrus-primary: var(--primary);
|
|
|
|
|
--citrus-secondary: var(--secondary);
|
|
|
|
|
--citrus-light: color-mix(in lch, var(--citrus-primary), var(--light) 70%);
|
|
|
|
|
--citrus-dark: color-mix(in lch, var(--citrus-secondary), var(--dark) 60%);
|
2025-10-14 19:40:29 +03:00
|
|
|
--citrus-light-extra: color-mix(in lch, var(--citrus-light), var(--light));
|
|
|
|
|
--citrus-dark-extra: color-mix(in lch, var(--citrus-dark), var(--dark));
|
2025-06-25 13:08:50 +03:00
|
|
|
--citrus-mix: color-mix(in lch,var(--citrus-primary),var(--citrus-secondary));
|
2025-10-14 19:40:29 +03:00
|
|
|
--citrus-mix-light: color-mix(in lch, var(--citrus-light), var(--citrus-mix));
|
|
|
|
|
--citrus-mix-dark: color-mix(in lch, var(--citrus-dark), var(--citrus-mix));
|
|
|
|
|
--shadow-light: 0.2rem 0.2rem 0.2rem 0.1rem #0002;
|
|
|
|
|
--shadow-heavy: 0.2rem 0.2rem 0.4rem 0.2rem #0004;
|
2025-06-25 13:08:50 +03:00
|
|
|
--checker: url("/assets/img/theme/citrus/checker.png");
|
|
|
|
|
--dot: url("/assets/img/theme/citrus/dot.png");
|
2025-08-10 17:05:40 +03:00
|
|
|
--lined: url("/assets/img/theme/citrus/line.png");
|
2025-06-25 13:08:50 +03:00
|
|
|
--paper: url("/assets/img/theme/citrus/paper.png");
|
|
|
|
|
--noise: url("/assets/img/theme/citrus/imagedoc-lightnoise.png");
|
2025-08-10 17:05:40 +03:00
|
|
|
--border: url("/assets/img/theme/citrus/border.png");
|
2025-10-14 19:40:29 +03:00
|
|
|
--nav-bg: var(--dot), linear-gradient(var(--citrus-primary), var(--citrus-secondary) 60%, var(--citrus-primary) 120%);
|
|
|
|
|
--button-bg: linear-gradient(var(--citrus-primary) 30%, var(--citrus-mix) 80%);
|
|
|
|
|
--button-border: 2px solid var(--citrus-dark);
|
|
|
|
|
--button-shine: inset 0px 2px var(--citrus-light), inset 0px -2px var(--citrus-mix);
|
|
|
|
|
--button-hover-bg: linear-gradient(var(--citrus-light),var(--citrus-primary),var(--citrus-mix-light));
|
|
|
|
|
--button-hover-border: 2px solid var(--citrus-light);
|
|
|
|
|
--button-hover-shine: inset 0 -2px 0 0 var(--citrus-mix);
|
|
|
|
|
--button-current-bg: linear-gradient(var(--citrus-mix-dark),var(--citrus-dark-extra) 200%);
|
|
|
|
|
--button-current-border: 2px solid var(--citrus-dark-extra);
|
|
|
|
|
--button-current-shine: inset 0px 2px 0 var(--citrus-mix-light), inset 0 -2px 0 var(--citrus-mix-dark);
|
|
|
|
|
--details-bg: linear-gradient(-45deg,var(--citrus-primary),var(--citrus-mix),var(--citrus-primary));
|
|
|
|
|
--details-shine: inset 0 2px 0 var(--citrus-light-extra), inset 2px 0 0 var(--citrus-light), inset 0 -2px 0 var(--citrus-primary), inset -2px 0 0 var(--citrus-primary);
|
|
|
|
|
--details-border: 2px solid var(--citrus-dark);
|
|
|
|
|
}
|
