(feat): update methanium outline variant

apps/showcase/src/App.tsx

@@ -22,6 +22,7 @@ const navigation = [
   { label: "Orange", icon: Blocks, variant: "subtleDefault" },
   { label: "Apple", icon: Palette, variant: "outline" },
   { label: "Kiwi", icon: Settings, variant: "secondary" },
+  { label: "Ghost", icon: Settings, variant: "ghost" },
 ] as const;
 
 type Category = "conversations" | "communities";

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@methanium/ui",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

src/theme/presets.ts

@@ -307,7 +307,7 @@ export const BUILT_IN_THEMES = defineThemes([
   --primary: #cf8fe6;
   --primary-foreground: #000000;
   --primary-foreground-alt: #bb6fd6;
-  --secondary: #374351;
+  --secondary: #2b3642;
   --secondary-foreground: #d2e0f0;
   --muted: #1d262f;
   --muted-foreground: #9dadc0;
@@ -443,7 +443,10 @@ export const BUILT_IN_THEMES = defineThemes([
 :root.dark[data-theme="methanium"] [data-slot="button"][data-variant="destructive"]:hover {
   background-color: color-mix(in srgb, var(--destructive) 20%, transparent);
 }
-:root[data-theme="methanium"] [data-slot="button"]:where([data-variant="ghost"], [data-variant="link"]):hover {
+:root[data-theme="methanium"] [data-slot="button"][data-variant="ghost"]:hover {
+  background-color: var(--secondary);
+}
+:root[data-theme="methanium"] [data-slot="button"][data-variant="link"]:hover {
   background-color: transparent;
   border-color: color-mix(in srgb, var(--ring) 60%, transparent);
 }`,