mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-08-27 00:52:50 +00:00
58 lines
3.4 KiB
TypeScript
58 lines
3.4 KiB
TypeScript
/** Material-inspired surfaces using shadcn tokens — modest radius, outlined fields. */
|
|
|
|
export const ruleEngineSurface = {
|
|
pageCard:
|
|
"overflow-hidden rounded-lg border border-border bg-card shadow-sm",
|
|
pageCardToolbar: "border-b border-border bg-muted/30 px-3 py-2.5 sm:px-4 sm:py-3",
|
|
dialog: "max-h-[90vh] overflow-y-auto rounded-lg border-border sm:max-w-lg",
|
|
dialogSm: "rounded-lg border-border sm:max-w-md",
|
|
} as const;
|
|
|
|
export const ruleEngineField = {
|
|
label: "text-sm font-medium text-foreground",
|
|
requiredMark: "text-destructive",
|
|
input:
|
|
"h-10 w-full rounded-md border border-input bg-background px-3 text-sm shadow-xs transition-[color,box-shadow] placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/30",
|
|
textarea:
|
|
"min-h-[96px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm shadow-xs transition-[color,box-shadow] placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/30",
|
|
selectTrigger:
|
|
"h-10 w-full rounded-md border border-input bg-background px-3 text-sm shadow-xs transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/30 data-[placeholder]:text-muted-foreground",
|
|
selectContent: "rounded-md border-border shadow-md",
|
|
switchRow: "flex min-h-10 items-center justify-between gap-3 rounded-md border border-border bg-muted/20 px-3",
|
|
switchHint: "text-xs text-muted-foreground",
|
|
} as const;
|
|
|
|
export const ruleEngineToolbar = {
|
|
search:
|
|
"h-9 rounded-md border border-input bg-background pl-9 text-sm shadow-xs placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/30 sm:h-10 sm:pl-10",
|
|
viewToggleGroup:
|
|
"flex h-9 items-center rounded-md border border-border bg-muted/40 p-0.5 sm:h-10",
|
|
viewToggleBtn:
|
|
"inline-flex h-7 items-center gap-1 rounded-sm px-2 text-xs font-medium transition-colors sm:h-8 sm:gap-1.5 sm:px-3 sm:text-sm",
|
|
viewToggleActive: "bg-background text-foreground shadow-sm",
|
|
viewToggleIdle: "text-muted-foreground hover:bg-background/60 hover:text-foreground",
|
|
actionBtn: "h-9 rounded-md shadow-xs sm:h-10",
|
|
primaryBtn: "h-9 gap-1.5 rounded-md px-3 text-xs font-medium shadow-xs sm:h-10 sm:gap-2 sm:px-4 sm:text-sm",
|
|
} as const;
|
|
|
|
export const ruleEngineCard = {
|
|
article:
|
|
"group flex flex-col overflow-hidden rounded-lg border border-border bg-card shadow-sm transition-shadow duration-200 hover:shadow-md",
|
|
header: "border-b border-border bg-muted/25 px-3 py-2.5 sm:px-4 sm:py-3.5",
|
|
avatar:
|
|
"flex h-9 w-9 shrink-0 items-center justify-center rounded-md bg-muted text-xs font-semibold text-muted-foreground sm:h-10 sm:w-10 sm:text-sm",
|
|
title: "truncate text-sm font-semibold text-foreground sm:text-[15px]",
|
|
meta: "text-xs text-muted-foreground",
|
|
detailLabel:
|
|
"text-[10px] font-medium uppercase tracking-wide text-muted-foreground sm:text-[11px]",
|
|
detailValue: "mt-0.5 text-xs text-foreground sm:text-sm",
|
|
footer: "mt-auto border-t border-border bg-muted/20 px-2 py-2 sm:px-3 sm:py-2.5",
|
|
skeleton: "animate-pulse rounded-lg border border-border bg-muted/30 p-3 sm:p-4",
|
|
} as const;
|
|
|
|
export const ruleEngineTable = {
|
|
headerCell:
|
|
"h-11 bg-muted/50 text-xs font-semibold uppercase tracking-wide text-muted-foreground",
|
|
bodyCell: "py-3.5 text-sm text-foreground",
|
|
} as const;
|