ns-footer
Introduction#
Required links and information that need to be repeated on every page.
NOTE: This is the UI component for producing a customised footer. If you are looking for the default British Gas footer which contains the links please use
nsx-footer.
The last component on the page, this holds links and copyright notices that are legally required. It also holds information about the company.
Best practice#
| 💚 Do's | 💔 Don'ts |
|---|---|
| Always have the footer at the bottom of the page. | Make your own footer if you are part of the customer facing website. |
Keep the footer outside the main element |
Considerations of best practice#
- If you are using the footer add a
idwith the valuefooterto work with skip links
Usage#
Component placement#
The ns-footer component can only be used as a child of the <main> element
Specification#
| Attribute | Type | Default | Options | Description |
|---|---|---|---|---|
company | string | British Gas | Change the company name in the copyright notice. | |
hideLogo | boolean | false | true false | Show or hide the British Gas logo. |
| Slots | Type |
|---|---|
section | ns-card |
Specification notes#
Section slot#
- Should use the
ns-cardwith typenav.
Feedback#
- Do you have insights or concerns to share? You can raise an issue via Github bugs.
- See all the issues already raised via Github issues
💩 🎉 🦄 If you have any questions, contact us on Microsoft Teams in the Nucleus Design System channels.