@novi-ui/raster 0.1.1 → 0.3.0

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.
Files changed (44) hide show
  1. package/README.md +43 -13
  2. package/dist/avatar/avatar.styles.d.mts +3 -3
  3. package/dist/badge/badge.styles.d.mts +3 -3
  4. package/dist/badge/badge.styles.mjs +2 -2
  5. package/dist/badge/badge.styles.mjs.map +1 -1
  6. package/dist/button/button.styles.d.mts +3 -3
  7. package/dist/button/button.styles.mjs +1 -1
  8. package/dist/button/button.styles.mjs.map +1 -1
  9. package/dist/card/card.styles.d.mts +3 -3
  10. package/dist/card/card.styles.mjs +1 -1
  11. package/dist/card/card.styles.mjs.map +1 -1
  12. package/dist/checkbox/checkbox.styles.mjs +1 -1
  13. package/dist/checkbox/checkbox.styles.mjs.map +1 -1
  14. package/dist/input/input.styles.d.mts +3 -3
  15. package/dist/input/input.styles.mjs +1 -1
  16. package/dist/input/input.styles.mjs.map +1 -1
  17. package/dist/menu/menu.styles.d.mts +6 -6
  18. package/dist/menu/menu.styles.mjs +3 -3
  19. package/dist/menu/menu.styles.mjs.map +1 -1
  20. package/dist/modal/modal.styles.d.mts +3 -3
  21. package/dist/modal/modal.styles.mjs +2 -2
  22. package/dist/modal/modal.styles.mjs.map +1 -1
  23. package/dist/popover/popover.styles.d.mts +3 -3
  24. package/dist/popover/popover.styles.mjs +4 -4
  25. package/dist/popover/popover.styles.mjs.map +1 -1
  26. package/dist/progress/progress.styles.mjs +1 -1
  27. package/dist/progress/progress.styles.mjs.map +1 -1
  28. package/dist/raster.css +207 -25
  29. package/dist/raster.scoped.css +207 -25
  30. package/dist/select/select.styles.d.mts +3 -3
  31. package/dist/select/select.styles.mjs +4 -4
  32. package/dist/select/select.styles.mjs.map +1 -1
  33. package/dist/skeleton/skeleton.styles.d.mts +3 -3
  34. package/dist/skeleton/skeleton.styles.mjs +1 -1
  35. package/dist/skeleton/skeleton.styles.mjs.map +1 -1
  36. package/dist/switch/switch.styles.mjs +2 -2
  37. package/dist/switch/switch.styles.mjs.map +1 -1
  38. package/dist/textarea/textarea.styles.d.mts +3 -3
  39. package/dist/textarea/textarea.styles.mjs +1 -1
  40. package/dist/textarea/textarea.styles.mjs.map +1 -1
  41. package/dist/toast/toast.styles.d.mts +3 -3
  42. package/dist/toast/toast.styles.mjs +2 -2
  43. package/dist/toast/toast.styles.mjs.map +1 -1
  44. package/package.json +1 -1
package/dist/popover/popover.styles.mjs CHANGED
@@ -6,7 +6,7 @@ const slots = {
6
6
  "outline-none",
7
7
  "bg-[var(--novi-color-bg)]",
8
8
  "border border-[var(--novi-color-border-strong)]",
9
- "shadow-none",
9
+ "shadow-[var(--novi-shadow-md)]",
10
10
  "data-[entering]:motion-safe:animate-[novi-fade-in_120ms_ease-out]"
11
11
  ].join(" "),
12
12
  arrow: "hidden",
@@ -27,7 +27,7 @@ const popoverStyles = tv({
27
27
  lg: { root: "rounded-[var(--novi-radius-lg)]" },
28
28
  full: { root: "rounded-[var(--novi-radius-full)]" }
29
29
  } },
30
- defaultVariants: { radius: "none" }
30
+ defaultVariants: { radius: "lg" }
31
31
  });
32
32
  /**
33
33
  * Tooltip のスタイル定義。
@@ -40,8 +40,8 @@ const tooltipStyles = tv({ slots: {
40
40
  "outline-none max-w-xs",
41
41
  "bg-[var(--novi-color-fg)] text-[var(--novi-color-bg)]",
42
42
  "border border-transparent",
43
- "rounded-[var(--novi-radius-none)]",
44
- "shadow-none",
43
+ "rounded-[var(--novi-radius-sm)]",
44
+ "shadow-[var(--novi-shadow-md)]",
45
45
  "data-[entering]:motion-safe:animate-[novi-fade-in_120ms_ease-out]"
46
46
  ].join(" "),
47
47
  arrow: "hidden",
package/dist/popover/popover.styles.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"popover.styles.mjs","names":[],"sources":["../../src/popover/popover.styles.ts"],"sourcesContent":["import type {\n NoviRadius,\n popoverRequiredSlots,\n popoverSlots,\n SlotMap,\n tooltipRequiredSlots,\n tooltipSlots,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\n\nconst slots = {\n root: [\n 'text-[var(--novi-color-fg)]',\n 'outline-none',\n 'bg-[var(--novi-color-bg)]',\n 'border border-[var(--novi-color-border-strong)]',\n 'shadow-none',\n 'data-[entering]:motion-safe:animate-[novi-fade-in_120ms_ease-out]',\n ].join(' '),\n // Raster では arrow を描画しない。任意 slot を省略する実例\n arrow: 'hidden',\n content: 'px-4 py-3 text-[var(--novi-color-fg)] leading-[var(--novi-leading-body)]',\n} satisfies SlotMap<typeof popoverSlots, (typeof popoverRequiredSlots)[number]>\n\nconst radius: VariantMap<NoviRadius, { root: string }> = {\n none: { root: 'rounded-[var(--novi-radius-none)]' },\n sm: { root: 'rounded-[var(--novi-radius-sm)]' },\n md: { root: 'rounded-[var(--novi-radius-md)]' },\n lg: { root: 'rounded-[var(--novi-radius-lg)]' },\n full: { root: 'rounded-[var(--novi-radius-full)]' },\n}\n\n/**\n * Popover のスタイル定義。\n *\n * @example\n * const myPopover = tv({ extend: popoverStyles, slots: { content: 'p-6' } })\n */\nexport const popoverStyles = tv({\n slots,\n variants: { radius },\n defaultVariants: { radius: 'none' },\n})\n\n/**\n * Tooltip のスタイル定義。\n *\n * Popover と違い**反転色**（暗い面に明るい文字）で出す。\n * 補足であって操作対象ではない、という区別を色で伝える。\n */\nexport const tooltipStyles = tv({\n slots: {\n root: [\n 'outline-none max-w-xs',\n 'bg-[var(--novi-color-fg)] text-[var(--novi-color-bg)]',\n 'border border-transparent',\n 'rounded-[var(--novi-radius-none)]',\n 'shadow-none',\n 'data-[entering]:motion-safe:animate-[novi-fade-in_120ms_ease-out]',\n ].join(' '),\n arrow: 'hidden',\n content: 'px-2 py-1 text-[length:var(--novi-text-xs)] leading-snug',\n } satisfies SlotMap<typeof tooltipSlots, (typeof tooltipRequiredSlots)[number]>,\n})\n\nexport type PopoverStyleProps = Parameters<typeof popoverStyles>[0]\nexport type TooltipStyleProps = Parameters<typeof tooltipStyles>[0]\n"],"mappings":";;AAWA,MAAM,QAAQ;CACZ,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,OAAO;CACP,SAAS;AACX;;;;;;;AAgBA,MAAa,gBAAgB,GAAG;CAC9B;CACA,UAAU,EAAE;EAfZ,MAAM,EAAE,MAAM,oCAAoC;EAClD,IAAI,EAAE,MAAM,kCAAkC;EAC9C,IAAI,EAAE,MAAM,kCAAkC;EAC9C,IAAI,EAAE,MAAM,kCAAkC;EAC9C,MAAM,EAAE,MAAM,oCAAoC;CAWtC,EAAO;CACnB,iBAAiB,EAAE,QAAQ,OAAO;AACpC,CAAC;;;;;;;AAQD,MAAa,gBAAgB,GAAG,EAC9B,OAAO;CACL,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,OAAO;CACP,SAAS;AACX,EACF,CAAC"}
1
+ {"version":3,"file":"popover.styles.mjs","names":[],"sources":["../../src/popover/popover.styles.ts"],"sourcesContent":["import type {\n NoviRadius,\n popoverRequiredSlots,\n popoverSlots,\n SlotMap,\n tooltipRequiredSlots,\n tooltipSlots,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\n\nconst slots = {\n root: [\n 'text-[var(--novi-color-fg)]',\n 'outline-none',\n 'bg-[var(--novi-color-bg)]',\n 'border border-[var(--novi-color-border-strong)]',\n 'shadow-[var(--novi-shadow-md)]',\n 'data-[entering]:motion-safe:animate-[novi-fade-in_120ms_ease-out]',\n ].join(' '),\n // Raster では arrow を描画しない。任意 slot を省略する実例\n arrow: 'hidden',\n content: 'px-4 py-3 text-[var(--novi-color-fg)] leading-[var(--novi-leading-body)]',\n} satisfies SlotMap<typeof popoverSlots, (typeof popoverRequiredSlots)[number]>\n\nconst radius: VariantMap<NoviRadius, { root: string }> = {\n none: { root: 'rounded-[var(--novi-radius-none)]' },\n sm: { root: 'rounded-[var(--novi-radius-sm)]' },\n md: { root: 'rounded-[var(--novi-radius-md)]' },\n lg: { root: 'rounded-[var(--novi-radius-lg)]' },\n full: { root: 'rounded-[var(--novi-radius-full)]' },\n}\n\n/**\n * Popover のスタイル定義。\n *\n * @example\n * const myPopover = tv({ extend: popoverStyles, slots: { content: 'p-6' } })\n */\nexport const popoverStyles = tv({\n slots,\n variants: { radius },\n defaultVariants: { radius: 'lg' },\n})\n\n/**\n * Tooltip のスタイル定義。\n *\n * Popover と違い**反転色**（暗い面に明るい文字）で出す。\n * 補足であって操作対象ではない、という区別を色で伝える。\n */\nexport const tooltipStyles = tv({\n slots: {\n root: [\n 'outline-none max-w-xs',\n 'bg-[var(--novi-color-fg)] text-[var(--novi-color-bg)]',\n 'border border-transparent',\n 'rounded-[var(--novi-radius-sm)]',\n 'shadow-[var(--novi-shadow-md)]',\n 'data-[entering]:motion-safe:animate-[novi-fade-in_120ms_ease-out]',\n ].join(' '),\n arrow: 'hidden',\n content: 'px-2 py-1 text-[length:var(--novi-text-xs)] leading-snug',\n } satisfies SlotMap<typeof tooltipSlots, (typeof tooltipRequiredSlots)[number]>,\n})\n\nexport type PopoverStyleProps = Parameters<typeof popoverStyles>[0]\nexport type TooltipStyleProps = Parameters<typeof tooltipStyles>[0]\n"],"mappings":";;AAWA,MAAM,QAAQ;CACZ,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,OAAO;CACP,SAAS;AACX;;;;;;;AAgBA,MAAa,gBAAgB,GAAG;CAC9B;CACA,UAAU,EAAE;EAfZ,MAAM,EAAE,MAAM,oCAAoC;EAClD,IAAI,EAAE,MAAM,kCAAkC;EAC9C,IAAI,EAAE,MAAM,kCAAkC;EAC9C,IAAI,EAAE,MAAM,kCAAkC;EAC9C,MAAM,EAAE,MAAM,oCAAoC;CAWtC,EAAO;CACnB,iBAAiB,EAAE,QAAQ,KAAK;AAClC,CAAC;;;;;;;AAQD,MAAa,gBAAgB,GAAG,EAC9B,OAAO;CACL,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,OAAO;CACP,SAAS;AACX,EACF,CAAC"}
package/dist/progress/progress.styles.mjs CHANGED
@@ -6,7 +6,7 @@ const slots = {
6
6
  track: [
7
7
  "w-full overflow-hidden",
8
8
  "bg-[var(--novi-color-subtle)]",
9
- "rounded-[var(--novi-radius-none)]"
9
+ "rounded-[var(--novi-radius-full)]"
10
10
  ].join(" "),
11
11
  indicator: [
12
12
  "h-full bg-[var(--c)]",
package/dist/progress/progress.styles.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"progress.styles.mjs","names":[],"sources":["../../src/progress/progress.styles.ts"],"sourcesContent":["import type {\n NoviColor,\n NoviSize,\n progressRequiredSlots,\n progressSlots,\n SlotMap,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\n\nconst slots = {\n root: 'flex flex-col gap-1.5 w-full',\n label: 'text-[length:var(--novi-text-sm)] text-[var(--novi-color-fg)]',\n // 細い線1本。面を作らない\n track: [\n 'w-full overflow-hidden',\n 'bg-[var(--novi-color-subtle)]',\n 'rounded-[var(--novi-radius-none)]',\n ].join(' '),\n indicator: [\n 'h-full bg-[var(--c)]',\n 'transition-[width,transform]',\n 'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n ].join(' '),\n // 桁が揺れないよう等幅数字にする\n valueLabel: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)] tabular-nums',\n} satisfies SlotMap<typeof progressSlots, (typeof progressRequiredSlots)[number]>\n\nconst color: VariantMap<NoviColor, { root: string }> = {\n default: { root: '[--c:var(--novi-color-fg)]' },\n primary: { root: '[--c:var(--novi-color-primary)]' },\n secondary: { root: '[--c:var(--novi-color-secondary)]' },\n success: { root: '[--c:var(--novi-color-success)]' },\n warning: { root: '[--c:var(--novi-color-warning)]' },\n danger: { root: '[--c:var(--novi-color-danger)]' },\n}\n\nconst size: VariantMap<NoviSize, { track: string }> = {\n sm: { track: 'h-0.5' },\n md: { track: 'h-1' },\n lg: { track: 'h-1.5' },\n}\n\n/**\n * Progress のスタイル定義。\n *\n * @example\n * const myProgress = tv({ extend: progressStyles, slots: { track: 'h-2' } })\n */\nexport const progressStyles = tv({\n slots,\n variants: {\n color,\n size,\n // 不確定表示。translate のみで表現する（scale や rotate は使わない）\n isIndeterminate: {\n true: { indicator: 'w-1/3 motion-safe:animate-[novi-indeterminate_1.2s_linear_infinite]' },\n false: {},\n },\n },\n defaultVariants: { color: 'default', size: 'md', isIndeterminate: false },\n})\n\nexport type ProgressStyleProps = Parameters<typeof progressStyles>[0]\n"],"mappings":";;AAUA,MAAM,QAAQ;CACZ,MAAM;CACN,OAAO;CAEP,OAAO;EACL;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,WAAW;EACT;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,YAAY;AACd;;;;;;;AAuBA,MAAa,iBAAiB,GAAG;CAC/B;CACA,UAAU;EACR;GAvBF,SAAS,EAAE,MAAM,6BAA6B;GAC9C,SAAS,EAAE,MAAM,kCAAkC;GACnD,WAAW,EAAE,MAAM,oCAAoC;GACvD,SAAS,EAAE,MAAM,kCAAkC;GACnD,SAAS,EAAE,MAAM,kCAAkC;GACnD,QAAQ,EAAE,MAAM,iCAAiC;EAkB/C;EACA;GAfF,IAAI,EAAE,OAAO,QAAQ;GACrB,IAAI,EAAE,OAAO,MAAM;GACnB,IAAI,EAAE,OAAO,QAAQ;EAanB;EAEA,iBAAiB;GACf,MAAM,EAAE,WAAW,sEAAsE;GACzF,OAAO,CAAC;EACV;CACF;CACA,iBAAiB;EAAE,OAAO;EAAW,MAAM;EAAM,iBAAiB;CAAM;AAC1E,CAAC"}
1
+ {"version":3,"file":"progress.styles.mjs","names":[],"sources":["../../src/progress/progress.styles.ts"],"sourcesContent":["import type {\n NoviColor,\n NoviSize,\n progressRequiredSlots,\n progressSlots,\n SlotMap,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\n\nconst slots = {\n root: 'flex flex-col gap-1.5 w-full',\n label: 'text-[length:var(--novi-text-sm)] text-[var(--novi-color-fg)]',\n // 細い線1本。面を作らない\n track: [\n 'w-full overflow-hidden',\n 'bg-[var(--novi-color-subtle)]',\n 'rounded-[var(--novi-radius-full)]',\n ].join(' '),\n indicator: [\n 'h-full bg-[var(--c)]',\n 'transition-[width,transform]',\n 'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n ].join(' '),\n // 桁が揺れないよう等幅数字にする\n valueLabel: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)] tabular-nums',\n} satisfies SlotMap<typeof progressSlots, (typeof progressRequiredSlots)[number]>\n\nconst color: VariantMap<NoviColor, { root: string }> = {\n default: { root: '[--c:var(--novi-color-fg)]' },\n primary: { root: '[--c:var(--novi-color-primary)]' },\n secondary: { root: '[--c:var(--novi-color-secondary)]' },\n success: { root: '[--c:var(--novi-color-success)]' },\n warning: { root: '[--c:var(--novi-color-warning)]' },\n danger: { root: '[--c:var(--novi-color-danger)]' },\n}\n\nconst size: VariantMap<NoviSize, { track: string }> = {\n sm: { track: 'h-0.5' },\n md: { track: 'h-1' },\n lg: { track: 'h-1.5' },\n}\n\n/**\n * Progress のスタイル定義。\n *\n * @example\n * const myProgress = tv({ extend: progressStyles, slots: { track: 'h-2' } })\n */\nexport const progressStyles = tv({\n slots,\n variants: {\n color,\n size,\n // 不確定表示。translate のみで表現する（scale や rotate は使わない）\n isIndeterminate: {\n true: { indicator: 'w-1/3 motion-safe:animate-[novi-indeterminate_1.2s_linear_infinite]' },\n false: {},\n },\n },\n defaultVariants: { color: 'default', size: 'md', isIndeterminate: false },\n})\n\nexport type ProgressStyleProps = Parameters<typeof progressStyles>[0]\n"],"mappings":";;AAUA,MAAM,QAAQ;CACZ,MAAM;CACN,OAAO;CAEP,OAAO;EACL;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,WAAW;EACT;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,YAAY;AACd;;;;;;;AAuBA,MAAa,iBAAiB,GAAG;CAC/B;CACA,UAAU;EACR;GAvBF,SAAS,EAAE,MAAM,6BAA6B;GAC9C,SAAS,EAAE,MAAM,kCAAkC;GACnD,WAAW,EAAE,MAAM,oCAAoC;GACvD,SAAS,EAAE,MAAM,kCAAkC;GACnD,SAAS,EAAE,MAAM,kCAAkC;GACnD,QAAQ,EAAE,MAAM,iCAAiC;EAkB/C;EACA;GAfF,IAAI,EAAE,OAAO,QAAQ;GACrB,IAAI,EAAE,OAAO,MAAM;GACnB,IAAI,EAAE,OAAO,QAAQ;EAanB;EAEA,iBAAiB;GACf,MAAM,EAAE,WAAW,sEAAsE;GACzF,OAAO,CAAC;EACV;CACF;CACA,iBAAiB;EAAE,OAAO;EAAW,MAAM;EAAM,iBAAiB;CAAM;AAC1E,CAAC"}
package/dist/raster.css CHANGED
@@ -1,16 +1,16 @@
1
- /* 自動生成。編集しないこと。src/tokens/raster-tokens.ts を変更して再生成する。 */
1
+ /* 自動生成。編集しないこと。src/tokens/raster-tokens.ts と color-set.ts を変更して再生成する。 */
2
2
 
3
3
  @layer novi.base {
4
4
  :root {
5
5
  --novi-radius-none: 0px;
6
- --novi-radius-sm: 2px;
7
- --novi-radius-md: 2px;
8
- --novi-radius-lg: 2px;
6
+ --novi-radius-sm: 6px;
7
+ --novi-radius-md: 8px;
8
+ --novi-radius-lg: 12px;
9
9
  --novi-radius-full: 9999px;
10
10
  --novi-shadow-none: none;
11
- --novi-shadow-sm: none;
12
- --novi-shadow-md: none;
13
- --novi-shadow-lg: none;
11
+ --novi-shadow-sm: 0 1px 2px oklch(15% 0 0 / 0.06);
12
+ --novi-shadow-md: 0 4px 12px oklch(15% 0 0 / 0.1), 0 1px 3px oklch(15% 0 0 / 0.06);
13
+ --novi-shadow-lg: 0 16px 40px oklch(15% 0 0 / 0.16), 0 4px 12px oklch(15% 0 0 / 0.08);
14
14
  --novi-text-xs: 12px;
15
15
  --novi-text-sm: 14px;
16
16
  --novi-text-base: 16px;
@@ -23,24 +23,25 @@
23
23
  --novi-duration-slow: 120ms;
24
24
  --novi-ease-standard: cubic-bezier(0.2, 0, 0, 1);
25
25
  --novi-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
26
+ --novi-hue: 268;
26
27
  --novi-color-bg: oklch(99% 0 0);
27
28
  --novi-color-subtle: oklch(96% 0 0);
28
29
  --novi-color-fg: oklch(20% 0 0);
29
30
  --novi-color-muted: oklch(48% 0 0);
30
- --novi-color-border: oklch(88% 0 0);
31
+ --novi-color-border: oklch(92% 0 0);
31
32
  --novi-color-border-strong: oklch(58% 0 0);
32
33
  --novi-color-overlay: oklch(20% 0 0 / 0.45);
33
34
  --novi-color-default: oklch(96% 0 0);
34
35
  --novi-color-default-fg: oklch(20% 0 0);
35
- --novi-color-primary: oklch(48% 0.18 250);
36
+ --novi-color-primary: oklch(44% 0.09 268);
36
37
  --novi-color-primary-fg: oklch(99% 0 0);
37
- --novi-color-secondary: oklch(46% 0.16 300);
38
+ --novi-color-secondary: oklch(44% 0.09 35);
38
39
  --novi-color-secondary-fg: oklch(99% 0 0);
39
- --novi-color-success: oklch(45% 0.13 150);
40
+ --novi-color-success: oklch(47% 0.13 155);
40
41
  --novi-color-success-fg: oklch(99% 0 0);
41
- --novi-color-warning: oklch(45% 0.12 70);
42
+ --novi-color-warning: oklch(47% 0.13 60);
42
43
  --novi-color-warning-fg: oklch(99% 0 0);
43
- --novi-color-danger: oklch(48% 0.19 25);
44
+ --novi-color-danger: oklch(50% 0.19 27);
44
45
  --novi-color-danger-fg: oklch(99% 0 0);
45
46
  }
46
47
 
@@ -49,20 +50,20 @@
49
50
  --novi-color-subtle: oklch(21% 0 0);
50
51
  --novi-color-fg: oklch(95% 0 0);
51
52
  --novi-color-muted: oklch(72% 0 0);
52
- --novi-color-border: oklch(28% 0 0);
53
+ --novi-color-border: oklch(27% 0 0);
53
54
  --novi-color-border-strong: oklch(55% 0 0);
54
55
  --novi-color-overlay: oklch(10% 0 0 / 0.6);
55
56
  --novi-color-default: oklch(25% 0 0);
56
57
  --novi-color-default-fg: oklch(95% 0 0);
57
- --novi-color-primary: oklch(74% 0.14 250);
58
+ --novi-color-primary: oklch(74% 0.09 268);
58
59
  --novi-color-primary-fg: oklch(16% 0 0);
59
- --novi-color-secondary: oklch(74% 0.13 300);
60
+ --novi-color-secondary: oklch(74% 0.09 35);
60
61
  --novi-color-secondary-fg: oklch(16% 0 0);
61
- --novi-color-success: oklch(76% 0.13 150);
62
+ --novi-color-success: oklch(77% 0.13 155);
62
63
  --novi-color-success-fg: oklch(16% 0 0);
63
- --novi-color-warning: oklch(82% 0.12 70);
64
+ --novi-color-warning: oklch(81% 0.13 65);
64
65
  --novi-color-warning-fg: oklch(16% 0 0);
65
- --novi-color-danger: oklch(72% 0.16 25);
66
+ --novi-color-danger: oklch(73% 0.16 27);
66
67
  --novi-color-danger-fg: oklch(16% 0 0);
67
68
  }
68
69
 
@@ -72,21 +73,202 @@
72
73
  --novi-color-subtle: oklch(21% 0 0);
73
74
  --novi-color-fg: oklch(95% 0 0);
74
75
  --novi-color-muted: oklch(72% 0 0);
75
- --novi-color-border: oklch(28% 0 0);
76
+ --novi-color-border: oklch(27% 0 0);
76
77
  --novi-color-border-strong: oklch(55% 0 0);
77
78
  --novi-color-overlay: oklch(10% 0 0 / 0.6);
78
79
  --novi-color-default: oklch(25% 0 0);
79
80
  --novi-color-default-fg: oklch(95% 0 0);
80
- --novi-color-primary: oklch(74% 0.14 250);
81
+ --novi-color-primary: oklch(74% 0.09 268);
81
82
  --novi-color-primary-fg: oklch(16% 0 0);
82
- --novi-color-secondary: oklch(74% 0.13 300);
83
+ --novi-color-secondary: oklch(74% 0.09 35);
83
84
  --novi-color-secondary-fg: oklch(16% 0 0);
84
- --novi-color-success: oklch(76% 0.13 150);
85
+ --novi-color-success: oklch(77% 0.13 155);
85
86
  --novi-color-success-fg: oklch(16% 0 0);
86
- --novi-color-warning: oklch(82% 0.12 70);
87
+ --novi-color-warning: oklch(81% 0.13 65);
87
88
  --novi-color-warning-fg: oklch(16% 0 0);
88
- --novi-color-danger: oklch(72% 0.16 25);
89
+ --novi-color-danger: oklch(73% 0.16 27);
89
90
  --novi-color-danger-fg: oklch(16% 0 0);
90
91
  }
91
92
  }
93
+
94
+ /* ── カラーセット Print Inks（specs/06-tones-and-colors） ──
95
+ data-novi-color は data-novi-theme と同じ要素（テーマルート）に置く。
96
+ 未知の色名はどれにも一致せず、既定色 Ink のまま描画される。 */
97
+ [data-novi-color='ink'] {
98
+ --novi-hue: 268;
99
+ --novi-color-primary: oklch(44% 0.09 268);
100
+ --novi-color-primary-fg: oklch(99% 0 0);
101
+ --novi-color-secondary: oklch(44% 0.09 35);
102
+ --novi-color-secondary-fg: oklch(99% 0 0);
103
+ }
104
+
105
+ [data-novi-color='prussian'] {
106
+ --novi-hue: 235;
107
+ --novi-color-primary: oklch(44% 0.09 235);
108
+ --novi-color-primary-fg: oklch(99% 0 0);
109
+ --novi-color-secondary: oklch(44% 0.09 70);
110
+ --novi-color-secondary-fg: oklch(99% 0 0);
111
+ }
112
+
113
+ [data-novi-color='forest'] {
114
+ --novi-hue: 160;
115
+ --novi-color-primary: oklch(44% 0.09 160);
116
+ --novi-color-primary-fg: oklch(99% 0 0);
117
+ --novi-color-secondary: oklch(44% 0.09 70);
118
+ --novi-color-secondary-fg: oklch(99% 0 0);
119
+ }
120
+
121
+ [data-novi-color='olive'] {
122
+ --novi-hue: 125;
123
+ --novi-color-primary: oklch(44% 0.09 125);
124
+ --novi-color-primary-fg: oklch(99% 0 0);
125
+ --novi-color-secondary: oklch(44% 0.09 268);
126
+ --novi-color-secondary-fg: oklch(99% 0 0);
127
+ }
128
+
129
+ [data-novi-color='ochre'] {
130
+ --novi-hue: 70;
131
+ --novi-color-primary: oklch(44% 0.09 70);
132
+ --novi-color-primary-fg: oklch(99% 0 0);
133
+ --novi-color-secondary: oklch(44% 0.09 235);
134
+ --novi-color-secondary-fg: oklch(99% 0 0);
135
+ }
136
+
137
+ [data-novi-color='brick'] {
138
+ --novi-hue: 35;
139
+ --novi-color-primary: oklch(44% 0.09 35);
140
+ --novi-color-primary-fg: oklch(99% 0 0);
141
+ --novi-color-secondary: oklch(44% 0.09 268);
142
+ --novi-color-secondary-fg: oklch(99% 0 0);
143
+ }
144
+
145
+ [data-novi-color='bordeaux'] {
146
+ --novi-hue: 12;
147
+ --novi-color-primary: oklch(44% 0.09 12);
148
+ --novi-color-primary-fg: oklch(99% 0 0);
149
+ --novi-color-secondary: oklch(44% 0.09 70);
150
+ --novi-color-secondary-fg: oklch(99% 0 0);
151
+ }
152
+
153
+ [data-novi-color='graphite'] {
154
+ --novi-hue: 270;
155
+ --novi-color-primary: oklch(44% 0.02 270);
156
+ --novi-color-primary-fg: oklch(99% 0 0);
157
+ --novi-color-secondary: oklch(44% 0.09 35);
158
+ --novi-color-secondary-fg: oklch(99% 0 0);
159
+ }
160
+
161
+ [data-novi-scheme='dark'][data-novi-color='ink'] {
162
+ --novi-color-primary: oklch(74% 0.09 268);
163
+ --novi-color-primary-fg: oklch(16% 0 0);
164
+ --novi-color-secondary: oklch(74% 0.09 35);
165
+ --novi-color-secondary-fg: oklch(16% 0 0);
166
+ }
167
+
168
+ [data-novi-scheme='dark'][data-novi-color='prussian'] {
169
+ --novi-color-primary: oklch(74% 0.09 235);
170
+ --novi-color-primary-fg: oklch(16% 0 0);
171
+ --novi-color-secondary: oklch(74% 0.09 70);
172
+ --novi-color-secondary-fg: oklch(16% 0 0);
173
+ }
174
+
175
+ [data-novi-scheme='dark'][data-novi-color='forest'] {
176
+ --novi-color-primary: oklch(74% 0.09 160);
177
+ --novi-color-primary-fg: oklch(16% 0 0);
178
+ --novi-color-secondary: oklch(74% 0.09 70);
179
+ --novi-color-secondary-fg: oklch(16% 0 0);
180
+ }
181
+
182
+ [data-novi-scheme='dark'][data-novi-color='olive'] {
183
+ --novi-color-primary: oklch(74% 0.09 125);
184
+ --novi-color-primary-fg: oklch(16% 0 0);
185
+ --novi-color-secondary: oklch(74% 0.09 268);
186
+ --novi-color-secondary-fg: oklch(16% 0 0);
187
+ }
188
+
189
+ [data-novi-scheme='dark'][data-novi-color='ochre'] {
190
+ --novi-color-primary: oklch(74% 0.09 70);
191
+ --novi-color-primary-fg: oklch(16% 0 0);
192
+ --novi-color-secondary: oklch(74% 0.09 235);
193
+ --novi-color-secondary-fg: oklch(16% 0 0);
194
+ }
195
+
196
+ [data-novi-scheme='dark'][data-novi-color='brick'] {
197
+ --novi-color-primary: oklch(74% 0.09 35);
198
+ --novi-color-primary-fg: oklch(16% 0 0);
199
+ --novi-color-secondary: oklch(74% 0.09 268);
200
+ --novi-color-secondary-fg: oklch(16% 0 0);
201
+ }
202
+
203
+ [data-novi-scheme='dark'][data-novi-color='bordeaux'] {
204
+ --novi-color-primary: oklch(74% 0.09 12);
205
+ --novi-color-primary-fg: oklch(16% 0 0);
206
+ --novi-color-secondary: oklch(74% 0.09 70);
207
+ --novi-color-secondary-fg: oklch(16% 0 0);
208
+ }
209
+
210
+ [data-novi-scheme='dark'][data-novi-color='graphite'] {
211
+ --novi-color-primary: oklch(74% 0.017 270);
212
+ --novi-color-primary-fg: oklch(16% 0 0);
213
+ --novi-color-secondary: oklch(74% 0.09 35);
214
+ --novi-color-secondary-fg: oklch(16% 0 0);
215
+ }
216
+
217
+ @media (prefers-color-scheme: dark) {
218
+ :root:not([data-novi-scheme='light'])[data-novi-color='ink'] {
219
+ --novi-color-primary: oklch(74% 0.09 268);
220
+ --novi-color-primary-fg: oklch(16% 0 0);
221
+ --novi-color-secondary: oklch(74% 0.09 35);
222
+ --novi-color-secondary-fg: oklch(16% 0 0);
223
+ }
224
+
225
+ :root:not([data-novi-scheme='light'])[data-novi-color='prussian'] {
226
+ --novi-color-primary: oklch(74% 0.09 235);
227
+ --novi-color-primary-fg: oklch(16% 0 0);
228
+ --novi-color-secondary: oklch(74% 0.09 70);
229
+ --novi-color-secondary-fg: oklch(16% 0 0);
230
+ }
231
+
232
+ :root:not([data-novi-scheme='light'])[data-novi-color='forest'] {
233
+ --novi-color-primary: oklch(74% 0.09 160);
234
+ --novi-color-primary-fg: oklch(16% 0 0);
235
+ --novi-color-secondary: oklch(74% 0.09 70);
236
+ --novi-color-secondary-fg: oklch(16% 0 0);
237
+ }
238
+
239
+ :root:not([data-novi-scheme='light'])[data-novi-color='olive'] {
240
+ --novi-color-primary: oklch(74% 0.09 125);
241
+ --novi-color-primary-fg: oklch(16% 0 0);
242
+ --novi-color-secondary: oklch(74% 0.09 268);
243
+ --novi-color-secondary-fg: oklch(16% 0 0);
244
+ }
245
+
246
+ :root:not([data-novi-scheme='light'])[data-novi-color='ochre'] {
247
+ --novi-color-primary: oklch(74% 0.09 70);
248
+ --novi-color-primary-fg: oklch(16% 0 0);
249
+ --novi-color-secondary: oklch(74% 0.09 235);
250
+ --novi-color-secondary-fg: oklch(16% 0 0);
251
+ }
252
+
253
+ :root:not([data-novi-scheme='light'])[data-novi-color='brick'] {
254
+ --novi-color-primary: oklch(74% 0.09 35);
255
+ --novi-color-primary-fg: oklch(16% 0 0);
256
+ --novi-color-secondary: oklch(74% 0.09 268);
257
+ --novi-color-secondary-fg: oklch(16% 0 0);
258
+ }
259
+
260
+ :root:not([data-novi-scheme='light'])[data-novi-color='bordeaux'] {
261
+ --novi-color-primary: oklch(74% 0.09 12);
262
+ --novi-color-primary-fg: oklch(16% 0 0);
263
+ --novi-color-secondary: oklch(74% 0.09 70);
264
+ --novi-color-secondary-fg: oklch(16% 0 0);
265
+ }
266
+
267
+ :root:not([data-novi-scheme='light'])[data-novi-color='graphite'] {
268
+ --novi-color-primary: oklch(74% 0.017 270);
269
+ --novi-color-primary-fg: oklch(16% 0 0);
270
+ --novi-color-secondary: oklch(74% 0.09 35);
271
+ --novi-color-secondary-fg: oklch(16% 0 0);
272
+ }
273
+ }
92
274
  }
package/dist/raster.scoped.css CHANGED
@@ -1,16 +1,16 @@
1
- /* 自動生成。編集しないこと。src/tokens/raster-tokens.ts を変更して再生成する。 */
1
+ /* 自動生成。編集しないこと。src/tokens/raster-tokens.ts と color-set.ts を変更して再生成する。 */
2
2
 
3
3
  @layer novi.base {
4
4
  [data-novi-theme='raster'] {
5
5
  --novi-radius-none: 0px;
6
- --novi-radius-sm: 2px;
7
- --novi-radius-md: 2px;
8
- --novi-radius-lg: 2px;
6
+ --novi-radius-sm: 6px;
7
+ --novi-radius-md: 8px;
8
+ --novi-radius-lg: 12px;
9
9
  --novi-radius-full: 9999px;
10
10
  --novi-shadow-none: none;
11
- --novi-shadow-sm: none;
12
- --novi-shadow-md: none;
13
- --novi-shadow-lg: none;
11
+ --novi-shadow-sm: 0 1px 2px oklch(15% 0 0 / 0.06);
12
+ --novi-shadow-md: 0 4px 12px oklch(15% 0 0 / 0.1), 0 1px 3px oklch(15% 0 0 / 0.06);
13
+ --novi-shadow-lg: 0 16px 40px oklch(15% 0 0 / 0.16), 0 4px 12px oklch(15% 0 0 / 0.08);
14
14
  --novi-text-xs: 12px;
15
15
  --novi-text-sm: 14px;
16
16
  --novi-text-base: 16px;
@@ -23,24 +23,25 @@
23
23
  --novi-duration-slow: 120ms;
24
24
  --novi-ease-standard: cubic-bezier(0.2, 0, 0, 1);
25
25
  --novi-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
26
+ --novi-hue: 268;
26
27
  --novi-color-bg: oklch(99% 0 0);
27
28
  --novi-color-subtle: oklch(96% 0 0);
28
29
  --novi-color-fg: oklch(20% 0 0);
29
30
  --novi-color-muted: oklch(48% 0 0);
30
- --novi-color-border: oklch(88% 0 0);
31
+ --novi-color-border: oklch(92% 0 0);
31
32
  --novi-color-border-strong: oklch(58% 0 0);
32
33
  --novi-color-overlay: oklch(20% 0 0 / 0.45);
33
34
  --novi-color-default: oklch(96% 0 0);
34
35
  --novi-color-default-fg: oklch(20% 0 0);
35
- --novi-color-primary: oklch(48% 0.18 250);
36
+ --novi-color-primary: oklch(44% 0.09 268);
36
37
  --novi-color-primary-fg: oklch(99% 0 0);
37
- --novi-color-secondary: oklch(46% 0.16 300);
38
+ --novi-color-secondary: oklch(44% 0.09 35);
38
39
  --novi-color-secondary-fg: oklch(99% 0 0);
39
- --novi-color-success: oklch(45% 0.13 150);
40
+ --novi-color-success: oklch(47% 0.13 155);
40
41
  --novi-color-success-fg: oklch(99% 0 0);
41
- --novi-color-warning: oklch(45% 0.12 70);
42
+ --novi-color-warning: oklch(47% 0.13 60);
42
43
  --novi-color-warning-fg: oklch(99% 0 0);
43
- --novi-color-danger: oklch(48% 0.19 25);
44
+ --novi-color-danger: oklch(50% 0.19 27);
44
45
  --novi-color-danger-fg: oklch(99% 0 0);
45
46
  }
46
47
 
@@ -49,20 +50,20 @@
49
50
  --novi-color-subtle: oklch(21% 0 0);
50
51
  --novi-color-fg: oklch(95% 0 0);
51
52
  --novi-color-muted: oklch(72% 0 0);
52
- --novi-color-border: oklch(28% 0 0);
53
+ --novi-color-border: oklch(27% 0 0);
53
54
  --novi-color-border-strong: oklch(55% 0 0);
54
55
  --novi-color-overlay: oklch(10% 0 0 / 0.6);
55
56
  --novi-color-default: oklch(25% 0 0);
56
57
  --novi-color-default-fg: oklch(95% 0 0);
57
- --novi-color-primary: oklch(74% 0.14 250);
58
+ --novi-color-primary: oklch(74% 0.09 268);
58
59
  --novi-color-primary-fg: oklch(16% 0 0);
59
- --novi-color-secondary: oklch(74% 0.13 300);
60
+ --novi-color-secondary: oklch(74% 0.09 35);
60
61
  --novi-color-secondary-fg: oklch(16% 0 0);
61
- --novi-color-success: oklch(76% 0.13 150);
62
+ --novi-color-success: oklch(77% 0.13 155);
62
63
  --novi-color-success-fg: oklch(16% 0 0);
63
- --novi-color-warning: oklch(82% 0.12 70);
64
+ --novi-color-warning: oklch(81% 0.13 65);
64
65
  --novi-color-warning-fg: oklch(16% 0 0);
65
- --novi-color-danger: oklch(72% 0.16 25);
66
+ --novi-color-danger: oklch(73% 0.16 27);
66
67
  --novi-color-danger-fg: oklch(16% 0 0);
67
68
  }
68
69
 
@@ -72,21 +73,202 @@
72
73
  --novi-color-subtle: oklch(21% 0 0);
73
74
  --novi-color-fg: oklch(95% 0 0);
74
75
  --novi-color-muted: oklch(72% 0 0);
75
- --novi-color-border: oklch(28% 0 0);
76
+ --novi-color-border: oklch(27% 0 0);
76
77
  --novi-color-border-strong: oklch(55% 0 0);
77
78
  --novi-color-overlay: oklch(10% 0 0 / 0.6);
78
79
  --novi-color-default: oklch(25% 0 0);
79
80
  --novi-color-default-fg: oklch(95% 0 0);
80
- --novi-color-primary: oklch(74% 0.14 250);
81
+ --novi-color-primary: oklch(74% 0.09 268);
81
82
  --novi-color-primary-fg: oklch(16% 0 0);
82
- --novi-color-secondary: oklch(74% 0.13 300);
83
+ --novi-color-secondary: oklch(74% 0.09 35);
83
84
  --novi-color-secondary-fg: oklch(16% 0 0);
84
- --novi-color-success: oklch(76% 0.13 150);
85
+ --novi-color-success: oklch(77% 0.13 155);
85
86
  --novi-color-success-fg: oklch(16% 0 0);
86
- --novi-color-warning: oklch(82% 0.12 70);
87
+ --novi-color-warning: oklch(81% 0.13 65);
87
88
  --novi-color-warning-fg: oklch(16% 0 0);
88
- --novi-color-danger: oklch(72% 0.16 25);
89
+ --novi-color-danger: oklch(73% 0.16 27);
89
90
  --novi-color-danger-fg: oklch(16% 0 0);
90
91
  }
91
92
  }
93
+
94
+ /* ── カラーセット Print Inks（specs/06-tones-and-colors） ──
95
+ data-novi-color は data-novi-theme と同じ要素（テーマルート）に置く。
96
+ 未知の色名はどれにも一致せず、既定色 Ink のまま描画される。 */
97
+ [data-novi-theme='raster'][data-novi-color='ink'] {
98
+ --novi-hue: 268;
99
+ --novi-color-primary: oklch(44% 0.09 268);
100
+ --novi-color-primary-fg: oklch(99% 0 0);
101
+ --novi-color-secondary: oklch(44% 0.09 35);
102
+ --novi-color-secondary-fg: oklch(99% 0 0);
103
+ }
104
+
105
+ [data-novi-theme='raster'][data-novi-color='prussian'] {
106
+ --novi-hue: 235;
107
+ --novi-color-primary: oklch(44% 0.09 235);
108
+ --novi-color-primary-fg: oklch(99% 0 0);
109
+ --novi-color-secondary: oklch(44% 0.09 70);
110
+ --novi-color-secondary-fg: oklch(99% 0 0);
111
+ }
112
+
113
+ [data-novi-theme='raster'][data-novi-color='forest'] {
114
+ --novi-hue: 160;
115
+ --novi-color-primary: oklch(44% 0.09 160);
116
+ --novi-color-primary-fg: oklch(99% 0 0);
117
+ --novi-color-secondary: oklch(44% 0.09 70);
118
+ --novi-color-secondary-fg: oklch(99% 0 0);
119
+ }
120
+
121
+ [data-novi-theme='raster'][data-novi-color='olive'] {
122
+ --novi-hue: 125;
123
+ --novi-color-primary: oklch(44% 0.09 125);
124
+ --novi-color-primary-fg: oklch(99% 0 0);
125
+ --novi-color-secondary: oklch(44% 0.09 268);
126
+ --novi-color-secondary-fg: oklch(99% 0 0);
127
+ }
128
+
129
+ [data-novi-theme='raster'][data-novi-color='ochre'] {
130
+ --novi-hue: 70;
131
+ --novi-color-primary: oklch(44% 0.09 70);
132
+ --novi-color-primary-fg: oklch(99% 0 0);
133
+ --novi-color-secondary: oklch(44% 0.09 235);
134
+ --novi-color-secondary-fg: oklch(99% 0 0);
135
+ }
136
+
137
+ [data-novi-theme='raster'][data-novi-color='brick'] {
138
+ --novi-hue: 35;
139
+ --novi-color-primary: oklch(44% 0.09 35);
140
+ --novi-color-primary-fg: oklch(99% 0 0);
141
+ --novi-color-secondary: oklch(44% 0.09 268);
142
+ --novi-color-secondary-fg: oklch(99% 0 0);
143
+ }
144
+
145
+ [data-novi-theme='raster'][data-novi-color='bordeaux'] {
146
+ --novi-hue: 12;
147
+ --novi-color-primary: oklch(44% 0.09 12);
148
+ --novi-color-primary-fg: oklch(99% 0 0);
149
+ --novi-color-secondary: oklch(44% 0.09 70);
150
+ --novi-color-secondary-fg: oklch(99% 0 0);
151
+ }
152
+
153
+ [data-novi-theme='raster'][data-novi-color='graphite'] {
154
+ --novi-hue: 270;
155
+ --novi-color-primary: oklch(44% 0.02 270);
156
+ --novi-color-primary-fg: oklch(99% 0 0);
157
+ --novi-color-secondary: oklch(44% 0.09 35);
158
+ --novi-color-secondary-fg: oklch(99% 0 0);
159
+ }
160
+
161
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='ink'] {
162
+ --novi-color-primary: oklch(74% 0.09 268);
163
+ --novi-color-primary-fg: oklch(16% 0 0);
164
+ --novi-color-secondary: oklch(74% 0.09 35);
165
+ --novi-color-secondary-fg: oklch(16% 0 0);
166
+ }
167
+
168
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='prussian'] {
169
+ --novi-color-primary: oklch(74% 0.09 235);
170
+ --novi-color-primary-fg: oklch(16% 0 0);
171
+ --novi-color-secondary: oklch(74% 0.09 70);
172
+ --novi-color-secondary-fg: oklch(16% 0 0);
173
+ }
174
+
175
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='forest'] {
176
+ --novi-color-primary: oklch(74% 0.09 160);
177
+ --novi-color-primary-fg: oklch(16% 0 0);
178
+ --novi-color-secondary: oklch(74% 0.09 70);
179
+ --novi-color-secondary-fg: oklch(16% 0 0);
180
+ }
181
+
182
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='olive'] {
183
+ --novi-color-primary: oklch(74% 0.09 125);
184
+ --novi-color-primary-fg: oklch(16% 0 0);
185
+ --novi-color-secondary: oklch(74% 0.09 268);
186
+ --novi-color-secondary-fg: oklch(16% 0 0);
187
+ }
188
+
189
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='ochre'] {
190
+ --novi-color-primary: oklch(74% 0.09 70);
191
+ --novi-color-primary-fg: oklch(16% 0 0);
192
+ --novi-color-secondary: oklch(74% 0.09 235);
193
+ --novi-color-secondary-fg: oklch(16% 0 0);
194
+ }
195
+
196
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='brick'] {
197
+ --novi-color-primary: oklch(74% 0.09 35);
198
+ --novi-color-primary-fg: oklch(16% 0 0);
199
+ --novi-color-secondary: oklch(74% 0.09 268);
200
+ --novi-color-secondary-fg: oklch(16% 0 0);
201
+ }
202
+
203
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='bordeaux'] {
204
+ --novi-color-primary: oklch(74% 0.09 12);
205
+ --novi-color-primary-fg: oklch(16% 0 0);
206
+ --novi-color-secondary: oklch(74% 0.09 70);
207
+ --novi-color-secondary-fg: oklch(16% 0 0);
208
+ }
209
+
210
+ [data-novi-theme='raster'][data-novi-scheme='dark'][data-novi-color='graphite'] {
211
+ --novi-color-primary: oklch(74% 0.017 270);
212
+ --novi-color-primary-fg: oklch(16% 0 0);
213
+ --novi-color-secondary: oklch(74% 0.09 35);
214
+ --novi-color-secondary-fg: oklch(16% 0 0);
215
+ }
216
+
217
+ @media (prefers-color-scheme: dark) {
218
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='ink'] {
219
+ --novi-color-primary: oklch(74% 0.09 268);
220
+ --novi-color-primary-fg: oklch(16% 0 0);
221
+ --novi-color-secondary: oklch(74% 0.09 35);
222
+ --novi-color-secondary-fg: oklch(16% 0 0);
223
+ }
224
+
225
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='prussian'] {
226
+ --novi-color-primary: oklch(74% 0.09 235);
227
+ --novi-color-primary-fg: oklch(16% 0 0);
228
+ --novi-color-secondary: oklch(74% 0.09 70);
229
+ --novi-color-secondary-fg: oklch(16% 0 0);
230
+ }
231
+
232
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='forest'] {
233
+ --novi-color-primary: oklch(74% 0.09 160);
234
+ --novi-color-primary-fg: oklch(16% 0 0);
235
+ --novi-color-secondary: oklch(74% 0.09 70);
236
+ --novi-color-secondary-fg: oklch(16% 0 0);
237
+ }
238
+
239
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='olive'] {
240
+ --novi-color-primary: oklch(74% 0.09 125);
241
+ --novi-color-primary-fg: oklch(16% 0 0);
242
+ --novi-color-secondary: oklch(74% 0.09 268);
243
+ --novi-color-secondary-fg: oklch(16% 0 0);
244
+ }
245
+
246
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='ochre'] {
247
+ --novi-color-primary: oklch(74% 0.09 70);
248
+ --novi-color-primary-fg: oklch(16% 0 0);
249
+ --novi-color-secondary: oklch(74% 0.09 235);
250
+ --novi-color-secondary-fg: oklch(16% 0 0);
251
+ }
252
+
253
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='brick'] {
254
+ --novi-color-primary: oklch(74% 0.09 35);
255
+ --novi-color-primary-fg: oklch(16% 0 0);
256
+ --novi-color-secondary: oklch(74% 0.09 268);
257
+ --novi-color-secondary-fg: oklch(16% 0 0);
258
+ }
259
+
260
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='bordeaux'] {
261
+ --novi-color-primary: oklch(74% 0.09 12);
262
+ --novi-color-primary-fg: oklch(16% 0 0);
263
+ --novi-color-secondary: oklch(74% 0.09 70);
264
+ --novi-color-secondary-fg: oklch(16% 0 0);
265
+ }
266
+
267
+ [data-novi-theme='raster']:not([data-novi-scheme='light'])[data-novi-color='graphite'] {
268
+ --novi-color-primary: oklch(74% 0.017 270);
269
+ --novi-color-primary-fg: oklch(16% 0 0);
270
+ --novi-color-secondary: oklch(74% 0.09 35);
271
+ --novi-color-secondary-fg: oklch(16% 0 0);
272
+ }
273
+ }
92
274
  }