Overview

Required links and information that need to be repeated on every page.

Summarise it!

✨ This is an auto-generated AI summary of the ns-footer's documentation. It may not be accurate. ✨

Note

This is the UI component for producing a customised footer. If you’re looking for the default British Gas footer containing the links, please use the <nsx-footer> component.

The footer is the last component on the page and holds links and copyright notices that are legally required. It also contains information about the company.

Examples

Configure

Guidance

Do

• Always situate the footer at the bottom of a page.
• Include <ns-footer> after the closing </main> element.

Don't

• Make a unique, custom footer if it is to be part of the customer-facing website.

Implementation

Placement

The ns-footer component can only be used as a child of the <main> element.

Specification

Attributes

company

Property

company

Description

The name of the company related to the website.

Type

string

Default

British Gas

hide-logo

Property

hideLogo

Description

The toggle to hide the logo in the footer.

Type

boolean

Default

false

type

Property

type

Type

string

Default

standard

Slots

Slot	Permitted tags	Description
section	<ns-card>	The list of links and needs to be grouped into sections with related headings.

Specification notes

Section slot

Use multiple <ns-card> of type nav to group the related footer links.

Figma

Please note: The ns-footer Figma component configuration instructions are available only to members of the British Gas workspace who have access to the Nucleus Figma UI Kit.

Configuration instructions

(Opens in Figma).