ContentSurround
Previous/next page navigation at the bottom of a content page.
Usage
vue-html
<SContentSurround
:prev="{ title: 'Installation', path: '/overview/getting-started/installation' }"
:next="{ title: 'Theming', path: '/overview/theming/overview' }"
/>
Pass only prev, only next, or neither - SContentSurround renders
nothing at all when both are omitted (the first and last page in a
collection have no counterpart on one side). This docs site sources both
from a content collection's own surrounding-page query (e.g.
queryCollectionItemSurroundings from @nuxt/content), not typed in by
hand - see this page's own "Previous"/"Next" links at the bottom for a live
example.
Custom :ui
To see exactly what you'd be overriding - the current default classes for
every slot - here's ContentSurround's own theme file:
Global and scoped theme recipes use ui.contentSurround.
Theme source "content-surround" not found
Props
| Prop | Type | Default |
|---|---|---|
prev | { title: string, path: string } | - |
next | { title: string, path: string } | - |
ui | Partial<Record<'root' | 'link' | 'label' | 'icon' | 'title', string | object>> | - |