# On the end > A table of contents in a sidebar on the end of the line, the right in a left-to-right page, with the trigger at the end of the page's header. Source: https://shadleaf.dev/current/layouts/sidebar-end/ A sidebar on the end of the line (`side="right"`): the right, or the left on a right-to-left page (`dir="rtl"`). Here it holds a table of contents under a group label, with the sections and their pages in sub-menus. The trigger is at the end of the page's header, in the [site header](https://shadleaf.dev/current/components/site-header.md)'s `end` slot, on the same side as the sidebar; its icon shows a panel on that side. On a phone the panel slides in from the end. **Example: On the end.** A table of contents on the end of the line: the right, or the left on a right-to-left page. The sidebar comes after the page in the markup, so the keyboard reaches the page first, and the trigger sits at the end of the page's header. For reference: the [shadcn/ui block](https://ui.shadcn.com/blocks/sidebar#sidebar-14) this layout is based on. ## The layout The whole layout file, with what [every layout needs](https://shadleaf.dev/current/components/application-shell.md#what-every-layout-needs). The sidebar comes after `` in the markup, as in the block, so the keyboard and a screen reader reach the page first and the table of contents after it. `side="right"` puts it on the end either way: written before the inset, it is still drawn there, and reached first. ```html Page

Table of Contents Getting Started Installation Project Structure Build Your Application Routing Data Fetching Rendering Caching Styling API Reference Components File Conventions Functions Architecture Accessibility Fast Refresh Community Contribution Guide ``` ## A page A page passes its title, its breadcrumb's levels and its content, as for the [Sub-menus](https://shadleaf.dev/current/layouts/sub-menus.md#a-page) layout: ```html Build Your Application Data Fetching
...
``` ## The CSS The weight of the sections' links, a border below the header and the page's padding: ```css /* The sections' links in a medium weight, their pages' in the normal one. */ .docs-nav > .sidebar-menu-item > .sidebar-menu-button { font-weight: 500; } /* A border below the page's header, and the page's padding. */ .sidebar-inset > .site-header { border-block-end: 1px solid var(--border); } .page { padding: 1rem; } .page > h1 { margin-block-end: 1rem; font-size: 1.5rem; font-weight: 600; } ```