cesnimda/jobtrackingapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): redesign grouped application shell

Browse Source
This commit is contained in:
cesnimda
2026-09-28 17:26:02 +02:00
parent 57a6bd02c6
commit 8e56ceabf5
30 changed files with 398 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files
job-tracker-ui/src/layout/PageLayout.tsx
+4 -3
View File
@@ -10,13 +10,14 @@ type HeaderProps = {
actions?: React.ReactNode;
level?: "h1" | "h2" | "h3";
titleId?: string;
titleRef?: React.Ref<HTMLHeadingElement>;
};
export function PageHeader({ title, description, actions, level = "h1", titleId }: HeaderProps) {
export function PageHeader({ title, description, actions, level = "h1", titleId, titleRef }: HeaderProps) {
return (
<Box component="header" sx={{ display: "flex", flexWrap: "wrap", alignItems: "flex-start", gap: 2, minWidth: 0 }}>
<Box sx={{ flex: "1 1 16rem", minWidth: 0 }}>
<Typography id={titleId} component={level} variant={level === "h1" ? "pageTitle" : "sectionTitle"} sx={{ overflowWrap: "anywhere" }}>
<Typography ref={titleRef} tabIndex={titleRef ? -1 : undefined} id={titleId} component={level} variant={level === "h1" ? "pageTitle" : "sectionTitle"} sx={{ overflowWrap: "anywhere" }}>
{title}
</Typography>
{description ? <Typography variant="pageDescription" component="p" color="text.secondary" sx={{ mt: 1, maxWidth: "75ch", overflowWrap: "anywhere" }}>
@@ -31,7 +32,7 @@ export function PageHeader({ title, description, actions, level = "h1", titleId
}
// Presentation only: domain components keep their loading, draft and mutation owners.
export function PageSection({ title, description, actions, children, level = "h2", surface = false }: Omit<HeaderProps, "titleId" | "level"> & {
export function PageSection({ title, description, actions, children, level = "h2", surface = false }: Omit<HeaderProps, "titleId" | "level" | "titleRef"> & {
children?: React.ReactNode;
level?: "h2" | "h3";
surface?: boolean;