build-page-layout
Installation
SKILL.md
Build Page Layout: $ARGUMENTS
If $ARGUMENTS is empty, ask the user: (1) what this page displays, (2) whether it needs tabs, a collapsible subheader, or a floating footer.
Phase 1: Determine Scope
Parse from $ARGUMENTS or ask:
- Project type:
nx(existing NX monorepo library/app) |standalone(fresh Angular CLI app — needs full setup) - Page name (PascalCase, e.g.,
ProductDetail,OrderList) - Base component:
fd-dynamic-page(core, sufficient for most cases) |fdp-dynamic-page(platform — needed only if usingfdp-icon-tab-baror thetabChangeoutput event) - Sections needed (check all that apply):
header— title, subtitle, breadcrumb, global/layout actions (default: yes)subheader— collapsible section below the header with metadata or filterstabs— multiple content sections, each on its own tabfooter— floating action bar (Save / Cancel buttons)fcl— page is a column insidefd-flexible-column-layout
- Header actions: global actions (left-aligned toolbar) and/or layout actions (right-aligned)