<c-page>
Examples
<template>
<c-page class="demo-page">
<h2>Reports</h2>
<p>The default slot is wrapped in a centered max-width container.</p>
<div slot="footer">Footer content</div>
</c-page>
</template>
<style scoped>
/* Demo-only sizing: c-page normally fills the viewport below the toolbar. */
.demo-page {
height: 240px;
}
</style>
API reference
<c-page>
Properties
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
scrollIndicator | scroll-indicator | boolean | false | Display scroll indicator |
Slots
| Slot | Description |
|---|---|
default | Default slot |
footer | Footer slot |
CSS parts
Style from outside with c-page::part(name) — parts are the library's only styling customization API.
| Part | Description |
|---|---|
scroll-indicator | The fixed progress bar at the top of the viewport tracking scroll position |
container | The max-width content wrapper around the default slot |