mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-08-30 05:18:11 +00:00
fix(page-header): cap title/subtitle width
Title and subtitle grew unbounded, relying only on flex-squeeze from action buttons to ever truncate. Caps the container at 640px and gives the subtitle the same truncate treatment the title already had, so a long page title or description (report descriptions in particular) always ellipses instead of stretching the header.
This commit is contained in:
@@ -50,15 +50,15 @@ export function PageHeader({
|
|||||||
</ActionIcon>
|
</ActionIcon>
|
||||||
) : null}
|
) : null}
|
||||||
|
|
||||||
<div style={{ minWidth: 0 }}>
|
<div style={{ minWidth: 0, maxWidth: 640 }}>
|
||||||
<Group gap="sm" align="center" wrap="nowrap">
|
<Group gap="sm" align="center" wrap="nowrap">
|
||||||
<Title order={2} className="truncate">
|
<Title order={2} className="truncate" style={{ minWidth: 0 }}>
|
||||||
{title}
|
{title}
|
||||||
</Title>
|
</Title>
|
||||||
{meta}
|
{meta}
|
||||||
</Group>
|
</Group>
|
||||||
{subtitle ? (
|
{subtitle ? (
|
||||||
<Text c="dimmed" size="sm" mt={4}>
|
<Text c="dimmed" size="sm" mt={4} className="truncate">
|
||||||
{subtitle}
|
{subtitle}
|
||||||
</Text>
|
</Text>
|
||||||
) : null}
|
) : null}
|
||||||
|
|||||||
Reference in New Issue
Block a user