统一交互组件 (#7)

Reviewed-on: #7
This commit was merged in pull request #7.
This commit is contained in:
2026-07-28 21:31:38 +08:00
parent 2b82ec7d9c
commit ccf7049ae0
28 changed files with 968 additions and 479 deletions
+37 -8
View File
@@ -7,6 +7,33 @@
:root {
color-scheme: light;
/*
* Tailwind compatibility palettes.
* Existing teal/emerald utilities intentionally resolve to OpenCloud's
* fresh eucalyptus and leaf colors instead of Tailwind's vivid defaults.
*/
--color-teal-50: #f2faf6;
--color-teal-100: #ddf2e6;
--color-teal-200: #bce4cf;
--color-teal-300: #8fceb0;
--color-teal-400: #60b18d;
--color-teal-500: #438f71;
--color-teal-600: #34745d;
--color-teal-700: #2d5f4e;
--color-teal-800: #274c40;
--color-teal-900: #213e35;
--color-emerald-50: #f4faef;
--color-emerald-100: #e5f3d9;
--color-emerald-200: #cce7b7;
--color-emerald-300: #a8d58d;
--color-emerald-400: #7fbc63;
--color-emerald-500: #609d48;
--color-emerald-600: #4d7f3b;
--color-emerald-700: #3f6633;
--color-emerald-800: #35522c;
--color-emerald-900: #2d4427;
--oc-font-sans: 'IBM Plex Sans', 'Noto Sans SC', 'PingFang SC', sans-serif;
--oc-font-mono: 'IBM Plex Mono', 'SFMono-Regular', monospace;
@@ -17,20 +44,20 @@
--oc-color-text-secondary: #334155;
--oc-color-text-muted: #64748b;
--oc-color-border: #d9e3ee;
--oc-color-primary: #0f766e;
--oc-color-primary-hover: #115e59;
--oc-color-primary-pressed: #134e4a;
--oc-color-primary: #34745d;
--oc-color-primary-hover: #2d5f4e;
--oc-color-primary-pressed: #274c40;
--oc-color-info: #0369a1;
--oc-color-success: #0f766e;
--oc-color-success: #4d7f3b;
--oc-color-warning: #d97706;
--oc-color-danger: #dc2626;
--oc-color-selection: rgb(15 118 110 / 18%);
--oc-color-selection: rgb(52 116 93 / 20%);
--oc-gradient-canvas:
radial-gradient(circle at top left, rgb(12 148 136 / 12%), transparent 28%),
radial-gradient(circle at top left, rgb(52 116 93 / 11%), transparent 28%),
linear-gradient(180deg, #f8fbfd 0%, #eef4f8 100%);
--oc-gradient-page: linear-gradient(180deg, #e0f2fe 0%, #f8fafc 100%);
--oc-gradient-page-soft: linear-gradient(180deg, #f0fdfa 0%, #f8fafc 100%);
--oc-gradient-page-soft: linear-gradient(180deg, #f2faf6 0%, #f8fafc 100%);
--oc-gradient-grid:
linear-gradient(rgb(15 23 42 / 3%) 1px, transparent 1px),
linear-gradient(90deg, rgb(15 23 42 / 3%) 1px, transparent 1px);
@@ -41,7 +68,9 @@
--oc-shadow-lg: 8px 8px 0 0 rgb(15 23 42 / 8%);
--oc-shadow-xl: 12px 12px 0 0 rgb(15 23 42 / 8%);
--oc-shadow-sky: 4px 4px 0 0 rgb(14 165 233 / 14%);
--oc-shadow-teal: 4px 4px 0 0 rgb(20 184 166 / 10%);
--oc-shadow-primary: 4px 4px 0 0 rgb(52 116 93 / 14%);
--oc-shadow-primary-hover: 5px 5px 0 0 rgb(52 116 93 / 20%);
--oc-shadow-teal: var(--oc-shadow-primary);
--oc-duration-fast: 160ms;
--oc-ease-standard: ease;