Remove custom theming page (for now)

Author: techniq

packages/svelte-ux/src/routes/_NavMenu.svelte

@@ -76,7 +76,7 @@
 
 <NavItem text="Getting Started" icon={mdiHome} currentUrl={$page.url} path="/" />
 <NavItem text="Customization" icon={mdiCog} currentUrl={$page.url} path="/customization" />
-<NavItem text="Theme" icon={mdiPalette} currentUrl={$page.url} path="/theme" />
+<!-- <NavItem text="Theme" icon={mdiPalette} currentUrl={$page.url} path="/theme" /> -->
 <NavItem text="Changelog" icon={mdiFormatListBulleted} currentUrl={$page.url} path="/changelog" />
 
 <h1>Components</h1>

packages/svelte-ux/src/routes/theme/+page.server.ts

@@ -1,11 +1,11 @@
-import { themes as daisyThemes } from '@layerstack/tailwind/daisy';
-import { themes as skeletonThemes } from '@layerstack/tailwind/skeleton';
+// import { themes as daisyThemes } from '@layerstack/tailwind/daisy';
+// import { themes as skeletonThemes } from '@layerstack/tailwind/skeleton';
 
-export async function load() {
-  return {
-    themes: {
-      daisy: daisyThemes,
-      skeleton: skeletonThemes,
-    },
-  };
-}
+// export async function load() {
+//   return {
+//     themes: {
+//       daisy: daisyThemes,
+//       skeleton: skeletonThemes,
+//     },
+//   };
+// }

packages/svelte-ux/src/routes/theme/+page.svelte

@@ -1,4 +1,4 @@
-<script lang="ts">
+<!-- <script lang="ts">
   import { mdiChevronDown, mdiWeatherNight, mdiWhiteBalanceSunny } from '@mdi/js';
 
   import {
@@ -539,4 +539,4 @@
   .shade span {
     @apply bg-black/10 rounded px-2 text-white;
   }
-</style>
+</style> -->

packages/svelte-ux/src/routes/theme/colors.ts

@@ -1,4 +1,4 @@
-import { colorVariableValue, type SupportedColorSpace } from '@layerstack/tailwind';
+import { convertColor, type SupportedColorSpace } from '@layerstack/tailwind';
 import { formatHex } from 'culori';
 
 export function formatColor(value: string, colorSpace: SupportedColorSpace | 'hex') {
@@ -7,9 +7,9 @@ export function formatColor(value: string, colorSpace: SupportedColorSpace | 'he
       // Only format if not already formatted.  Fixes `#123` becoming `#112233`
       return value.startsWith('#') ? value : formatHex(value);
     } else {
-      const colorValue = colorVariableValue(value, colorSpace);
-      if (colorValue) {
-        return `${colorSpace}(${colorValue})`;
+      const color = convertColor(value, colorSpace);
+      if (color) {
+        return color;
       } else {
         // Return original if unable to convert (i.e invalid such as `rgb( 20 30)`)
         return value;