Pagehead

Pagehead denotes the title and start of a given section.

v0.23.0BetaNot reviewed for accessibility

Description

Use Subhead as the start of a section. The :heading slot will render an <h2> font-sized text.

  • Optionally set the :description slot to render a short description and the :actions slot for a related action.
  • Use a succinct, one-line description for the :description slot. For longer descriptions, omit the description slot and render a paragraph below the Subhead.
  • Use the actions slot to render a related action to the right of the heading. Use Button or Link.

Accessibility

The :heading slot defaults to rendering a <div>. Update the tag to a heading element with the appropriate level to improve page navigation for assistive technologies. Learn more about best heading practices (WAI Headings)

Arguments

NameDefaultDescription
spacious

false

Boolean

Whether to add spacing to the Subhead.

hide_border

false

Boolean

Whether to hide the border under the heading.

system_arguments

N/A

Hash

Examples

Slots

heading

The heading

NameDefaultDescription
tag

N/A

Symbol

One of :div, :h1, :h2, :h3, :h4, :h5, or :h6.

danger

N/A

Boolean

Whether to style the heading as dangerous.

system_arguments

N/A

Hash

actions

Actions

NameDefaultDescription
system_arguments

N/A

Hash

description

The description

NameDefaultDescription
system_arguments

N/A

Hash