From e852dba38933743d4d0541cda547f5364881b3d4 Mon Sep 17 00:00:00 2001 From: Vauxs Date: Mon, 20 Jul 2026 14:46:51 +0200 Subject: [PATCH 1/4] Refactor color variables in skeleton-5.css Updated CSS variables for surface colors and content colors in dark mode. --- .../layerchart/src/lib/styles/skeleton-5.css | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) create mode 100644 packages/layerchart/src/lib/styles/skeleton-5.css diff --git a/packages/layerchart/src/lib/styles/skeleton-5.css b/packages/layerchart/src/lib/styles/skeleton-5.css new file mode 100644 index 000000000..5f2693f6b --- /dev/null +++ b/packages/layerchart/src/lib/styles/skeleton-5.css @@ -0,0 +1,17 @@ +@import './core.css'; + +.lc-root-container { + --color-primary: var(--color-primary-500); + + --color-surface-100: var(--color-surface-50-950); + --color-surface-200: var(--color-surface-100); + --color-surface-300: var(--color-surface-200); + --color-surface-content: var(--typo-base--color-dark); + + html.dark & { + --color-surface-100: var(--color-surface-700); + --color-surface-200: var(--color-surface-800); + --color-surface-300: var(--color-surface-900); + --color-surface-content: var(--typo-base--color-light); + } +} From b4a4555f8ed3ce1456499fe63102cf8bb933166f Mon Sep 17 00:00:00 2001 From: Vauxs Date: Mon, 20 Jul 2026 15:03:41 +0200 Subject: [PATCH 2/4] Make the surface-content work on default dark mode --- packages/layerchart/src/lib/styles/skeleton-5.css | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/layerchart/src/lib/styles/skeleton-5.css b/packages/layerchart/src/lib/styles/skeleton-5.css index 5f2693f6b..169bd9488 100644 --- a/packages/layerchart/src/lib/styles/skeleton-5.css +++ b/packages/layerchart/src/lib/styles/skeleton-5.css @@ -6,7 +6,10 @@ --color-surface-100: var(--color-surface-50-950); --color-surface-200: var(--color-surface-100); --color-surface-300: var(--color-surface-200); - --color-surface-content: var(--typo-base--color-dark); + --color-surface-content: light-dark( + var(--typo-base--color-light), + var(--typo-base--color-dark) + ); html.dark & { --color-surface-100: var(--color-surface-700); From b2702fadbfc985d883d609f51745e7124150f0b9 Mon Sep 17 00:00:00 2001 From: Vauxs Date: Mon, 20 Jul 2026 13:13:38 +0000 Subject: [PATCH 3/4] Add changeset --- .changeset/bold-cats-cry.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/bold-cats-cry.md diff --git a/.changeset/bold-cats-cry.md b/.changeset/bold-cats-cry.md new file mode 100644 index 000000000..56954ec66 --- /dev/null +++ b/.changeset/bold-cats-cry.md @@ -0,0 +1,5 @@ +--- +'layerchart': patch +--- + +Added skeleton-5.css From 6effaadcf1254823a08273ecc7447b3054291add Mon Sep 17 00:00:00 2001 From: Vauxs Date: Mon, 20 Jul 2026 15:48:37 +0200 Subject: [PATCH 4/4] Update skeleton-5.css --- packages/layerchart/src/lib/styles/skeleton-5.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/layerchart/src/lib/styles/skeleton-5.css b/packages/layerchart/src/lib/styles/skeleton-5.css index 169bd9488..d8797c03e 100644 --- a/packages/layerchart/src/lib/styles/skeleton-5.css +++ b/packages/layerchart/src/lib/styles/skeleton-5.css @@ -15,6 +15,6 @@ --color-surface-100: var(--color-surface-700); --color-surface-200: var(--color-surface-800); --color-surface-300: var(--color-surface-900); - --color-surface-content: var(--typo-base--color-light); + --color-surface-content: var(--typo-base--color-dark); } }