methanium/ui
Watch
3
0
Fork
You've already forked ui
 0
Code Issues Pull requests 3 Projects Releases 21 Packages Wiki Activity Actions

(feat): fix tensamin theme
All checks were successful
/ deploy-and-package (push) Successful in 1m7s
Details

Browse source
This commit is contained in:
Alois 2026-07-30 21:16:57 +02:00
commit ba544ec649
Signed by: alois
SSH key fingerprint: SHA256:GBzT2DXvAuGV9XIV5W3WrzVpjU54FThmxHXdbz95J24
3 changed files with 49 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

42
apps/showcase/src/App.tsx
View file

@ -2,8 +2,19 @@ import { useState } from "react";
import { Blocks, Home, Palette, Settings } from "lucide-react";
import {
Button,
Card,
CardContent,
ContextMenu,
ContextMenuContent,
ContextMenuItem,
ContextMenuTrigger,
LoadingScreen,
OnboardingFlow,
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
Sidebar,
SidebarContent,
SidebarGroup,
@ -143,6 +154,37 @@ export default function App() {
<SidebarMenuItem>
<CategorySwitch />
</SidebarMenuItem>
<SidebarMenuItem>
<Select>
<SelectTrigger className="w-full">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value={1}>Item 1</SelectItem>
<SelectItem value={2}>Item 2</SelectItem>
<SelectItem value={3}>Item 3</SelectItem>
<SelectItem value={4}>Item 4</SelectItem>
<SelectItem value={5}>Item 5</SelectItem>
</SelectContent>
</Select>
</SidebarMenuItem>
<SidebarMenuItem>
<ContextMenu>
<ContextMenuTrigger>Right Click Me</ContextMenuTrigger>
<ContextMenuContent>
<ContextMenuItem>item 1</ContextMenuItem>
<ContextMenuItem variant="destructive">
item 2
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>
</SidebarMenuItem>
<SidebarMenuItem className="relative">
<div className="h-25 bg-[#FF0000]"></div>
<Card className="absolute h-30 top-10 left-0 w-full">
<CardContent>Cool card</CardContent>
</Card>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>

2
package.json
View file

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

9
src/theme/presets.ts
View file

@ -126,7 +126,7 @@ export const BUILT_IN_THEMES = defineThemes([
background-color: color-mix(in oklch, var(--secondary) 86%, var(--secondary-foreground));
}
:root[data-theme="tensamin"] [data-slot="button"][data-variant="subtleDefault"],
:root[data-theme="tensamin"] [data-slot]:not([data-slot="select-item"])[data-variant="destructive"] {
:root[data-theme="tensamin"] [data-slot]:not([data-slot="select-item"]):not([data-slot="context-menu-item"])[data-variant="destructive"] {
background-clip: border-box;
border-color: transparent;
box-shadow: var(--tensamin-outline-shadow);
@ -135,7 +135,7 @@ export const BUILT_IN_THEMES = defineThemes([
background-color: color-mix(in oklch, var(--primary) 10%, transparent);
box-shadow: var(--tensamin-subtle-shadow);
}
:root[data-theme="tensamin"] [data-slot]:not([data-slot="select-item"])[data-variant="destructive"] {
:root[data-theme="tensamin"] [data-slot]:not([data-slot="select-item"]):not([data-slot="context-menu-item"])[data-variant="destructive"] {
background-color: color-mix(in oklch, var(--background) 86%, var(--destructive));
box-shadow: var(--tensamin-destructive-shadow);
color: var(--destructive);
@ -168,6 +168,9 @@ export const BUILT_IN_THEMES = defineThemes([
border-color: transparent;
box-shadow: var(--tensamin-outline-shadow);
}
:root[data-theme="tensamin"] [data-slot="card"] {
background-color: var(--card);
}
:root[data-theme="tensamin"] [data-slot="button"][data-variant="outline"] {
background-clip: border-box;
}
@ -600,7 +603,7 @@ export const BUILT_IN_THEMES = defineThemes([
:root.dark[data-theme="secret"] [data-slot="select-content"] {
border-color: var(--secret-border);
}
:root[data-theme="secret"] [data-slot="select-item"]:is(:hover, :focus, [data-highlighted], [data-selected]) {
:root[data-theme="secret"] :where([data-slot="select-item"], [data-slot="context-menu-item"]):is(:hover, :focus, [data-highlighted], [data-selected]) {
background-color: color-mix(in srgb, var(--popover) 72%, #0a0a0a 28%);
color: #ffe8b4;
}