commit 3e48e7191ca4db148fcb9605df4ca93b785d50c5
parent d84b3d5a3f8c363d074747e0b434d725a794b277
Author: triesap <137732411+triesap@users.noreply.github.com>
Date: Fri, 6 Dec 2024 05:43:47 +0000
themes: add `garden` theme
Diffstat:
13 files changed, 284 insertions(+), 243 deletions(-)
diff --git a/themes/src/colors.ts b/themes/src/colors.ts
@@ -3,6 +3,7 @@ import type { HslTuple } from "./types";
export const theme_colors = {
"layer-0-surface": "hsl(var(--layer-0-surface) / <alpha-value>)",
"layer-0-surface_a": "hsl(var(--layer-0-surface_a) / <alpha-value>)",
+ "layer-0-surface_w": "hsl(var(--layer-0-surface_w) / <alpha-value>)",
"layer-0-surface-edge": "hsl(var(--layer-0-surface-edge) / <alpha-value>)",
"layer-0-surface-blur": "hsl(var(--layer-0-surface-blur) / <alpha-value>)",
"layer-1-surface": "hsl(var(--layer-1-surface) / <alpha-value>)",
@@ -15,12 +16,14 @@ export const theme_colors = {
"layer-2-surface-edge": "hsl(var(--layer-2-surface-edge) / <alpha-value>)",
"layer-0-glyph": "hsl(var(--layer-0-glyph) / <alpha-value>)",
"layer-0-glyph_a": "hsl(var(--layer-0-glyph_a) / <alpha-value>)",
+ "layer-0-glyph_pl": "hsl(var(--layer-0-glyph_pl) / <alpha-value>)",
"layer-0-glyph-hl": "hsl(var(--layer-0-glyph-hl) / <alpha-value>)",
"layer-0-glyph-hl_a": "hsl(var(--layer-0-glyph-hl_a) / <alpha-value>)",
"layer-0-glyph-shade": "hsl(var(--layer-0-glyph-shade) / <alpha-value>)",
"layer-0-glyph-label": "hsl(var(--layer-0-glyph-label) / <alpha-value>)",
"layer-1-glyph": "hsl(var(--layer-1-glyph) / <alpha-value>)",
"layer-1-glyph_a": "hsl(var(--layer-1-glyph_a) / <alpha-value>)",
+ "layer-1-glyph_d": "hsl(var(--layer-1-glyph_d) / <alpha-value>)",
"layer-1-glyph_pl": "hsl(var(--layer-1-glyph_pl) / <alpha-value>)",
"layer-1-glyph-hl": "hsl(var(--layer-1-glyph-hl) / <alpha-value>)",
"layer-1-glyph-hl_a": "hsl(var(--layer-1-glyph-hl_a) / <alpha-value>)",
@@ -28,6 +31,7 @@ export const theme_colors = {
"layer-1-glyph-label": "hsl(var(--layer-1-glyph-label) / <alpha-value>)",
"layer-2-glyph": "hsl(var(--layer-2-glyph) / <alpha-value>)",
"layer-2-glyph_a": "hsl(var(--layer-2-glyph_a) / <alpha-value>)",
+ "layer-2-glyph_d": "hsl(var(--layer-2-glyph_d) / <alpha-value>)",
"layer-2-glyph_pl": "hsl(var(--layer-2-glyph_pl) / <alpha-value>)",
"layer-2-glyph-hl": "hsl(var(--layer-2-glyph-hl) / <alpha-value>)",
"layer-2-glyph-hl_a": "hsl(var(--layer-2-glyph-hl_a) / <alpha-value>)",
@@ -38,12 +42,14 @@ export type ThemeLayer0 = {
surface: {
_: HslTuple;
_a: HslTuple;
+ _w: HslTuple;
edge: HslTuple;
blur: HslTuple;
};
glyphs: {
_: HslTuple;
_a: HslTuple;
+ _pl: HslTuple;
hl: HslTuple;
hl_a: HslTuple;
shade: HslTuple;
@@ -62,6 +68,7 @@ export type ThemeLayer1 = {
glyphs: {
_: HslTuple;
_a: HslTuple;
+ _d: HslTuple;
_pl: HslTuple;
hl: HslTuple;
hl_a: HslTuple;
@@ -79,11 +86,10 @@ export type ThemeLayer2 = {
glyphs: {
_: HslTuple;
_a: HslTuple;
+ _d: HslTuple;
_pl: HslTuple;
hl: HslTuple;
hl_a: HslTuple;
shade: HslTuple;
};
};
-
-
diff --git a/themes/src/earth/dark.ts b/themes/src/earth/dark.ts
@@ -1,93 +0,0 @@
-import type { ThemeRecord } from "../types";
-
-export const record_earth_dark: ThemeRecord = {
- layers: {
- layer_0: {
- surface: {
- _: [0, 0, 7],
- _a: [240, 2, 23],
- edge: [274, 4, 11],
- blur: [0, 0, 12],
- },
- glyphs: {
- _: [230, 3, 56],
- _a: [230, 3, 51],
- hl: [210, 100, 52],
- hl_a: [210, 91, 21],
- shade: [240, 3, 57],
- label: [240, 3, 55],
- }
- },
- layer_1: {
- surface: {
- _: [240, 4, 11],
- _a: [240, 2, 23],
- edge: [240, 3, 19],
- err: [0, 0, 0],
- focus: [240, 4, 20],
- },
- glyphs: {
- _: [30, 100, 100],
- _a: [30, 1, 90],
- _pl: [30, 1, 99],
- hl: [210, 100, 52],
- hl_a: [210, 100, 62],
- shade: [230, 4, 61],
- label: [30, 1, 99],
- }
- },
- layer_2: {
- surface: {
- _: [240, 2, 18],
- _a: [240, 3, 15],
- edge: [240, 2, 23],
- },
- glyphs: {
- _: [240, 3, 73],
- _a: [230, 4, 51],
- _pl: [240, 2, 40],
- hl: [210, 100, 52],
- hl_a: [210, 100, 42],
- shade: [230, 4, 61],
- }
- }
- },
- daisy: {
- "primary": [135, 58, 49],
- "primary-focus": [0, 0, 0],
- "primary-content": [0, 0, 0],
- "secondary": [0, 0, 0],
- "secondary-focus": [0, 0, 0],
- "secondary-content": [0, 0, 0],
- "accent": [0, 0, 0],
- "accent-focus": [0, 0, 0],
- "accent-content": [0, 0, 0],
- "neutral": [0, 0, 0],
- "neutral-focus": [0, 0, 0],
- "neutral-content": [240, 2, 55],
- "base-100": [0, 0, 100],
- "base-200": [0, 0, 0],
- "base-300": [0, 0, 0],
- "base-content": [0, 0, 0],
- "info": [211, 100, 50],
- "info-content": [0, 0, 100],
- "success": [135, 58, 49],
- "success-content": [132, 65, 95],
- "warning": [56, 89, 74],
- "warning-content": [56, 59, 34],
- "error": [348, 68, 55],
- "error-content": [348, 83, 76],
- "--rounded-box": [0, 0, 0],
- "--rounded-btn": [0, 0, 0],
- "--rounded-badge": [0, 0, 0],
- "--animation-btn": [0, 0, 0],
- "--animation-input": [0, 0, 0],
- "--btn-text-case": [0, 0, 0],
- "--btn-focus-scale": [0, 0, 0],
- "--border-btn": [0, 0, 0],
- "--tab-border": [0, 0, 0],
- "--tab-radius": [0, 0, 0],
- "--spinner-color-base": [0, 0, 10],
- "--spinner-color-white": [0, 0, 100],
- },
-};
-\ No newline at end of file
diff --git a/themes/src/earth/index.ts b/themes/src/earth/index.ts
@@ -1,20 +0,0 @@
-import type { ColorKeyDark, ColorKeyLight } from "../types";
-import { write_daisy, write_layers } from "../utils";
-import { record_earth_dark as dark } from "./dark";
-import { record_earth_light as light } from "./light";
-
-type key = `earth`;
-
-export const theme_earth_light: Record<ColorKeyLight<key>, Record<string, string>> = {
- earth_light: {
- ...write_daisy(light.daisy),
- ...write_layers(light.layers)
- }
-};
-
-export const theme_earth_dark: Record<ColorKeyDark<key>, Record<string, string>> = {
- earth_dark: {
- ...write_daisy(dark.daisy),
- ...write_layers(dark.layers)
- }
-};
diff --git a/themes/src/earth/light.ts b/themes/src/earth/light.ts
@@ -1,94 +0,0 @@
-import type { ThemeRecord } from "../types";
-
-export const record_earth_light: ThemeRecord = {
- layers: {
- layer_0: {
- surface: {
- _: [47, 32, 92],
- _a: [240, 6, 83],
- edge: [0, 0, 87],
- blur: [179, 7, 96],
- },
- glyphs: {
- _: [180, 2, 12],
- _a: [240, 2, 60],
- hl: [211, 100, 50],
- hl_a: [211, 100, 40],
- shade: [230, 3, 54],
- label: [240, 2, 53],
- }
- },
- layer_1: {
- surface: {
- _: [46, 23, 86],
- _a: [46, 23, 86],
- edge: [240, 2, 55],
- err: [51, 11, 77],
- focus: [240, 5, 92],
- },
- glyphs: {
- _: [240, 1, 38],
- _a: [0, 0, 10],
- _pl: [0, 0, 0],
- hl: [211, 100, 50],
- hl_a: [211, 100, 40],
- shade: [240, 2, 55],
- label: [240, 2, 53],
- }
- },
- layer_2: {
- surface: {
- _: [47, 43, 92],
- _a: [240, 5, 95],
- edge: [242, 2, 88],
- },
- glyphs: {
- _: [240, 2, 55],
- _a: [240, 2, 45],
- _pl: [240, 2, 78],
- hl: [211, 100, 50],
- hl_a: [211, 100, 40],
- shade: [240, 2, 55],
- }
- }
- },
- daisy: {
- "primary": [0, 0, 0],
- "primary-focus": [0, 0, 0],
- "primary-content": [0, 0, 0],
- "secondary": [0, 0, 0],
- "secondary-focus": [0, 0, 0],
- "secondary-content": [0, 0, 0],
- "accent": [0, 0, 0],
- "accent-focus": [0, 0, 0],
- "accent-content": [0, 0, 0],
- "neutral": [0, 0, 0],
- "neutral-focus": [0, 0, 0],
- "neutral-content": [240, 2, 55],
- "base-100": [0, 0, 100],
- "base-200": [0, 0, 0],
- "base-300": [0, 0, 0],
- "base-content": [0, 0, 0],
- "info": [211, 100, 50],
- "info-content": [0, 0, 100],
- "success": [135, 58, 49],
- "success-content": [132, 65, 95],
- "warning": [56, 89, 74],
- "warning-content": [56, 59, 34],
- "error": [3, 58, 36],
- //[348, 68, 55],
- "error-content": [348, 83, 76],
- "--rounded-box": [0, 0, 0],
- "--rounded-btn": [0, 0, 0],
- "--rounded-badge": [0, 0, 0],
- "--animation-btn": [0, 0, 0],
- "--animation-input": [0, 0, 0],
- "--btn-text-case": [0, 0, 0],
- "--btn-focus-scale": [0, 0, 0],
- "--border-btn": [0, 0, 0],
- "--tab-border": [0, 0, 0],
- "--tab-radius": [0, 0, 0],
- "--spinner-color-base": [0, 0, 10],
- "--spinner-color-white": [0, 0, 100],
- },
-};
-\ No newline at end of file
diff --git a/themes/src/garden/dark.ts b/themes/src/garden/dark.ts
@@ -0,0 +1,97 @@
+import type { ThemeRecord } from "../types";
+
+export const record_garden_dark: ThemeRecord = {
+ layers: {
+ layer_0: {
+ surface: {
+ _: [0, 0, 7],
+ _w: [0, 0, 7],
+ _a: [240, 2, 23],
+ edge: [274, 4, 11],
+ blur: [0, 0, 12],
+ },
+ glyphs: {
+ _: [230, 3, 56],
+ _a: [230, 3, 51],
+ _pl: [30, 1, 99],
+ hl: [210, 100, 52],
+ hl_a: [210, 91, 21],
+ shade: [240, 3, 57],
+ label: [240, 3, 55],
+ }
+ },
+ layer_1: {
+ surface: {
+ _: [240, 4, 11],
+ _a: [240, 2, 23],
+ edge: [240, 3, 19],
+ err: [0, 0, 0],
+ focus: [240, 4, 20],
+ },
+ glyphs: {
+ _: [30, 100, 100],
+ _a: [30, 1, 90],
+ _d: [30, 1, 80],
+ _pl: [30, 1, 99],
+ hl: [210, 100, 52],
+ hl_a: [210, 100, 62],
+ shade: [230, 4, 61],
+ label: [30, 1, 99],
+ }
+ },
+ layer_2: {
+ surface: {
+ _: [240, 2, 18],
+ _a: [240, 3, 15],
+ edge: [240, 2, 23],
+ },
+ glyphs: {
+ _: [240, 3, 73],
+ _a: [230, 4, 51],
+ _d: [230, 4, 61],
+ _pl: [240, 2, 40],
+ hl: [210, 100, 52],
+ hl_a: [210, 100, 42],
+ shade: [230, 4, 61],
+ }
+ }
+ },
+ daisy: {
+ "primary": [0, 0, 0],
+ "primary-focus": [0, 0, 0],
+ "primary-content": [0, 0, 0],
+ "secondary": [0, 0, 0],
+ "secondary-focus": [0, 0, 0],
+ "secondary-content": [0, 0, 0],
+ "accent": [0, 0, 0],
+ "accent-focus": [0, 0, 0],
+ "accent-content": [0, 0, 0],
+ "neutral": [0, 0, 0],
+ "neutral-focus": [0, 0, 0],
+ "neutral-content": [240, 2, 55],
+ "base-100": [0, 0, 100],
+ "base-200": [0, 0, 0],
+ "base-300": [0, 0, 0],
+ "base-content": [0, 0, 0],
+ "info": [211, 100, 50],
+ "info-content": [0, 0, 100],
+ "success": [135, 58, 49],
+ "success-content": [132, 65, 95],
+ "warning": [56, 89, 74],
+ "warning-content": [56, 59, 34],
+ "error": [348, 68, 55],
+ "error-content": [348, 83, 76],
+ "--rounded-box": [0, 0, 0],
+ "--rounded-btn": [0, 0, 0],
+ "--rounded-badge": [0, 0, 0],
+ "--animation-btn": [0, 0, 0],
+ "--animation-input": [0, 0, 0],
+ "--btn-text-case": [0, 0, 0],
+ "--btn-focus-scale": [0, 0, 0],
+ "--border-btn": [0, 0, 0],
+ "--tab-border": [0, 0, 0],
+ "--tab-radius": [0, 0, 0],
+ "--spinner-color-base": [0, 0, 10],
+ "--spinner-color-white": [0, 0, 100],
+ },
+};
+\ No newline at end of file
diff --git a/themes/src/garden/index.ts b/themes/src/garden/index.ts
@@ -0,0 +1,20 @@
+import type { ColorKeyDark, ColorKeyLight } from "../types";
+import { write_daisy, write_layers } from "../utils";
+import { record_garden_dark as dark } from "./dark";
+import { record_garden_light as light } from "./light";
+
+type key = `garden`;
+
+export const theme_garden_light: Record<ColorKeyLight<key>, Record<string, string>> = {
+ garden_light: {
+ ...write_daisy(light.daisy),
+ ...write_layers(light.layers)
+ }
+};
+
+export const theme_garden_dark: Record<ColorKeyDark<key>, Record<string, string>> = {
+ garden_dark: {
+ ...write_daisy(dark.daisy),
+ ...write_layers(dark.layers)
+ }
+};
diff --git a/themes/src/garden/light.ts b/themes/src/garden/light.ts
@@ -0,0 +1,116 @@
+import type { ThemeRecord } from "../types";
+
+export const record_garden_light: ThemeRecord = {
+ layers: {
+ layer_0: {
+ surface: {
+ //rgb(135, 163, 126)
+ // _: [86, 38, 87],
+ //_: [86, 39, 83],
+ // _: [112, 41, 85],
+ _: [86, 30, 95],
+ //[95, 27, 82],
+ // hsl(86, 30%, 95%)
+ _w: [248, 248, 250],
+ _a: [240, 6, 83],
+ edge: [0, 0, 87],
+ blur: [0, 0, 100],
+ //[179, 7, 96],
+ },
+ glyphs: {
+ // _: [101, 56, 22],
+ // _: [180, 4, 26],
+ _: [180, 2, 32],
+ _a: [240, 2, 60],
+ _pl: [240, 2, 78],
+ hl: [211, 100, 50],
+ hl_a: [211, 100, 40],
+ shade: [230, 3, 54],
+ label: [240, 2, 53],
+ }
+ },
+ layer_1: {
+ surface: {
+ //_: [92, 42, 74],
+ // _: [112, 32, 78],
+ //_: [95, 26, 77],
+ _: [87, 15, 88],
+ _a: [89, 14, 68],
+ edge: [274, 4, 90],
+ err: [0, 0, 0],
+ focus: [46, 46, 88],
+ },
+ glyphs: {
+ // _: [112, 15, 22],
+ _: [180, 2, 40],
+ _a: [0, 0, 10],
+ _d: [0, 0, 20],
+ _pl: [0, 0, 0],
+ hl: [211, 100, 50],
+ hl_a: [211, 100, 40],
+ shade: [240, 2, 55],
+ label: [240, 2, 53],
+ }
+ },
+ layer_2: {
+ surface: {
+ //_: [96, 21, 65],
+ _: [193, 204, 182],
+ _a: [240, 5, 95],
+ edge: [242, 2, 88],
+ },
+ glyphs: {
+ _: [240, 2, 55],
+ _a: [240, 2, 45],
+ _d: [240, 2, 65],
+ _pl: [240, 2, 78],
+ hl: [211, 100, 50],
+ hl_a: [211, 100, 40],
+ shade: [240, 2, 55],
+ }
+ }
+ },
+ daisy: {
+ "primary": [219, 92, 58],
+ "primary-focus": [216, 92, 66],
+ "primary-content": [0, 0, 100],
+ "secondary": [0, 0, 0],
+ "secondary-focus": [0, 0, 0],
+ "secondary-content": [0, 0, 0],
+ "accent": [0, 0, 0],
+ "accent-focus": [0, 0, 0],
+ "accent-content": [0, 0, 0],
+ "neutral": [240, 3, 94],
+ "neutral-focus": [240, 4, 95],
+ "neutral-content": [219, 92, 58],
+ "base-100": [89, 29, 82],
+ //[84, 26, 96],
+ //[87, 43, 96],//[84, 17, 96],
+ //hsl(90, 29%, 77%)
+ "base-200": [90, 29, 77],
+ //[87, 13, 86], hsl(89, 29%, 73%)
+ "base-300": [89, 29, 73],
+ "base-content": [0, 0, 0],
+ "info": [211, 100, 50],
+ "info-content": [0, 0, 100],
+ "success": [121, 45, 58],
+ //[135, 58, 49],
+ "success-content": [132, 65, 95],
+ "warning": [56, 89, 74],
+ "warning-content": [56, 59, 34],
+ "error": [348, 68, 55],
+ "error-content": [348, 83, 76],
+ "--rounded-box": [0, 0, 0],
+ "--rounded-btn": [0, 0, 0],
+ "--rounded-badge": [0, 0, 0],
+ "--animation-btn": [0, 0, 0],
+ "--animation-input": [0, 0, 0],
+ "--btn-text-case": [0, 0, 0],
+ "--btn-focus-scale": [0, 0, 0],
+ "--border-btn": [0, 0, 0],
+ "--tab-border": [0, 0, 0],
+ "--tab-radius": [0, 0, 0],
+ "--spinner-color-base": [0, 0, 10],
+ "--spinner-color-white": [0, 0, 100],
+ },
+};
+\ No newline at end of file
diff --git a/themes/src/index.ts b/themes/src/index.ts
@@ -1,4 +1,5 @@
export { theme_colors } from "./colors";
export { themes } from "./theme";
export type { ColorMode, Theme, ThemeKey, ThemeLayer } from "./types";
-export { parse_theme_key, parse_color_mode } from "./utils"
+export { parse_color_mode, parse_theme_key } from "./utils";
+
diff --git a/themes/src/os/dark.ts b/themes/src/os/dark.ts
@@ -5,6 +5,7 @@ export const record_os_dark: ThemeRecord = {
layer_0: {
surface: {
_: [0, 0, 7],
+ _w: [0, 0, 7],
_a: [240, 2, 23],
edge: [274, 4, 11],
blur: [0, 0, 12],
@@ -12,6 +13,7 @@ export const record_os_dark: ThemeRecord = {
glyphs: {
_: [230, 3, 56],
_a: [230, 3, 51],
+ _pl: [30, 1, 99],
hl: [210, 100, 52],
hl_a: [210, 91, 21],
shade: [240, 3, 57],
@@ -29,6 +31,7 @@ export const record_os_dark: ThemeRecord = {
glyphs: {
_: [30, 100, 100],
_a: [30, 1, 90],
+ _d: [240, 1, 82],
_pl: [30, 1, 99],
hl: [210, 100, 52],
hl_a: [210, 100, 62],
@@ -45,6 +48,7 @@ export const record_os_dark: ThemeRecord = {
glyphs: {
_: [240, 3, 73],
_a: [230, 4, 51],
+ _d: [240, 3, 63],
_pl: [240, 2, 40],
hl: [210, 100, 52],
hl_a: [210, 100, 42],
diff --git a/themes/src/os/light.ts b/themes/src/os/light.ts
@@ -4,15 +4,17 @@ export const record_os_light: ThemeRecord = {
layers: {
layer_0: {
surface: {
- _: [240, 20, 96],
+ _: [240, 24, 96],
+ _w: [248, 248, 250],
_a: [240, 6, 83],
edge: [0, 0, 87],
blur: [179, 7, 96],
},
glyphs: {
- _: [0, 0, 0],
+ _: [240, 2, 55],
_a: [240, 2, 60],
- hl: [211, 100, 50],
+ _pl: [240, 2, 78],
+ hl: [219, 92, 59],
hl_a: [211, 100, 40],
shade: [230, 3, 54],
label: [240, 2, 53],
@@ -20,16 +22,17 @@ export const record_os_light: ThemeRecord = {
},
layer_1: {
surface: {
- _: [30, 100, 100],
+ _: [0, 0, 100],
_a: [240, 6, 83],
edge: [274, 4, 90],
err: [0, 0, 0],
- focus: [240, 5, 92],
+ focus: [240, 15, 94],//[240, 5, 92],
},
glyphs: {
- _: [0, 0, 0],
+ _: [0, 0, 10],
_a: [0, 0, 10],
- _pl: [0, 0, 0],
+ _d: [0, 0, 20],
+ _pl: [240, 2, 78],
hl: [211, 100, 50],
hl_a: [211, 100, 40],
shade: [240, 2, 55],
@@ -45,6 +48,7 @@ export const record_os_light: ThemeRecord = {
glyphs: {
_: [240, 2, 55],
_a: [240, 2, 45],
+ _d: [240, 2, 65],
_pl: [240, 2, 78],
hl: [211, 100, 50],
hl_a: [211, 100, 40],
diff --git a/themes/src/theme.ts b/themes/src/theme.ts
@@ -1,9 +1,9 @@
-import { theme_earth_dark, theme_earth_light } from "./earth";
+import { theme_garden_dark, theme_garden_light } from "./garden";
import { theme_os_dark, theme_os_light } from "./os";
export const themes = {
theme_os_light,
theme_os_dark,
- theme_earth_light,
- theme_earth_dark,
+ theme_garden_light,
+ theme_garden_dark
}
diff --git a/themes/src/types.ts b/themes/src/types.ts
@@ -9,7 +9,7 @@ export type ColorKeyDark<T extends ThemeKey> = `${T}_dark`;
export type HslTuple = [number, number, number];
export type Theme = keyof typeof themes;
-export type ThemeKey = `os` | `earth`;
+export type ThemeKey = `os` | `garden`;
export type ThemeLayer = 0 | 1 | 2;
export type ThemeRecord = { layers: ThemeLayers } & { daisy: ThemeDaisy };
export type ThemeLayers = {
diff --git a/themes/src/utils.ts b/themes/src/utils.ts
@@ -1,44 +1,42 @@
import type { ColorMode, HslTuple, ThemeDaisy, ThemeKey, ThemeLayers } from "./types";
export const hsl = (c: HslTuple): string => `${c[0]}deg ${c[1]}% ${c[2]}%`;
-
export const hsl_lighten = (c: HslTuple, amt: number = 25): string => hsl([c[0], c[1], c[2] + amt]);
-
export const hsl_darken = (c: HslTuple, amt: number = 25): string => hsl([c[0], c[1], c[2] - amt]);
-
export const hsl_css = (c: HslTuple): string => `hsl(${hsl(c)})`;
-
export const write_daisy = (obj_c: ThemeDaisy): Record<string, string> => Object.fromEntries(
- Object.entries(obj_c).map(([key, val]) => [key, hsl_css(val)])
+ Object.entries(obj_c).map(([key, val]) => [key, hsl_css(val)])
);
export const parse_theme_key = (key?: string): ThemeKey => {
- switch (key) {
+ switch (key) {
case "os":
- case "earth":
- return key;
- default:
- return "os";
- };
+ case "garden":
+ return key;
+ default:
+ return "os";
+ }
};
export const parse_color_mode = (color_mode?: string): ColorMode => {
- switch (color_mode) {
- case "light":
- case "dark":
- return color_mode;
- default:
- return "light";
- };
+ switch (color_mode) {
+ case "light":
+ case "dark":
+ return color_mode;
+ default:
+ return "light";
+ }
};
export const write_layers = ({ layer_0: { surface: l0_s, glyphs: l0_g }, layer_1: { surface: l1_s, glyphs: l1_g }, layer_2: { surface: l2_s, glyphs: l2_g }}: ThemeLayers): Record<string, string> => ({
"--layer-0-surface": hsl(l0_s._),
"--layer-0-surface_a": hsl(l0_s._a),
+ "--layer-0-surface_w": hsl(l0_s._w),
"--layer-0-surface-edge": hsl(l0_s.edge),
"--layer-0-surface-blur": hsl(l0_s.blur),
"--layer-0-glyph": hsl(l0_g._),
"--layer-0-glyph_a": hsl(l0_g._a),
+ "--layer-0-glyph_pl": hsl(l0_g._pl),
"--layer-0-glyph-hl": hsl(l0_g.hl),
"--layer-0-glyph-hl_a": hsl(l0_g.hl_a),
"--layer-0-glyph-shade": hsl(l0_g.shade),
@@ -50,7 +48,8 @@ export const write_layers = ({ layer_0: { surface: l0_s, glyphs: l0_g }, layer_1
"--layer-1-surface-focus": hsl(l1_s.focus),
"--layer-1-glyph": hsl(l1_g._),
"--layer-1-glyph_a": hsl(l1_g._a),
- "--layer-1-glyph-_pl": hsl(l1_g._pl),
+ "--layer-1-glyph_d": hsl(l1_g._d),
+ "--layer-1-glyph_pl": hsl(l1_g._pl),
"--layer-1-glyph-hl": hsl(l1_g.hl),
"--layer-1-glyph-hl_a": hsl(l1_g.hl_a),
"--layer-1-glyph-shade": hsl(l1_g.shade),
@@ -60,7 +59,8 @@ export const write_layers = ({ layer_0: { surface: l0_s, glyphs: l0_g }, layer_1
"--layer-2-surface-edge": hsl(l2_s.edge),
"--layer-2-glyph": hsl(l2_g._),
"--layer-2-glyph_a": hsl(l2_g._a),
- "--layer-2-glyph-_pl": hsl(l2_g._pl),
+ "--layer-2-glyph_d": hsl(l2_g._d),
+ "--layer-2-glyph_pl": hsl(l2_g._pl),
"--layer-2-glyph-hl": hsl(l2_g.hl),
"--layer-2-glyph-hl_a": hsl(l2_g.hl_a),
"--layer-2-glyph-shade": hsl(l2_g.shade),