bytelyst/learning_ai_common_plat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): use tokenized status colors

Browse Source
This commit is contained in:
Saravana Achu Mac 2026-05-06 11:15:29 -07:00
parent 23e140009f
commit 9d5a31d559
3 changed files with 18 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
packages/ui/src/components/Badge.tsx
View File

@ -8,20 +8,23 @@ export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
}
const variantStyles: Record<string, string> = {
success: 'bg-green-500/10 text-green-400 border-green-500/20',
warning: 'bg-yellow-500/10 text-yellow-400 border-yellow-500/20',
error: 'bg-red-500/10 text-red-400 border-red-500/20',
info: 'bg-blue-500/10 text-blue-400 border-blue-500/20',
success:
'bg-[var(--bl-success-muted,var(--bl-surface-muted))] text-[var(--bl-success)] border-[var(--bl-success-border,var(--bl-success))]',
warning:
'bg-[var(--bl-warning-muted,var(--bl-surface-muted))] text-[var(--bl-warning)] border-[var(--bl-warning-border,var(--bl-warning))]',
error:
'bg-[var(--bl-danger-muted,var(--bl-surface-muted))] text-[var(--bl-danger)] border-[var(--bl-danger-border,var(--bl-danger))]',
info: 'bg-[var(--bl-info-muted,var(--bl-surface-muted))] text-[var(--bl-info,var(--bl-accent))] border-[var(--bl-info-border,var(--bl-info,var(--bl-accent)))]',
neutral:
'bg-[var(--bl-surface-muted,#252540)] text-[var(--bl-text-secondary,#a0a0b0)] border-[var(--bl-border,#2a2a4a)]',
};
const dotColors: Record<string, string> = {
success: 'bg-green-400',
error: 'bg-red-400',
warning: 'bg-yellow-400',
info: 'bg-blue-400',
neutral: 'bg-gray-400',
success: 'bg-[var(--bl-success)]',
error: 'bg-[var(--bl-danger)]',
warning: 'bg-[var(--bl-warning)]',
info: 'bg-[var(--bl-info,var(--bl-accent))]',
neutral: 'bg-[var(--bl-text-tertiary,var(--bl-text-secondary))]',
};
export function Badge({

4
packages/ui/src/components/ConfirmDialog.tsx
View File

@ -46,8 +46,8 @@ export function ConfirmDialog({
className={clsx(
'mt-0.5 rounded-full p-2',
variant === 'destructive'
? 'bg-red-500/10 text-red-400'
: 'bg-yellow-500/10 text-yellow-400'
? 'bg-[var(--bl-danger-muted,var(--bl-surface-muted))] text-[var(--bl-danger)]'
: 'bg-[var(--bl-warning-muted,var(--bl-surface-muted))] text-[var(--bl-warning)]'
)}
>
<AlertTriangle className="h-5 w-5" />

8
packages/ui/src/components/Toast.tsx
View File

@ -37,10 +37,10 @@ export function useToast() {
}
const icons: Record<string, React.ReactNode> = {
success: <CheckCircle className="h-5 w-5 text-green-400" />,
error: <AlertCircle className="h-5 w-5 text-red-400" />,
warning: <AlertTriangle className="h-5 w-5 text-yellow-400" />,
info: <Info className="h-5 w-5 text-blue-400" />,
success: <CheckCircle className="h-5 w-5 text-[var(--bl-success)]" />,
error: <AlertCircle className="h-5 w-5 text-[var(--bl-danger)]" />,
warning: <AlertTriangle className="h-5 w-5 text-[var(--bl-warning)]" />,
info: <Info className="h-5 w-5 text-[var(--bl-info,var(--bl-accent))]" />,
};
export function Toast({ message, onDismiss }: { message: ToastMessage; onDismiss: () => void }) {