mirror of
https://github.com/IT4Change/Ocelot-Social.git
synced 2026-03-01 12:44:28 +00:00
56 lines
1.7 KiB
CSS
56 lines
1.7 KiB
CSS
@import "tailwindcss";
|
|
@import "../src/styles/animations.css";
|
|
|
|
/* Watercolor theme for Storybook - vibrant colors inspired by aquarelle paints */
|
|
/* All colors meet WCAG AA contrast requirements (4.5:1 for normal text) */
|
|
:root {
|
|
font-family: 'Inter Variable', system-ui, sans-serif;
|
|
|
|
/* Default (Buff / Raw Umber) - neutral button */
|
|
--color-default: #d8c9b8;
|
|
--color-default-hover: #c4b19c;
|
|
--color-default-active: #a89478;
|
|
--color-default-contrast: #3d2e1e;
|
|
--color-default-contrast-inverse: #ffffff;
|
|
|
|
/* Primary (Ultramarine Blue) */
|
|
--color-primary: #4a5a9e;
|
|
--color-primary-hover: #5e6db2;
|
|
--color-primary-active: #3b4882;
|
|
--color-primary-contrast: #ffffff;
|
|
|
|
/* Secondary (Dioxazine Violet) */
|
|
--color-secondary: #7b519a;
|
|
--color-secondary-hover: #9068ad;
|
|
--color-secondary-active: #654280;
|
|
--color-secondary-contrast: #ffffff;
|
|
|
|
/* Danger (Alizarin Crimson) */
|
|
--color-danger: #b83a4e;
|
|
--color-danger-hover: #cc5567;
|
|
--color-danger-active: #9a2e3f;
|
|
--color-danger-contrast: #ffffff;
|
|
|
|
/* Warning (Yellow Ochre / Raw Sienna) - dark amber, works as text on white */
|
|
--color-warning: #946b1d;
|
|
--color-warning-hover: #a87c28;
|
|
--color-warning-active: #7d5a15;
|
|
--color-warning-contrast: #ffffff;
|
|
|
|
/* Success (Viridian Green) */
|
|
--color-success: #3d7a5e;
|
|
--color-success-hover: #509470;
|
|
--color-success-active: #30644c;
|
|
--color-success-contrast: #ffffff;
|
|
|
|
/* Info (Cerulean Blue) */
|
|
--color-info: #387598;
|
|
--color-info-hover: #4e8bae;
|
|
--color-info-active: #2d6080;
|
|
--color-info-contrast: #ffffff;
|
|
|
|
/* Disabled (Payne's Grey - muted watercolor grey) */
|
|
--color-disabled: #c4bdb5;
|
|
--color-disabled-contrast: #5a4f45;
|
|
}
|