H

These components are used to frame out the page content for accessible heading hierarchy. Instead of defining fixed heading levels (h2, h3, …) you can use <H /> to create "section headings", which look to the parent <Section />s for the appropriate heading level.

Usage

<div>
	<H>Header using a contextual level (h3)</H>
	<Section component="article">
		<p>This is an article component wrapper.</p>
		<H>Another header with contextual level (h4)</H>
		<Section component={ false }>
			<p>There is no wrapper component here.</p>
			<H>This is an h5</H>
		</Section>
	</Section>
</div>

Section

The section wrapper, used to indicate a sub-section (and change the header level context).

Usage

See above

Props