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.

docs/src/pages/components/UIShell.svx

@@ -26,8 +26,14 @@ components: ["Header",
   import Preview from "../../components/Preview.svelte";
 </script>
 
+### Header
+
+<FileSource src="/framed/UIShell/Header" />
+
 ### Header with side navigation
 
+The hamburger menu will automatically be rendered if the `SideNav` component is used.
+
 <FileSource src="/framed/UIShell/HeaderNav" />
 
 ### Header with app switcher

docs/src/pages/framed/UIShell/Header.svelte

@@ -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>

docs/src/pages/index.svelte

@@ -85,7 +85,7 @@
           borderRight
           borderBottom
           title="Carbon Components Svelte"
-          subtitle="100+ components"
+          subtitle="50+ components"
           target="_blank"
           href="https://github.com/IBM/carbon-components-svelte"
         />