← Back to documentation
Footer
A simple customizable footer that can be used at the bottom of the page.
Information
Plan: Personal
Properties
| Property | Type | Default |
|---|---|---|
| Title | string | "Lorem ipsum" |
| Description | string | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sagittis nisl a velit ultricies luctus." |
| Title & Links | {
"items": {
"props": {
"items": {
"items": {
"props": {
"href": {
"type": "string"
},
"label": {
"type": "string"
}
},
"type": "object"
},
"type": "array"
},
"label": {
"type": "string"
}
},
"type": "object"
},
"type": "array"
} | [
{
"items": [
{
"href": "/",
"items": [],
"label": "Maecenas sagittis"
},
{
"href": "/",
"items": [],
"label": "Morbi ac orci"
},
{
"href": "/",
"items": [],
"label": "Cras ac dolor"
}
],
"label": "Lorem ipsum"
},
{
"items": [
{
"href": "/",
"items": [],
"label": "Aenean consectetur"
},
{
"href": "/",
"items": [],
"label": "Vestibulum aliquet"
},
{
"href": "/",
"items": [],
"label": "Donec eget"
}
],
"label": "Suspendisse id"
},
{
"items": [
{
"href": "/",
"items": [],
"label": "Cras tortor enim"
},
{
"href": "/",
"items": [],
"label": "Fusce aliquam"
},
{
"href": "/",
"items": [],
"label": "Integer interdum"
}
],
"label": "Vestibulum mattis"
}
] |
| Text - Bottom - Left | string | "Lorem ipsum dolor sit amet" |
| Text - Bottom - Right | string | "Maecenas sagittis nisl a velit" |
| Background color | string | "var(--pc-semantic-surface-base-secondary)" |
| Color | string | "var(--pc-semantic-text-tertiary)" |
| Color - Hover | string | "var(--pc-semantic-interactive-link-hover)" |
| Color - Title | string | "var(--pc-semantic-text-muted)" |
| Color - Brand text | string | "var(--pc-semantic-text-muted)" |
| Color - Bottom | string | "var(--pc-semantic-text-muted)" |
| Border color - Bottom | string | "var(--pc-semantic-border-tertiary)" |
| Selectors | array | [] |