Site footer
A rounded copyright bar with optional social links.
import 'material-next-web-components/site-footer.js';On this page
Overview
A shared copyright bar, taken from the Profile website. It follows the host's Material color tokens
and wraps on narrow screens. Its default text is Copyright © 2020–2026, Mihai-Cristian Condrea, with
the last year following the current year. Set owner, start-year and end-year to change it.
<script type="module">
import 'material-next-web-components/site-footer.js';
</script>
<mnw-site-footer start-year="2020">
<a href="https://github.com/MihaiCristianCondrea">GitHub</a>
</mnw-site-footer>Supply links or Material icon buttons through the default slot. Give icon-only controls an accessible
name. With an app shell, put the element in slot="footer"; the shell keeps it outside the main
content landmark and makes it inert while its modal drawer covers the page.
API
A rounded copyright bar with optional social links.
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
owner | owner | string | 'Mihai-Cristian Condrea' | Copyright holder. |
startYear | start-year | number | 2020 | First copyright year. |
endYear | end-year | Last copyright year. Defaults to the current year. | ||
linksLabel | links-label | string | 'Social profiles' | Accessible label for the links. |
| Slot | Description |
|---|---|
| Default | Links or Material icon buttons, each with an accessible name. |
| Custom property | Description |
|---|---|
--mnw-site-footer-max-width | Widest the bar gets, centered. Default 900px. |
--mnw-site-footer-container-color | The bar's color. Default --md-sys-color-surface-container. |
| Part | Description |
|---|---|
surface | The footer bar. |