mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-08-30 12:18:11 +00:00
33 lines
832 B
TypeScript
33 lines
832 B
TypeScript
import { Paper, Text } from "@mantine/core";
|
|
|
|
export interface MetricTileProps {
|
|
label: string;
|
|
value: string;
|
|
highlight?: boolean;
|
|
}
|
|
|
|
/** Small flat label/value tile used across the detail sections. */
|
|
export function MetricTile({ label, value, highlight }: MetricTileProps) {
|
|
return (
|
|
<Paper
|
|
radius="md"
|
|
withBorder
|
|
px="md"
|
|
py="sm"
|
|
style={{
|
|
background: highlight ? "var(--mantine-color-yellow-0)" : "var(--mantine-color-gray-0)",
|
|
borderColor: highlight
|
|
? "var(--mantine-color-yellow-3)"
|
|
: "var(--mantine-color-gray-2)",
|
|
}}
|
|
>
|
|
<Text size="xs" c="dimmed" fw={500} tt="uppercase" lts="0.04em">
|
|
{label}
|
|
</Text>
|
|
<Text size="sm" fw={600} mt={4} style={{ lineHeight: 1.4 }}>
|
|
{value}
|
|
</Text>
|
|
</Paper>
|
|
);
|
|
}
|