Page layout
DSPageLayout is the standard wrapper for an authenticated in-app page — /dashboard, /career-data, /applications, /settings. It owns the page masthead (Lora display title, optional DM Sans subtitle, top-right actions slot) and a body slot. Distinct from DSCollectionLayout — that primitive is the more specialised list-of-items shell with count, filters, and view tabs. DSPageLayout is the general case.
Default — title + subtitle + actions
The everyday in-app page header. Lora display title with a one-sentence subtitle below; primary + secondary actions sit to the right on md+ and stack below the title on mobile.
Career data
The single source of truth that every resume draws from. Edit once, reuse everywhere.
No work entries yet
Title only — no subtitle, no actions
The minimal case. Some pages don't need supporting copy or page-level actions; the masthead drops to a single Lora display heading and the body picks up immediately.
Dashboard
Welcome back
Narrow width — 56rem
Pass `width="narrow"` for dense settings or single-form pages where a 72rem column reads as too wide. Mirrors DSSection's vocabulary.
Settings
Manage your account, data, and preferences.
Settings panels
Reading width — 44rem
Pass `width="reading"` for long-form, single-column copy where the text needs a measure. Use sparingly — most in-app pages want `wide` (72rem default).
What's new
Recent changes to Resume Notebook, in chronological order.
No releases yet
Composed with DSSectionLabel — sub-sections in a page
The canonical pattern: a page wraps everything, and DSSectionLabel introduces each sub-section inside the body slot. The page title is h1; each DSSectionLabel is h2.
Resumes
Tailored versions for the roles you're chasing.
Your resumes
3 drafts, 2 published. Last updated 4 hours ago.
No resumes yet
Optimize your score
Improve ATS compatibility with targeted fixes.