LVL-05
Untriaged Offset level index
Alternate to LVL-01. All four levels as a contents-page index on a twelve-column grid, with deliberate empty space in the left margin.
Use it when
Alternate to LVL-01. All four levels as a contents-page index on a twelve-column grid, with deliberate empty space in the left margin.
- Category
- Service levels and scope
- Layout archetype
- Offset grid
- Page position
- middle (derived)
- Purpose
- compare (derived)
- Field
- light (derived)
- Interaction
- static (derived)
- Motifs
- Sequence mark
Content it requires
- serviceLevels from src/data/homeManagement.ts
Do not use it when
- Shows all four levels including the Home Plan, so it implies they are alternatives. Use LVL-01 where the foundation relationship matters more.
- Rows shift right on hover. The movement is suppressed under reduced motion.
Variants
None. Colour swaps and mirrored alignment do not count as variants.
Implementation
src/components/patterns/LevelOffsetIndex.astro
---
import LevelOffsetIndex from '../components/patterns/LevelOffsetIndex.astro';
---
<LevelOffsetIndex /> Import directly. Do not route production through patternComponents.
Production usage
Not yet used on a production page. Nothing here has been proven in front of a customer.
Accessibility
- Verified at 360, 768, 1024, and 1440 with no horizontal overflow.
- No interactive controls beyond links and buttons inherited from the design system.
- Colour never carries meaning alone: every state marker is paired with text.
- Motion respects prefers-reduced-motion.