@dxos/ui-theme 0.8.4-main.abd8ff62ef → 0.8.4-main.bc2380dfbc
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +102 -5
- package/README.md +1 -1
- package/dist/lib/browser/index.mjs +29 -31
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +29 -31
- package/dist/lib/node-esm/index.mjs.map +3 -3
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/plugin/node-cjs/main.css +85 -79
- package/dist/plugin/node-cjs/main.css.map +2 -2
- package/dist/plugin/node-cjs/meta.json +1 -1
- package/dist/plugin/node-esm/main.css +85 -79
- package/dist/plugin/node-esm/main.css.map +2 -2
- package/dist/plugin/node-esm/meta.json +1 -1
- package/dist/types/src/defs.d.ts +1 -1
- package/dist/types/src/defs.d.ts.map +1 -1
- package/dist/types/src/fragments/hover.d.ts +0 -1
- package/dist/types/src/fragments/hover.d.ts.map +1 -1
- package/dist/types/src/theme/components/button.d.ts +2 -2
- package/dist/types/src/theme/components/button.d.ts.map +1 -1
- package/dist/types/src/util/hash-styles.d.ts +1 -1
- package/dist/types/src/util/hash-styles.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +8 -9
- package/src/Theme.stories.tsx +5 -5
- package/src/css/DESIGN_SYSTEM.md +159 -0
- package/src/css/base/base.css +2 -2
- package/src/css/components/button.css +3 -3
- package/src/css/components/checkbox.css +1 -1
- package/src/css/components/focus.css +12 -12
- package/src/css/components/panel.css +23 -23
- package/src/css/components/selected.css +58 -17
- package/src/css/components/surface.css +4 -4
- package/src/css/components/tag.css +23 -23
- package/src/css/theme/semantic.css +36 -40
- package/src/css/theme/spacing.css +1 -1
- package/src/css/theme/styles.css +22 -22
- package/src/defs.ts +1 -1
- package/src/fragments/AUDIT.md +0 -2
- package/src/fragments/hover.ts +0 -2
- package/src/main.css +3 -3
- package/src/theme/components/button.ts +2 -2
- package/src/theme/components/focus.ts +2 -2
- package/src/theme/components/icon-button.ts +1 -1
- package/src/theme/components/input.ts +5 -5
- package/src/theme/components/message.ts +1 -1
- package/src/theme/components/select.ts +1 -1
- package/src/theme/components/tooltip.ts +1 -1
- package/src/util/hash-styles.ts +19 -19
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/plugins/ThemePlugin.ts":{"bytes":13135,"imports":[{"path":"@tailwindcss/postcss","kind":"import-statement","external":true},{"path":"autoprefixer","kind":"import-statement","external":true},{"path":"node:fs","kind":"import-statement","external":true},{"path":"node:path","kind":"import-statement","external":true},{"path":"postcss-import","kind":"import-statement","external":true},{"path":"postcss-nesting","kind":"import-statement","external":true}],"format":"esm"},"src/css/theme/animation.css":{"bytes":4993,"imports":[]},"src/css/theme/border.css":{"bytes":623,"imports":[]},"src/css/theme/palette.css":{"bytes":1519,"imports":[]},"src/css/theme/semantic.css":{"bytes":
|
|
1
|
+
{"inputs":{"src/plugins/ThemePlugin.ts":{"bytes":13135,"imports":[{"path":"@tailwindcss/postcss","kind":"import-statement","external":true},{"path":"autoprefixer","kind":"import-statement","external":true},{"path":"node:fs","kind":"import-statement","external":true},{"path":"node:path","kind":"import-statement","external":true},{"path":"postcss-import","kind":"import-statement","external":true},{"path":"postcss-nesting","kind":"import-statement","external":true}],"format":"esm"},"src/css/theme/animation.css":{"bytes":4993,"imports":[]},"src/css/theme/border.css":{"bytes":623,"imports":[]},"src/css/theme/palette.css":{"bytes":1519,"imports":[]},"src/css/theme/semantic.css":{"bytes":5788,"imports":[]},"src/css/theme/spacing.css":{"bytes":3992,"imports":[]},"src/css/theme/styles.css":{"bytes":8741,"imports":[]},"src/css/theme/text.css":{"bytes":1008,"imports":[]},"src/css/base/base.css":{"bytes":844,"imports":[]},"src/css/base/typography.css":{"bytes":3219,"imports":[{"path":"@fontsource-variable/jetbrains-mono/wght-italic.css","kind":"import-rule","external":true},{"path":"@fontsource-variable/jetbrains-mono/wght.css","kind":"import-rule","external":true},{"path":"@fontsource/poiret-one","kind":"import-rule","external":true}]},"src/css/components/button.css":{"bytes":2249,"imports":[]},"src/css/components/checkbox.css":{"bytes":1660,"imports":[]},"src/css/components/dialog.css":{"bytes":1597,"imports":[]},"src/css/components/focus.css":{"bytes":5359,"imports":[]},"src/css/components/icon.css":{"bytes":109,"imports":[]},"src/css/components/panel.css":{"bytes":3149,"imports":[]},"src/css/components/link.css":{"bytes":135,"imports":[]},"src/css/components/scrollbar.css":{"bytes":524,"imports":[]},"src/css/components/selected.css":{"bytes":3310,"imports":[]},"src/css/components/surface.css":{"bytes":942,"imports":[]},"src/css/components/tag.css":{"bytes":2950,"imports":[]},"src/css/components/text.css":{"bytes":1996,"imports":[]},"src/css/layout/main.css":{"bytes":6568,"imports":[]},"src/css/layout/native.css":{"bytes":496,"imports":[]},"src/css/layout/positioning.css":{"bytes":322,"imports":[]},"src/css/layout/size.css":{"bytes":6881,"imports":[]},"src/css/utilities.css":{"bytes":3909,"imports":[]},"src/css/integrations/codemirror.css":{"bytes":1737,"imports":[]},"src/css/integrations/tldraw.css":{"bytes":331,"imports":[]},"src/main.css":{"bytes":4680,"imports":[{"path":"tailwindcss","kind":"import-rule","external":true},{"path":"src/css/theme/animation.css","kind":"import-rule","original":"./css/theme/animation.css"},{"path":"src/css/theme/border.css","kind":"import-rule","original":"./css/theme/border.css"},{"path":"src/css/theme/palette.css","kind":"import-rule","original":"./css/theme/palette.css"},{"path":"src/css/theme/semantic.css","kind":"import-rule","original":"./css/theme/semantic.css"},{"path":"src/css/theme/spacing.css","kind":"import-rule","original":"./css/theme/spacing.css"},{"path":"src/css/theme/styles.css","kind":"import-rule","original":"./css/theme/styles.css"},{"path":"src/css/theme/text.css","kind":"import-rule","original":"./css/theme/text.css"},{"path":"src/css/base/base.css","kind":"import-rule","original":"./css/base/base.css"},{"path":"src/css/base/typography.css","kind":"import-rule","original":"./css/base/typography.css"},{"path":"src/css/components/button.css","kind":"import-rule","original":"./css/components/button.css"},{"path":"src/css/components/checkbox.css","kind":"import-rule","original":"./css/components/checkbox.css"},{"path":"src/css/components/dialog.css","kind":"import-rule","original":"./css/components/dialog.css"},{"path":"src/css/components/focus.css","kind":"import-rule","original":"./css/components/focus.css"},{"path":"src/css/components/icon.css","kind":"import-rule","original":"./css/components/icon.css"},{"path":"src/css/components/panel.css","kind":"import-rule","original":"./css/components/panel.css"},{"path":"src/css/components/link.css","kind":"import-rule","original":"./css/components/link.css"},{"path":"src/css/components/scrollbar.css","kind":"import-rule","original":"./css/components/scrollbar.css"},{"path":"src/css/components/selected.css","kind":"import-rule","original":"./css/components/selected.css"},{"path":"src/css/components/surface.css","kind":"import-rule","original":"./css/components/surface.css"},{"path":"src/css/components/tag.css","kind":"import-rule","original":"./css/components/tag.css"},{"path":"src/css/components/text.css","kind":"import-rule","original":"./css/components/text.css"},{"path":"src/css/layout/main.css","kind":"import-rule","original":"./css/layout/main.css"},{"path":"src/css/layout/native.css","kind":"import-rule","original":"./css/layout/native.css"},{"path":"src/css/layout/positioning.css","kind":"import-rule","original":"./css/layout/positioning.css"},{"path":"src/css/layout/size.css","kind":"import-rule","original":"./css/layout/size.css"},{"path":"src/css/utilities.css","kind":"import-rule","original":"./css/utilities.css"},{"path":"src/css/integrations/codemirror.css","kind":"import-rule","original":"./css/integrations/codemirror.css"},{"path":"src/css/integrations/tldraw.css","kind":"import-rule","original":"./css/integrations/tldraw.css"}]}},"outputs":{"dist/plugin/node-cjs/plugins/ThemePlugin.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":6236},"dist/plugin/node-cjs/plugins/ThemePlugin.cjs":{"imports":[{"path":"@tailwindcss/postcss","kind":"import-statement","external":true},{"path":"autoprefixer","kind":"import-statement","external":true},{"path":"node:fs","kind":"import-statement","external":true},{"path":"node:path","kind":"import-statement","external":true},{"path":"postcss-import","kind":"import-statement","external":true},{"path":"postcss-nesting","kind":"import-statement","external":true}],"exports":["LAYER_ORDER","ThemePlugin"],"entryPoint":"src/plugins/ThemePlugin.ts","inputs":{"src/plugins/ThemePlugin.ts":{"bytesInOutput":2777}},"bytes":2889},"dist/plugin/node-cjs/main.css.map":{"imports":[],"exports":[],"inputs":{},"bytes":122449},"dist/plugin/node-cjs/main.css":{"imports":[{"path":"tailwindcss","kind":"import-rule","external":true},{"path":"@fontsource-variable/jetbrains-mono/wght-italic.css","kind":"import-rule","external":true},{"path":"@fontsource-variable/jetbrains-mono/wght.css","kind":"import-rule","external":true},{"path":"@fontsource/poiret-one","kind":"import-rule","external":true}],"entryPoint":"src/main.css","inputs":{"src/css/theme/animation.css":{"bytesInOutput":3508},"src/css/theme/border.css":{"bytesInOutput":450},"src/css/theme/palette.css":{"bytesInOutput":1253},"src/css/theme/semantic.css":{"bytesInOutput":4948},"src/css/theme/spacing.css":{"bytesInOutput":3095},"src/css/theme/styles.css":{"bytesInOutput":8427},"src/css/theme/text.css":{"bytesInOutput":841},"src/css/base/base.css":{"bytesInOutput":800},"src/css/base/typography.css":{"bytesInOutput":2742},"src/css/components/button.css":{"bytesInOutput":1742},"src/css/components/checkbox.css":{"bytesInOutput":1334},"src/css/components/dialog.css":{"bytesInOutput":1550},"src/css/components/focus.css":{"bytesInOutput":5252},"src/css/components/icon.css":{"bytesInOutput":91},"src/css/components/panel.css":{"bytesInOutput":2817},"src/css/components/link.css":{"bytesInOutput":100},"src/css/components/scrollbar.css":{"bytesInOutput":451},"src/css/components/selected.css":{"bytesInOutput":1418},"src/css/components/surface.css":{"bytesInOutput":545},"src/css/components/tag.css":{"bytesInOutput":2680},"src/css/components/text.css":{"bytesInOutput":1794},"src/css/layout/main.css":{"bytesInOutput":6361},"src/css/layout/native.css":{"bytesInOutput":215},"src/css/layout/positioning.css":{"bytesInOutput":297},"src/css/layout/size.css":{"bytesInOutput":5804},"src/css/utilities.css":{"bytesInOutput":1154},"src/css/integrations/codemirror.css":{"bytesInOutput":1284},"src/css/integrations/tldraw.css":{"bytesInOutput":276},"src/main.css":{"bytesInOutput":1227}},"bytes":63807}}}
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
@theme { --color-neutral-75: color-mix(in oklch, var(--color-neutral-50) 50%, var(--color-neutral-100) 50%); --color-neutral-150: color-mix(in oklch, var(--color-neutral-100) 50%, var(--color-neutral-200) 50%); --color-neutral-250: color-mix(in oklch, var(--color-neutral-200) 50%, var(--color-neutral-300) 50%); --color-neutral-750: color-mix(in oklch, var(--color-neutral-700) 50%, var(--color-neutral-800) 50%); --color-neutral-850: color-mix(in oklch, var(--color-neutral-800) 50%, var(--color-neutral-900) 50%); --color-neutral-925: color-mix(in oklch, var(--color-neutral-900) 50%, var(--color-neutral-950) 50%); --color-primary-50: var(--color-blue-50); --color-primary-100: var(--color-blue-100); --color-primary-200: var(--color-blue-200); --color-primary-300: var(--color-blue-300); --color-primary-400: var(--color-blue-400); --color-primary-500: var(--color-blue-500); --color-primary-600: var(--color-blue-600); --color-primary-700: var(--color-blue-700); --color-primary-800: var(--color-blue-800); --color-primary-900: var(--color-blue-900); --color-primary-950: var(--color-blue-950); --color-composer-100: rgb(5 40 61); --color-composer-200: rgb(10 75 105); --color-composer-300: rgb(1 122 183); --color-composer-400: rgb(6 197 253); }
|
|
34
34
|
|
|
35
35
|
/* src/css/theme/semantic.css */
|
|
36
|
-
@theme { --color-base-surface: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-base-
|
|
36
|
+
@theme { --color-base-surface: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-base-foreground: light-dark(var(--color-neutral-950), var(--color-neutral-50)); --color-inverse-surface: light-dark(var(--color-neutral-800), var(--color-neutral-200)); --color-inverse-foreground: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-focus-surface: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-deck-surface: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-scrim-surface: light-dark( oklch(from var(--color-neutral-50) l c h / 0.5), oklch(from var(--color-neutral-950) l c h / 0.25) ); --color-toolbar-surface: light-dark(var(--color-neutral-75), var(--color-neutral-925)); --color-card-surface: light-dark(var(--color-neutral-75), var(--color-neutral-925)); --color-group-surface: light-dark(var(--color-neutral-100), var(--color-neutral-900)); --color-modal-surface: light-dark(var(--color-neutral-100), var(--color-neutral-900)); --color-sidebar-surface: light-dark(var(--color-neutral-100), var(--color-neutral-900)); --color-header-surface: light-dark(var(--color-neutral-100), var(--color-neutral-900)); --color-input-surface: light-dark(var(--color-neutral-200), var(--color-neutral-800)); --color-input-foreground: light-dark(var(--color-neutral-950), var(--color-neutral-50)); --color-current-surface: light-dark(var(--color-neutral-200), var(--color-neutral-800)); --color-current-surface-hover: light-dark(var(--color-neutral-300), var(--color-neutral-700)); --color-current-foreground: light-dark(var(--color-neutral-950), var(--color-neutral-50)); --color-selected-surface: light-dark(var(--color-neutral-150), var(--color-neutral-850)); --color-selected-surface-hover: light-dark(var(--color-neutral-250), var(--color-neutral-750)); --color-selected-foreground: light-dark(var(--color-neutral-950), var(--color-neutral-50)); --color-hover-surface: light-dark(var(--color-neutral-250), var(--color-neutral-750)); --color-hover-foreground: light-dark(var(--color-neutral-950), var(--color-neutral-50)); --color-attention-surface: var(--color-focus-surface); --color-attention-contains: oklch(from var(--color-accent-surface) l c h / 0.3); --color-accent-surface: light-dark(var(--color-blue-500), var(--color-blue-700)); --color-accent-surface-hover: light-dark(var(--color-blue-800), var(--color-blue-800)); --color-accent-foreground: var(--color-blue-100); --color-accent-text: light-dark(var(--color-blue-600), var(--color-blue-400)); --color-accent-text-hover: light-dark(var(--color-blue-500), var(--color-blue-500)); --color-un-accent: var(--color-neutral-400); --color-un-accent-hover: var(--color-neutral-500); --color-focus-ring: light-dark(var(--color-blue-600), var(--color-blue-600)); --color-focus-ring-subtle: light-dark(var(--color-neutral-400), var(--color-neutral-600)); --color-separator: light-dark(var(--color-neutral-200), var(--color-neutral-800)); --color-subdued-separator: light-dark(var(--color-neutral-150), var(--color-neutral-850)); --color-primary-separator: light-dark(var(--color-neutral-500), var(--color-neutral-700)); --color-active-separator: light-dark(var(--color-blue-500), var(--color-blue-500)); --color-scrollbar-track: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-scrollbar-thumb: light-dark(var(--color-neutral-200), var(--color-neutral-700)); --color-scrollbar-thumb-active: light-dark(var(--color-neutral-200), var(--color-neutral-600)); --color-scrollbar-thumb-hover: light-dark(var(--color-neutral-200), var(--color-neutral-600)); --color-axis-selected-surface: light-dark(var(--color-neutral-100), var(--color-neutral-900)); --color-axis-selected-text: light-dark(var(--color-neutral-100), var(--color-neutral-900)); --color-axis-surface: light-dark(var(--color-neutral-50), var(--color-neutral-800)); --color-axis-text: light-dark(var(--color-neutral-800), var(--color-neutral-200)); --color-grid-surface: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-grid-foreground: light-dark(var(--color-neutral-950), var(--color-neutral-50)); --color-grid-line: light-dark(var(--color-neutral-200), var(--color-neutral-800)); --color-grid-highlight: oklch(from var(--color-emerald-500) l c h / 0.5); --color-grid-selection-surface: light-dark(var(--color-blue-500), var(--color-blue-400)); --color-grid-selection-foreground: light-dark(var(--color-neutral-50), var(--color-neutral-950)); --color-grid-comment: light-dark(var(--color-green-400), var(--color-green-600)); --color-grid-comment-active: light-dark( oklch(from var(--color-green-400) l c h / 0.5), oklch(from var(--color-green-600) l c h / 0.5) ); --color-placeholder: light-dark(var(--color-neutral-400), var(--color-neutral-600)); --color-subdued: light-dark(var(--color-neutral-500), var(--color-neutral-500)); --color-description: light-dark(var(--color-neutral-600), var(--color-neutral-400)); }
|
|
37
37
|
|
|
38
38
|
/* src/css/theme/spacing.css */
|
|
39
39
|
@theme { --spacing-screen-border: 2rem; --spacing-popover-default-width: 20rem; --spacing-popover-min-width: 16rem; --spacing-document-max-width: 50rem; --spacing-document-width: calc(50rem - env(safe-area-inset-left) - env(safe-area-inset-right)); --spacing-card-default-width: 20rem; --spacing-card-min-width: 18rem; --spacing-card-max-width: 22rem; --spacing-card-min-height: 18rem; --spacing-card-max-height: 30rem; --spacing-tag-padding-block: 0.125rem; --spacing-trim-xs: 0.25rem; --spacing-trim-sm: 0.5rem; --spacing-trim-md: 0.75rem; --spacing-trim-lg: 1.5rem; --spacing-form-chrome: var(--spacing-trim-xs); --spacing-form-gap: var(--spacing-trim-sm); --spacing-form-section-gap: var(--spacing-trim-lg); --spacing-form-padding: var(--spacing-trim-sm); --spacing-icon-button-padding: var(--spacing-trim-xs); --spacing-scroll-padding: 4px; }
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
--dx-l0-avatar-size: 3rem;
|
|
90
90
|
--dx-l1-size: calc(var(--dx-nav-sidebar-size) - var(--dx-l0-size));
|
|
91
91
|
--dx-r0-size: var(--dx-rail-size);
|
|
92
|
-
--dx-r1-size: calc(var(--dx-complementary-sidebar-size) - var(--dx-r0-size));
|
|
92
|
+
--dx-r1-size: calc(var(--dx-complementary-sidebar-size) - var(--dx-r0-size) - 1px);
|
|
93
93
|
}
|
|
94
94
|
:root {
|
|
95
95
|
--dx-calc-auto: auto;
|
|
@@ -110,7 +110,7 @@
|
|
|
110
110
|
}
|
|
111
111
|
|
|
112
112
|
/* src/css/theme/styles.css */
|
|
113
|
-
@theme { --color-info-fill: var(--color-cyan-fill); --color-info-surface: var(--color-cyan-surface); --color-info-
|
|
113
|
+
@theme { --color-info-fill: var(--color-cyan-fill); --color-info-surface: var(--color-cyan-surface); --color-info-foreground: var(--color-cyan-foreground); --color-info-text: var(--color-cyan-text); --color-info-border: var(--color-cyan-border); --color-success-fill: var(--color-emerald-fill); --color-success-surface: var(--color-emerald-surface); --color-success-foreground: var(--color-emerald-foreground); --color-success-text: var(--color-emerald-text); --color-success-border: var(--color-emerald-border); --color-warning-fill: var(--color-amber-fill); --color-warning-surface: var(--color-amber-surface); --color-warning-foreground: var(--color-amber-foreground); --color-warning-text: var(--color-amber-text); --color-warning-border: var(--color-amber-border); --color-error-fill: var(--color-rose-fill); --color-error-surface: var(--color-rose-surface); --color-error-foreground: var(--color-rose-foreground); --color-error-text: var(--color-rose-text); --color-error-border: var(--color-rose-border); --color-neutral-fill: light-dark(var(--color-neutral-300), var(--color-neutral-700)); --color-neutral-surface: light-dark(var(--color-neutral-200), var(--color-neutral-800)); --color-neutral-foreground: light-dark(var(--color-neutral-800), var(--color-neutral-200)); --color-neutral-text: light-dark(var(--color-neutral-700), var(--color-neutral-300)); --color-neutral-border: light-dark(var(--color-neutral-400), var(--color-neutral-600)); --color-red-fill: light-dark(var(--color-red-300), var(--color-red-700)); --color-red-surface: light-dark(var(--color-red-200), var(--color-red-800)); --color-red-foreground: light-dark(var(--color-red-800), var(--color-red-200)); --color-red-text: light-dark(var(--color-red-700), var(--color-red-300)); --color-red-border: light-dark(var(--color-red-400), var(--color-red-600)); --color-orange-fill: light-dark(var(--color-orange-300), var(--color-orange-700)); --color-orange-surface: light-dark(var(--color-orange-200), var(--color-orange-800)); --color-orange-foreground: light-dark(var(--color-orange-800), var(--color-orange-200)); --color-orange-text: light-dark(var(--color-orange-700), var(--color-orange-300)); --color-orange-border: light-dark(var(--color-orange-400), var(--color-orange-600)); --color-amber-fill: light-dark(var(--color-amber-300), var(--color-amber-700)); --color-amber-surface: light-dark(var(--color-amber-200), var(--color-amber-800)); --color-amber-foreground: light-dark(var(--color-amber-800), var(--color-amber-200)); --color-amber-text: light-dark(var(--color-amber-700), var(--color-amber-300)); --color-amber-border: light-dark(var(--color-amber-400), var(--color-amber-600)); --color-yellow-fill: light-dark(var(--color-yellow-300), var(--color-yellow-700)); --color-yellow-surface: light-dark(var(--color-yellow-200), var(--color-yellow-800)); --color-yellow-foreground: light-dark(var(--color-yellow-800), var(--color-yellow-200)); --color-yellow-text: light-dark(var(--color-yellow-700), var(--color-yellow-300)); --color-yellow-border: light-dark(var(--color-yellow-400), var(--color-yellow-600)); --color-lime-fill: light-dark(var(--color-lime-300), var(--color-lime-700)); --color-lime-surface: light-dark(var(--color-lime-200), var(--color-lime-800)); --color-lime-foreground: light-dark(var(--color-lime-800), var(--color-lime-200)); --color-lime-text: light-dark(var(--color-lime-700), var(--color-lime-300)); --color-lime-border: light-dark(var(--color-lime-400), var(--color-lime-600)); --color-green-fill: light-dark(var(--color-green-300), var(--color-green-700)); --color-green-surface: light-dark(var(--color-green-200), var(--color-green-800)); --color-green-foreground: light-dark(var(--color-green-800), var(--color-green-200)); --color-green-text: light-dark(var(--color-green-700), var(--color-green-300)); --color-green-border: light-dark(var(--color-green-400), var(--color-green-600)); --color-emerald-fill: light-dark(var(--color-emerald-300), var(--color-emerald-700)); --color-emerald-surface: light-dark(var(--color-emerald-200), var(--color-emerald-800)); --color-emerald-foreground: light-dark(var(--color-emerald-800), var(--color-emerald-200)); --color-emerald-text: light-dark(var(--color-emerald-700), var(--color-emerald-300)); --color-emerald-border: light-dark(var(--color-emerald-400), var(--color-emerald-600)); --color-teal-fill: light-dark(var(--color-teal-300), var(--color-teal-700)); --color-teal-surface: light-dark(var(--color-teal-200), var(--color-teal-800)); --color-teal-foreground: light-dark(var(--color-teal-800), var(--color-teal-200)); --color-teal-text: light-dark(var(--color-teal-700), var(--color-teal-300)); --color-teal-border: light-dark(var(--color-teal-400), var(--color-teal-600)); --color-cyan-fill: light-dark(var(--color-cyan-300), var(--color-cyan-700)); --color-cyan-surface: light-dark(var(--color-cyan-200), var(--color-cyan-800)); --color-cyan-foreground: light-dark(var(--color-cyan-800), var(--color-cyan-200)); --color-cyan-text: light-dark(var(--color-cyan-700), var(--color-cyan-300)); --color-cyan-border: light-dark(var(--color-cyan-400), var(--color-cyan-600)); --color-sky-fill: light-dark(var(--color-sky-300), var(--color-sky-700)); --color-sky-surface: light-dark(var(--color-sky-200), var(--color-sky-800)); --color-sky-foreground: light-dark(var(--color-sky-800), var(--color-sky-200)); --color-sky-text: light-dark(var(--color-sky-700), var(--color-sky-300)); --color-sky-border: light-dark(var(--color-sky-400), var(--color-sky-600)); --color-blue-fill: light-dark(var(--color-blue-300), var(--color-blue-700)); --color-blue-surface: light-dark(var(--color-blue-200), var(--color-blue-800)); --color-blue-foreground: light-dark(var(--color-blue-800), var(--color-blue-200)); --color-blue-text: light-dark(var(--color-blue-700), var(--color-blue-300)); --color-blue-border: light-dark(var(--color-blue-400), var(--color-blue-600)); --color-indigo-fill: light-dark(var(--color-indigo-300), var(--color-indigo-700)); --color-indigo-surface: light-dark(var(--color-indigo-200), var(--color-indigo-800)); --color-indigo-foreground: light-dark(var(--color-indigo-800), var(--color-indigo-200)); --color-indigo-text: light-dark(var(--color-indigo-700), var(--color-indigo-300)); --color-indigo-border: light-dark(var(--color-indigo-400), var(--color-indigo-600)); --color-violet-fill: light-dark(var(--color-violet-300), var(--color-violet-700)); --color-violet-surface: light-dark(var(--color-violet-200), var(--color-violet-800)); --color-violet-foreground: light-dark(var(--color-violet-800), var(--color-violet-200)); --color-violet-text: light-dark(var(--color-violet-700), var(--color-violet-300)); --color-violet-border: light-dark(var(--color-violet-400), var(--color-violet-600)); --color-purple-fill: light-dark(var(--color-purple-300), var(--color-purple-700)); --color-purple-surface: light-dark(var(--color-purple-200), var(--color-purple-800)); --color-purple-foreground: light-dark(var(--color-purple-800), var(--color-purple-200)); --color-purple-text: light-dark(var(--color-purple-700), var(--color-purple-300)); --color-purple-border: light-dark(var(--color-purple-400), var(--color-purple-600)); --color-fuchsia-fill: light-dark(var(--color-fuchsia-300), var(--color-fuchsia-700)); --color-fuchsia-surface: light-dark(var(--color-fuchsia-200), var(--color-fuchsia-800)); --color-fuchsia-foreground: light-dark(var(--color-fuchsia-800), var(--color-fuchsia-200)); --color-fuchsia-text: light-dark(var(--color-fuchsia-700), var(--color-fuchsia-300)); --color-fuchsia-border: light-dark(var(--color-fuchsia-400), var(--color-fuchsia-600)); --color-pink-fill: light-dark(var(--color-pink-300), var(--color-pink-700)); --color-pink-surface: light-dark(var(--color-pink-200), var(--color-pink-800)); --color-pink-foreground: light-dark(var(--color-pink-800), var(--color-pink-200)); --color-pink-text: light-dark(var(--color-pink-700), var(--color-pink-300)); --color-pink-border: light-dark(var(--color-pink-400), var(--color-pink-600)); --color-rose-fill: light-dark(var(--color-rose-300), var(--color-rose-700)); --color-rose-surface: light-dark(var(--color-rose-200), var(--color-rose-800)); --color-rose-foreground: light-dark(var(--color-rose-800), var(--color-rose-200)); --color-rose-text: light-dark(var(--color-rose-700), var(--color-rose-300)); --color-rose-border: light-dark(var(--color-rose-400), var(--color-rose-600)); }
|
|
114
114
|
|
|
115
115
|
/* src/css/theme/text.css */
|
|
116
116
|
@theme { --font-body: "Inter Variable", ui-sans-serif, system-ui, sans-serif; --font-mono: "JetBrains Mono Variable", ui-monospace, "Cascadia Code", "Source Code Pro", monospace; --text-xs: 0.75rem; --text-xs--line-height: 1rem; --text-sm: 0.875rem; --text-sm--line-height: 1.25rem; --text-base: 1rem; --text-base--line-height: 1.5rem; --text-lg: 1.125rem; --text-lg--line-height: 1.75rem; --text-xl: 1.25rem; --text-xl--line-height: 1.75rem; --text-2xl: 1.5rem; --text-2xl--line-height: 2rem; --text-3xl: 1.875rem; --text-3xl--line-height: 2.25rem; --text-4xl: 2.25rem; --text-4xl--line-height: 2.5rem; --text-5xl: 3rem; --text-5xl--line-height: 1; --text-6xl: 3.75rem; --text-6xl--line-height: 1; --text-7xl: 4.5rem; --text-7xl--line-height: 1; --text-8xl: 6rem; --text-8xl--line-height: 1; --text-9xl: 8rem; --text-9xl--line-height: 1; }
|
|
@@ -143,9 +143,9 @@
|
|
|
143
143
|
html .dark,
|
|
144
144
|
.sb-show-main {
|
|
145
145
|
background-color: var(--color-base-surface);
|
|
146
|
-
color: var(--color-base-
|
|
146
|
+
color: var(--color-base-foreground);
|
|
147
147
|
--surface-bg: var(--color-base-surface);
|
|
148
|
-
--
|
|
148
|
+
--foreground: var(--color-base-foreground);
|
|
149
149
|
--description-text: var(--color-description);
|
|
150
150
|
}
|
|
151
151
|
}
|
|
@@ -262,7 +262,7 @@
|
|
|
262
262
|
/* src/css/components/button.css */
|
|
263
263
|
@layer dx-components {
|
|
264
264
|
.dx-button {
|
|
265
|
-
@apply shrink-0 inline-flex select-none items-center justify-center overflow-hidden min-h-[
|
|
265
|
+
@apply shrink-0 inline-flex select-none items-center justify-center overflow-hidden min-h-[2rem] px-3;
|
|
266
266
|
@apply font-medium transition-colors duration-100 ease-linear bg-input-surface;
|
|
267
267
|
&[aria-pressed=true],
|
|
268
268
|
&[aria-checked=true] {
|
|
@@ -296,7 +296,7 @@
|
|
|
296
296
|
@apply bg-hover-surface;
|
|
297
297
|
}
|
|
298
298
|
&[data-variant=primary] {
|
|
299
|
-
@apply text-accent-
|
|
299
|
+
@apply text-accent-foreground bg-accent-surface;
|
|
300
300
|
&:hover,
|
|
301
301
|
&[aria-pressed=true],
|
|
302
302
|
&[aria-checked=true] &[data-state=open] {
|
|
@@ -304,7 +304,7 @@
|
|
|
304
304
|
}
|
|
305
305
|
}
|
|
306
306
|
&[data-variant=destructive] {
|
|
307
|
-
@apply text-accent-
|
|
307
|
+
@apply text-accent-foreground bg-rose-fill;
|
|
308
308
|
&:hover,
|
|
309
309
|
&[aria-pressed=true],
|
|
310
310
|
&[aria-checked=true] &[data-state=open] {
|
|
@@ -349,7 +349,7 @@
|
|
|
349
349
|
}
|
|
350
350
|
}
|
|
351
351
|
.dx-checkbox {
|
|
352
|
-
@apply w-4 h-4 overflow-hidden shadow-inner transition-colors bg-un-accent accent-un-accent text-accent-
|
|
352
|
+
@apply w-4 h-4 overflow-hidden shadow-inner transition-colors bg-un-accent accent-un-accent text-accent-foreground shrink-0 inline-grid place-items-center rounded-xs;
|
|
353
353
|
}
|
|
354
354
|
.dx-checkbox--switch {
|
|
355
355
|
@apply inline-block appearance-none relative shrink-0 h-5 w-8;
|
|
@@ -442,9 +442,9 @@
|
|
|
442
442
|
@apply outline-hidden;
|
|
443
443
|
}
|
|
444
444
|
&:focus-visible {
|
|
445
|
-
@apply ring-focus-line ring-offset-focus-offset z-[1] ring-[var(--color-
|
|
445
|
+
@apply ring-focus-line ring-offset-focus-offset z-[1] ring-[var(--color-focus-ring-subtle)];
|
|
446
446
|
&[data-variant=primary] {
|
|
447
|
-
@apply ring-[var(--color-
|
|
447
|
+
@apply ring-[var(--color-focus-ring)];
|
|
448
448
|
}
|
|
449
449
|
&:hover {
|
|
450
450
|
@apply outline-hidden;
|
|
@@ -469,9 +469,9 @@
|
|
|
469
469
|
@apply outline-hidden;
|
|
470
470
|
}
|
|
471
471
|
&:focus {
|
|
472
|
-
@apply ring-focus-line ring-offset-focus-offset z-[1] ring-[var(--color-
|
|
472
|
+
@apply ring-focus-line ring-offset-focus-offset z-[1] ring-[var(--color-focus-ring-subtle)];
|
|
473
473
|
&[data-variant=primary] {
|
|
474
|
-
@apply ring-[var(--color-
|
|
474
|
+
@apply ring-[var(--color-focus-ring)];
|
|
475
475
|
}
|
|
476
476
|
&:hover {
|
|
477
477
|
@apply outline-hidden;
|
|
@@ -498,9 +498,9 @@
|
|
|
498
498
|
.dx-focus-ring-group:focus-visible .dx-focus-ring-group-indicator,
|
|
499
499
|
.dx-focus-ring-group-x:focus-visible .dx-focus-ring-group-x-indicator,
|
|
500
500
|
.dx-focus-ring-group-y:focus-visible .dx-focus-ring-group-y-indicator {
|
|
501
|
-
@apply ring-focus-line ring-offset-focus-offset ring-[var(--color-
|
|
501
|
+
@apply ring-focus-line ring-offset-focus-offset ring-[var(--color-focus-ring-subtle)];
|
|
502
502
|
&[data-variant=primary] {
|
|
503
|
-
@apply ring-[var(--color-
|
|
503
|
+
@apply ring-[var(--color-focus-ring)];
|
|
504
504
|
}
|
|
505
505
|
&:hover {
|
|
506
506
|
@apply outline-hidden;
|
|
@@ -512,9 +512,9 @@
|
|
|
512
512
|
.dx-focus-ring-group-always:focus .dx-focus-ring-group-indicator,
|
|
513
513
|
.dx-focus-ring-group-x-always:focus .dx-focus-ring-group-x-indicator,
|
|
514
514
|
.dx-focus-ring-group-y-always:focus .dx-focus-ring-group-y-indicator {
|
|
515
|
-
@apply ring-focus-line ring-offset-focus-offset ring-[var(--color-
|
|
515
|
+
@apply ring-focus-line ring-offset-focus-offset ring-[var(--color-focus-ring-subtle)];
|
|
516
516
|
&[data-variant=primary] {
|
|
517
|
-
@apply ring-[var(--color-
|
|
517
|
+
@apply ring-[var(--color-focus-ring)];
|
|
518
518
|
}
|
|
519
519
|
&:hover {
|
|
520
520
|
@apply outline-hidden;
|
|
@@ -552,10 +552,10 @@
|
|
|
552
552
|
}
|
|
553
553
|
&:focus-visible {
|
|
554
554
|
&::after {
|
|
555
|
-
@apply ring-focus-line ring-offset-focus-offset ring-inset z-[1] ring-[var(--color-
|
|
555
|
+
@apply ring-focus-line ring-offset-focus-offset ring-inset z-[1] ring-[var(--color-focus-ring-subtle)];
|
|
556
556
|
}
|
|
557
557
|
&[data-variant=primary]::after {
|
|
558
|
-
@apply ring-[var(--color-
|
|
558
|
+
@apply ring-[var(--color-focus-ring)];
|
|
559
559
|
}
|
|
560
560
|
&:hover {
|
|
561
561
|
@apply outline-hidden;
|
|
@@ -579,10 +579,10 @@
|
|
|
579
579
|
}
|
|
580
580
|
&:focus {
|
|
581
581
|
&::after {
|
|
582
|
-
@apply ring-focus-line ring-offset-focus-offset ring-inset z-[1] ring-[var(--color-
|
|
582
|
+
@apply ring-focus-line ring-offset-focus-offset ring-inset z-[1] ring-[var(--color-focus-ring-subtle)];
|
|
583
583
|
}
|
|
584
584
|
&[data-variant=primary]::after {
|
|
585
|
-
@apply ring-[var(--color-
|
|
585
|
+
@apply ring-[var(--color-focus-ring)];
|
|
586
586
|
}
|
|
587
587
|
&:hover {
|
|
588
588
|
@apply outline-hidden;
|
|
@@ -644,91 +644,91 @@
|
|
|
644
644
|
@layer dx-components {
|
|
645
645
|
[data-hue=neutral] .dx-panel,
|
|
646
646
|
.dx-panel--neutral {
|
|
647
|
-
@apply bg-neutral-surface text-neutral-
|
|
647
|
+
@apply bg-neutral-surface text-neutral-foreground border-neutral-border;
|
|
648
648
|
}
|
|
649
649
|
[data-hue=red] .dx-panel,
|
|
650
650
|
.dx-panel--red {
|
|
651
|
-
@apply bg-red-surface text-red-
|
|
651
|
+
@apply bg-red-surface text-red-foreground border-red-border;
|
|
652
652
|
}
|
|
653
653
|
[data-hue=orange] .dx-panel,
|
|
654
654
|
.dx-panel--orange {
|
|
655
|
-
@apply bg-orange-surface text-orange-
|
|
655
|
+
@apply bg-orange-surface text-orange-foreground border-orange-border;
|
|
656
656
|
}
|
|
657
657
|
[data-hue=amber] .dx-panel,
|
|
658
658
|
.dx-panel--amber {
|
|
659
|
-
@apply bg-amber-surface text-amber-
|
|
659
|
+
@apply bg-amber-surface text-amber-foreground border-amber-border;
|
|
660
660
|
}
|
|
661
661
|
[data-hue=yellow] .dx-panel,
|
|
662
662
|
.dx-panel--yellow {
|
|
663
|
-
@apply bg-yellow-surface text-yellow-
|
|
663
|
+
@apply bg-yellow-surface text-yellow-foreground border-yellow-border;
|
|
664
664
|
}
|
|
665
665
|
[data-hue=lime] .dx-panel,
|
|
666
666
|
.dx-panel--lime {
|
|
667
|
-
@apply bg-lime-surface text-lime-
|
|
667
|
+
@apply bg-lime-surface text-lime-foreground border-lime-border;
|
|
668
668
|
}
|
|
669
669
|
[data-hue=green] .dx-panel,
|
|
670
670
|
.dx-panel--green {
|
|
671
|
-
@apply bg-green-surface text-green-
|
|
671
|
+
@apply bg-green-surface text-green-foreground border-green-border;
|
|
672
672
|
}
|
|
673
673
|
[data-hue=emerald] .dx-panel,
|
|
674
674
|
.dx-panel--emerald {
|
|
675
|
-
@apply bg-emerald-surface text-emerald-
|
|
675
|
+
@apply bg-emerald-surface text-emerald-foreground border-emerald-border;
|
|
676
676
|
}
|
|
677
677
|
[data-hue=teal] .dx-panel,
|
|
678
678
|
.dx-panel--teal {
|
|
679
|
-
@apply bg-teal-surface text-teal-
|
|
679
|
+
@apply bg-teal-surface text-teal-foreground border-teal-border;
|
|
680
680
|
}
|
|
681
681
|
[data-hue=cyan] .dx-panel,
|
|
682
682
|
.dx-panel--cyan {
|
|
683
|
-
@apply bg-cyan-surface text-cyan-
|
|
683
|
+
@apply bg-cyan-surface text-cyan-foreground border-cyan-border;
|
|
684
684
|
}
|
|
685
685
|
[data-hue=sky] .dx-panel,
|
|
686
686
|
.dx-panel--sky {
|
|
687
|
-
@apply bg-sky-surface text-sky-
|
|
687
|
+
@apply bg-sky-surface text-sky-foreground border-sky-border;
|
|
688
688
|
}
|
|
689
689
|
[data-hue=blue] .dx-panel,
|
|
690
690
|
.dx-panel--blue {
|
|
691
|
-
@apply bg-blue-surface text-blue-
|
|
691
|
+
@apply bg-blue-surface text-blue-foreground border-blue-border;
|
|
692
692
|
}
|
|
693
693
|
[data-hue=indigo] .dx-panel,
|
|
694
694
|
.dx-panel--indigo {
|
|
695
|
-
@apply bg-indigo-surface text-indigo-
|
|
695
|
+
@apply bg-indigo-surface text-indigo-foreground border-indigo-border;
|
|
696
696
|
}
|
|
697
697
|
[data-hue=violet] .dx-panel,
|
|
698
698
|
.dx-panel--violet {
|
|
699
|
-
@apply bg-violet-surface text-violet-
|
|
699
|
+
@apply bg-violet-surface text-violet-foreground border-violet-border;
|
|
700
700
|
}
|
|
701
701
|
[data-hue=purple] .dx-panel,
|
|
702
702
|
.dx-panel--purple {
|
|
703
|
-
@apply bg-purple-surface text-purple-
|
|
703
|
+
@apply bg-purple-surface text-purple-foreground border-purple-border;
|
|
704
704
|
}
|
|
705
705
|
[data-hue=fuchsia] .dx-panel,
|
|
706
706
|
.dx-panel--fuchsia {
|
|
707
|
-
@apply bg-fuchsia-surface text-fuchsia-
|
|
707
|
+
@apply bg-fuchsia-surface text-fuchsia-foreground border-fuchsia-border;
|
|
708
708
|
}
|
|
709
709
|
[data-hue=pink] .dx-panel,
|
|
710
710
|
.dx-panel--pink {
|
|
711
|
-
@apply bg-pink-surface text-pink-
|
|
711
|
+
@apply bg-pink-surface text-pink-foreground border-pink-border;
|
|
712
712
|
}
|
|
713
713
|
[data-hue=rose] .dx-panel,
|
|
714
714
|
.dx-panel--rose {
|
|
715
|
-
@apply bg-rose-surface text-rose-
|
|
715
|
+
@apply bg-rose-surface text-rose-foreground border-rose-border;
|
|
716
716
|
}
|
|
717
717
|
[data-hue=info] .dx-panel,
|
|
718
718
|
.dx-panel--info {
|
|
719
|
-
@apply bg-info-surface text-info-
|
|
719
|
+
@apply bg-info-surface text-info-foreground border-info-border;
|
|
720
720
|
}
|
|
721
721
|
[data-hue=success] .dx-panel,
|
|
722
722
|
.dx-panel--success {
|
|
723
|
-
@apply bg-success-surface text-success-
|
|
723
|
+
@apply bg-success-surface text-success-foreground border-success-border;
|
|
724
724
|
}
|
|
725
725
|
[data-hue=warning] .dx-panel,
|
|
726
726
|
.dx-panel--warning {
|
|
727
|
-
@apply bg-warning-surface text-warning-
|
|
727
|
+
@apply bg-warning-surface text-warning-foreground border-warning-border;
|
|
728
728
|
}
|
|
729
729
|
[data-hue=error] .dx-panel,
|
|
730
730
|
.dx-panel--error {
|
|
731
|
-
@apply bg-error-surface text-error-
|
|
731
|
+
@apply bg-error-surface text-error-foreground border-error-border;
|
|
732
732
|
}
|
|
733
733
|
}
|
|
734
734
|
|
|
@@ -762,35 +762,41 @@
|
|
|
762
762
|
/* src/css/components/selected.css */
|
|
763
763
|
@layer dx-components {
|
|
764
764
|
.dx-hover {
|
|
765
|
-
@apply cursor-pointer hover:bg-
|
|
765
|
+
@apply cursor-pointer hover:bg-hover-surface! hover:text-hover-foreground! hover:aria-selected:bg-selected-surface-hover! hover:aria-selected:text-selected-foreground! hover:aria-[current=true]:bg-current-surface-hover! hover:aria-[current=true]:text-current-foreground!;
|
|
766
766
|
}
|
|
767
|
-
.dx-
|
|
768
|
-
@apply
|
|
767
|
+
.dx-hover-row {
|
|
768
|
+
@apply group-hover/row:bg-hover-surface! group-hover/row:text-hover-foreground! group-hover/row:group-aria-selected/row:bg-selected-surface-hover! group-hover/row:group-aria-selected/row:text-selected-foreground! group-hover/row:group-aria-[current=true]/row:bg-current-surface-hover! group-hover/row:group-aria-[current=true]/row:text-current-foreground!;
|
|
769
|
+
}
|
|
770
|
+
.dx-selected {
|
|
771
|
+
@apply aria-selected:bg-selected-surface! aria-selected:text-selected-foreground! aria-selected:font-semibold aria-selected:tracking-normal transition-[color, font-variation-settings, letter-spacing];
|
|
769
772
|
}
|
|
770
773
|
.dx-current {
|
|
771
|
-
@apply dx-ring-pseudo aria-[current=true]:bg-
|
|
774
|
+
@apply dx-ring-pseudo aria-[current=true]:bg-current-surface! aria-[current=true]:text-current-foreground! aria-[current=true]:after:ring-focus-ring-subtle!;
|
|
772
775
|
}
|
|
773
|
-
.dx-
|
|
774
|
-
@apply aria-
|
|
776
|
+
.dx-current-row {
|
|
777
|
+
@apply group-aria-[current=true]/row:bg-current-surface! group-aria-[current=true]/row:text-current-foreground!;
|
|
778
|
+
}
|
|
779
|
+
.dx-highlighted {
|
|
780
|
+
@apply data-[highlighted]:bg-current-surface data-[highlighted]:text-current-foreground hover:data-[highlighted]:bg-current-surface-hover;
|
|
775
781
|
}
|
|
776
782
|
}
|
|
777
783
|
|
|
778
784
|
/* src/css/components/surface.css */
|
|
779
785
|
@layer dx-components {
|
|
780
786
|
.dx-base-surface {
|
|
781
|
-
@apply bg-base-surface text-base-
|
|
787
|
+
@apply bg-base-surface text-base-foreground;
|
|
782
788
|
--surface-bg: var(--color-base-surface);
|
|
783
789
|
}
|
|
784
790
|
.dx-sidebar-surface {
|
|
785
|
-
@apply bg-sidebar-surface text-base-
|
|
791
|
+
@apply bg-sidebar-surface text-base-foreground;
|
|
786
792
|
--surface-bg: var(--color-sidebar-surface);
|
|
787
793
|
}
|
|
788
794
|
.dx-modal-surface {
|
|
789
|
-
@apply bg-modal-surface text-base-
|
|
795
|
+
@apply bg-modal-surface text-base-foreground backdrop-blur-md;
|
|
790
796
|
--surface-bg: var(--color-modal-surface);
|
|
791
797
|
}
|
|
792
798
|
.dx-attention-surface {
|
|
793
|
-
@apply bg-attention-surface text-base-
|
|
799
|
+
@apply bg-attention-surface text-base-foreground;
|
|
794
800
|
--surface-bg: var(--color-attention-surface);
|
|
795
801
|
}
|
|
796
802
|
}
|
|
@@ -804,98 +810,98 @@
|
|
|
804
810
|
}
|
|
805
811
|
.dx-tag--anchor {
|
|
806
812
|
@apply inline cursor-pointer -mx-[3px] px-[2px] py-0.5 border rounded-xs transition-colors;
|
|
807
|
-
@apply bg-group-surface text-sky-
|
|
813
|
+
@apply bg-group-surface text-sky-foreground border-sky-border;
|
|
808
814
|
&:hover {
|
|
809
815
|
@apply bg-hover-surface;
|
|
810
816
|
}
|
|
811
817
|
}
|
|
812
818
|
.dx-tag[data-hue=neutral],
|
|
813
819
|
.dx-tag--neutral {
|
|
814
|
-
@apply bg-neutral-surface text-neutral-
|
|
820
|
+
@apply bg-neutral-surface text-neutral-foreground;
|
|
815
821
|
}
|
|
816
822
|
.dx-tag[data-hue=red],
|
|
817
823
|
.dx-tag--red {
|
|
818
|
-
@apply bg-red-surface text-red-
|
|
824
|
+
@apply bg-red-surface text-red-foreground;
|
|
819
825
|
}
|
|
820
826
|
.dx-tag[data-hue=orange],
|
|
821
827
|
.dx-tag--orange {
|
|
822
|
-
@apply bg-orange-surface text-orange-
|
|
828
|
+
@apply bg-orange-surface text-orange-foreground;
|
|
823
829
|
}
|
|
824
830
|
.dx-tag[data-hue=amber],
|
|
825
831
|
.dx-tag--amber {
|
|
826
|
-
@apply bg-amber-surface text-amber-
|
|
832
|
+
@apply bg-amber-surface text-amber-foreground;
|
|
827
833
|
}
|
|
828
834
|
.dx-tag[data-hue=yellow],
|
|
829
835
|
.dx-tag--yellow {
|
|
830
|
-
@apply bg-yellow-surface text-yellow-
|
|
836
|
+
@apply bg-yellow-surface text-yellow-foreground;
|
|
831
837
|
}
|
|
832
838
|
.dx-tag[data-hue=lime],
|
|
833
839
|
.dx-tag--lime {
|
|
834
|
-
@apply bg-lime-surface text-lime-
|
|
840
|
+
@apply bg-lime-surface text-lime-foreground;
|
|
835
841
|
}
|
|
836
842
|
.dx-tag[data-hue=green],
|
|
837
843
|
.dx-tag--green {
|
|
838
|
-
@apply bg-green-surface text-green-
|
|
844
|
+
@apply bg-green-surface text-green-foreground;
|
|
839
845
|
}
|
|
840
846
|
.dx-tag[data-hue=emerald],
|
|
841
847
|
.dx-tag--emerald {
|
|
842
|
-
@apply bg-emerald-surface text-emerald-
|
|
848
|
+
@apply bg-emerald-surface text-emerald-foreground;
|
|
843
849
|
}
|
|
844
850
|
.dx-tag[data-hue=teal],
|
|
845
851
|
.dx-tag--teal {
|
|
846
|
-
@apply bg-teal-surface text-teal-
|
|
852
|
+
@apply bg-teal-surface text-teal-foreground;
|
|
847
853
|
}
|
|
848
854
|
.dx-tag[data-hue=cyan],
|
|
849
855
|
.dx-tag--cyan {
|
|
850
|
-
@apply bg-cyan-surface text-cyan-
|
|
856
|
+
@apply bg-cyan-surface text-cyan-foreground;
|
|
851
857
|
}
|
|
852
858
|
.dx-tag[data-hue=sky],
|
|
853
859
|
.dx-tag--sky {
|
|
854
|
-
@apply bg-sky-surface text-sky-
|
|
860
|
+
@apply bg-sky-surface text-sky-foreground;
|
|
855
861
|
}
|
|
856
862
|
.dx-tag[data-hue=blue],
|
|
857
863
|
.dx-tag--blue {
|
|
858
|
-
@apply bg-blue-surface text-blue-
|
|
864
|
+
@apply bg-blue-surface text-blue-foreground;
|
|
859
865
|
}
|
|
860
866
|
.dx-tag[data-hue=indigo],
|
|
861
867
|
.dx-tag--indigo {
|
|
862
|
-
@apply bg-indigo-surface text-indigo-
|
|
868
|
+
@apply bg-indigo-surface text-indigo-foreground;
|
|
863
869
|
}
|
|
864
870
|
.dx-tag[data-hue=violet],
|
|
865
871
|
.dx-tag--violet {
|
|
866
|
-
@apply bg-violet-surface text-violet-
|
|
872
|
+
@apply bg-violet-surface text-violet-foreground;
|
|
867
873
|
}
|
|
868
874
|
.dx-tag[data-hue=purple],
|
|
869
875
|
.dx-tag--purple {
|
|
870
|
-
@apply bg-purple-surface text-purple-
|
|
876
|
+
@apply bg-purple-surface text-purple-foreground;
|
|
871
877
|
}
|
|
872
878
|
.dx-tag[data-hue=fuchsia],
|
|
873
879
|
.dx-tag--fuchsia {
|
|
874
|
-
@apply bg-fuchsia-surface text-fuchsia-
|
|
880
|
+
@apply bg-fuchsia-surface text-fuchsia-foreground;
|
|
875
881
|
}
|
|
876
882
|
.dx-tag[data-hue=pink],
|
|
877
883
|
.dx-tag--pink {
|
|
878
|
-
@apply bg-pink-surface text-pink-
|
|
884
|
+
@apply bg-pink-surface text-pink-foreground;
|
|
879
885
|
}
|
|
880
886
|
.dx-tag[data-hue=rose],
|
|
881
887
|
.dx-tag--rose {
|
|
882
|
-
@apply bg-rose-surface text-rose-
|
|
888
|
+
@apply bg-rose-surface text-rose-foreground;
|
|
883
889
|
}
|
|
884
890
|
.dx-tag[data-hue=info],
|
|
885
891
|
.dx-tag--info {
|
|
886
|
-
@apply bg-cyan-surface text-cyan-
|
|
892
|
+
@apply bg-cyan-surface text-cyan-foreground;
|
|
887
893
|
}
|
|
888
894
|
.dx-tag[data-hue=success],
|
|
889
895
|
.dx-tag--success {
|
|
890
|
-
@apply bg-emerald-surface text-emerald-
|
|
896
|
+
@apply bg-emerald-surface text-emerald-foreground;
|
|
891
897
|
}
|
|
892
898
|
.dx-tag[data-hue=warning],
|
|
893
899
|
.dx-tag--warning {
|
|
894
|
-
@apply bg-amber-surface text-amber-
|
|
900
|
+
@apply bg-amber-surface text-amber-foreground;
|
|
895
901
|
}
|
|
896
902
|
.dx-tag[data-hue=error],
|
|
897
903
|
.dx-tag--error {
|
|
898
|
-
@apply bg-rose-surface text-rose-
|
|
904
|
+
@apply bg-rose-surface text-rose-foreground;
|
|
899
905
|
}
|
|
900
906
|
}
|
|
901
907
|
|
|
@@ -1548,11 +1554,11 @@
|
|
|
1548
1554
|
@source "../../../**/*.{ts,tsx,html}";
|
|
1549
1555
|
@source "../../../../tools/**/*.{ts,tsx,html}";
|
|
1550
1556
|
@source inline("bg-{neutral,red,orange,amber,yellow,lime,green,emerald,teal,cyan,sky,blue,indigo,violet,purple,fuchsia,pink,rose}-{50,100,200,300,400,500,600,700,800,900,950}");
|
|
1551
|
-
@source inline("bg-{neutral,red,orange,amber,yellow,lime,green,emerald,teal,cyan,sky,blue,indigo,violet,purple,fuchsia,pink,rose}-{fill,surface,
|
|
1557
|
+
@source inline("bg-{neutral,red,orange,amber,yellow,lime,green,emerald,teal,cyan,sky,blue,indigo,violet,purple,fuchsia,pink,rose}-{fill,surface,foreground,text,border}");
|
|
1552
1558
|
@source inline("border-{neutral,red,orange,amber,yellow,lime,green,emerald,teal,cyan,sky,blue,indigo,violet,purple,fuchsia,pink,rose}-border");
|
|
1553
|
-
@source inline("bg-{info,success,warning,error}-{fill,surface,
|
|
1559
|
+
@source inline("bg-{info,success,warning,error}-{fill,surface,foreground,text,border}");
|
|
1554
1560
|
@source inline("border-{info,success,warning,error}-border");
|
|
1555
|
-
@source inline("bg-grid-{surface,highlight,comment,comment-active,
|
|
1561
|
+
@source inline("bg-grid-{surface,foreground,line,highlight,comment,comment-active,selection-surface,selection-foreground}");
|
|
1556
1562
|
@plugin "@tailwindcss/forms";
|
|
1557
1563
|
@plugin "tailwind-scrollbar";
|
|
1558
1564
|
@plugin "tailwindcss-radix";
|