Flatten dashboard sections and emphasize data regions
This commit is contained in:
@@ -6,13 +6,16 @@ type PanelProps = {
|
||||
actions?: React.ReactNode;
|
||||
children: React.ReactNode;
|
||||
className?: string;
|
||||
variant?: 'flat' | 'surface';
|
||||
};
|
||||
|
||||
export function Panel({ title, subtitle, actions, children, className }: PanelProps) {
|
||||
export function Panel({ title, subtitle, actions, children, className, variant = 'flat' }: PanelProps) {
|
||||
return (
|
||||
<section
|
||||
className={cn(
|
||||
'min-w-0 rounded-2xl border border-[color:var(--line-weak)] bg-[color:var(--panel)] p-4 shadow-[0_0_0_1px_rgba(0,255,180,0.03),0_12px_30px_rgba(1,4,10,0.45)] sm:p-5',
|
||||
variant === 'surface'
|
||||
? 'min-w-0 rounded-[1.25rem] border border-[color:var(--line-weak)] bg-[color:var(--panel)] p-4 sm:p-5'
|
||||
: 'min-w-0 border-t border-[color:var(--line-weak)] pt-4',
|
||||
className
|
||||
)}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user