atom
gy-page-hero
Layout primitive wrapping the top band of a page with a reduced-motion-aware fade-up animation. Slot for heading + lede.
Live
What you ship.
Welcome
Lede paragraph.
Markup
<gy-page-hero test-id="hero"><h1>Welcome</h1><p>Lede paragraph.</p></gy-page-hero>Prop space
Tier
Tag
| Prop | Type | Default | Description |
|---|---|---|---|
labelledBy | string | no default | Optional id of an element that labels this section. |
testId | string | no default | Optional data-testid so route-level tests can pin the hero. |
Slots: children.
Where this lives
import '@gyrum-labs/components/page-hero/page-hero.js';