till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-23 17:26:43 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

refactor(theme): migrate shared packages to --color-* token naming

Browse source 
Several shared-ui / shared-auth-ui / subscriptions / credits
components used shadcn-style bare CSS variables (--muted, --primary,
--foreground, etc.), but the Mana theme system standardized on
--color-*. The mismatch meant bg-[hsl(var(--muted))] classes
resolved to an invalid color and rendered transparent — most
visible on the Allgemein settings tab where language and week-start
buttons had no background.

Mechanical prefix across ~30 files. Two semantic renames:
- --destructive → --color-error (Mana uses "error" as the token name)
- --popover     → --color-card  (no popover token; card is the closest)

With shared packages on the correct naming, drop the shadcn-compat
alias shim from app.css.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-04-15 22:11:42 +02:00
parent 7c89eb625e
commit 6da317d071
27 changed files with 245 additions and 260 deletions
Download patch file Download diff file Expand all files Collapse all files

20
packages/shared-ui/src/molecules/loaders/AppLoadingSkeleton.svelte
View file

@ -209,7 +209,7 @@
<style>
.app-loading-skeleton {
min-height: 100vh;
background: hsl(var(--background));
background: hsl(var(--color-background));
}
.app-loading-skeleton.sidebar-layout {
@ -223,7 +223,7 @@
align-items: center;
justify-content: space-between;
padding: 1rem 2rem;
border-bottom: 1px solid hsl(var(--border));
border-bottom: 1px solid hsl(var(--color-border));
}
.header-nav {
@ -273,7 +273,7 @@
.centered-card {
width: 100%;
max-width: 400px;
background: hsl(var(--card));
background: hsl(var(--color-card));
border-radius: 16px;
padding: 1.5rem;
}
@ -305,14 +305,14 @@
.sidebar-skeleton {
width: 16rem;
border-right: 1px solid hsl(var(--border));
background: hsl(var(--card));
border-right: 1px solid hsl(var(--color-border));
background: hsl(var(--color-card));
padding: 1rem;
}
.sidebar-header {
padding-bottom: 1rem;
border-bottom: 1px solid hsl(var(--border));
border-bottom: 1px solid hsl(var(--color-border));
margin-bottom: 1rem;
}
@ -389,8 +389,8 @@
align-items: center;
gap: 0.75rem;
padding: 0.875rem 1rem;
background: hsl(var(--card));
border: 1px solid hsl(var(--border));
background: hsl(var(--color-card));
border: 1px solid hsl(var(--color-border));
border-radius: 12px;
}
@ -425,8 +425,8 @@
align-items: center;
gap: 1rem;
padding: 1rem;
background: hsl(var(--card));
border: 1px solid hsl(var(--border));
background: hsl(var(--color-card));
border: 1px solid hsl(var(--color-border));
border-radius: 12px;
}