# aside — Examples

## Basic usage

```html
<admin-shell>
  <aside-ui slot="leading" collapsible width="panel">
    <list-ui>
      <list-item-ui icon="house" text="Dashboard"></list-item-ui>
      <list-item-ui icon="cube" text="Projects"></list-item-ui>
      <list-item-ui icon="gear" text="Settings"></list-item-ui>
    </list-ui>
  </aside-ui>
  <section-ui>
    <!-- main content -->
  </section-ui>
</admin-shell>
```

## Slot positions inside <admin-shell>

```html
<admin-shell>
  <aside-ui slot="leading" collapsible width="rail">…</aside-ui>
  <section-ui>…main content…</section-ui>
  <aside-ui slot="trailing" width="panel">…</aside-ui>
</admin-shell>
```

## Composing with <pane-ui>

```html
<aside-ui slot="leading" collapsible width="panel">
  <pane-ui resizable>
    <list-ui>…</list-ui>
  </pane-ui>
</aside-ui>
```
