add plain header UI Shell example (#459)

* chore: update codeowners

* docs: clean-up README

* docs(ui-shell): add plain header example

* docs: revise down the number of components

Although technically this library exports 150+ components, fewer than 50 are documented.
This commit is contained in:
Eric Liu 2020-12-11 05:04:42 -08:00 committed by GitHub
commit 6ee0bab0d9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 59 additions and 12 deletions

View file

@ -0,0 +1,42 @@
<script>
import {
Header,
HeaderNav,
HeaderNavItem,
HeaderNavMenu,
SkipToContent,
Content,
Grid,
Row,
Column,
} from "carbon-components-svelte";
let isSideNavOpen = false;
</script>
<Header company="IBM" platformName="Carbon Svelte" bind:isSideNavOpen>
<div slot="skip-to-content">
<SkipToContent />
</div>
<HeaderNav>
<HeaderNavItem href="/" text="Link 1" />
<HeaderNavItem href="/" text="Link 2" />
<HeaderNavItem href="/" text="Link 3" />
<HeaderNavMenu text="Menu">
<HeaderNavItem href="/" text="Link 1" />
<HeaderNavItem href="/" text="Link 2" />
<HeaderNavItem href="/" text="Link 3" />
</HeaderNavMenu>
</HeaderNav>
</Header>
<Content>
<Grid>
<Row>
<Column>
<h1>Welcome</h1>
</Column>
</Row>
</Grid>
</Content>