knacky/mimic
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(components): squared shapes + mono data cells across all components

Browse Source
This commit is contained in:
Knacky
2026-06-09 18:42:26 +02:00
parent c791e50108
commit ec7800ae38
15 changed files with 42 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/src/components/Toast.tsx
View File

@@ -1,9 +1,5 @@
import { useToast } from '@/hooks/useToast';
/**
* Stack of toast notifications anchored bottom-right.
* Pure DESIGN.md surfaces: rounded-xl, soft-lift, ink slab for errors.
*/
export function ToastViewport(): JSX.Element {
const { toasts, dismiss } = useToast();
return (
@@ -15,19 +11,18 @@ export function ToastViewport(): JSX.Element {
{toasts.map((t) => {
const isError = t.kind === 'error';
const isSuccess = t.kind === 'success';
// Fixed colors: toasts don't theme (error=dark slab, success=primary blue)
const surface = isError
? 'bg-slab text-slab-text'
? 'bg-paper text-ink border border-hairline border-l-4 border-l-bloom-deep'
: isSuccess
? 'bg-primary text-white'
: 'bg-canvas text-ink border border-hairline';
? 'bg-paper text-ink border border-hairline border-l-4 border-l-success'
: 'bg-paper text-ink border border-hairline border-l-4 border-l-primary';
return (
<div
key={t.id}
role="status"
data-testid="toast"
data-kind={t.kind}
className={`pointer-events-auto rounded-xl px-md py-sm shadow-soft-lift text-[14px] leading-[1.4] ${surface}`}
className={`pointer-events-auto rounded-none px-md py-sm text-[14px] leading-[1.4] ${surface}`}
>
<div className="flex items-start justify-between gap-sm">
<span className="flex-1">{t.message}</span>