'Footer' component

Component type	Molecule
Component possible inclusions	n/a
Design source (in Figma)	Footer component
Component status	https://rb-digital.atlassian.net/browse/DSD-145

Introduction

The global footer sits at the bottom of the page and delivers navigation paths to key content that isn’t delivered in the header. This is traditionally legal and policy content and social pathways.

Anatomy

Key Content

Item	Type	Notes
Legal Statement/s	Text	e.g. © 2022 Reckitt Benckiser - All Rights Reserved
(Additional) Legal Statements	Rich Text Area	Not currently in design, but Nurofen UK gives an example. Short term need to cover legal bases, but eventually should be evolved. Naming is TBC.
Link list	Sub-component?
Social links list	Sub-component?	Whilst social links could use “icon buttons” in a list, it might be worth elevating to a component in case it is needed to be repeated contextually within a page or elsewhere across the site

Editorial

Ensure legal content is approved by legal.
Keep navigation links clearly named and reflective of their destination.

Visual Style

The MVP deliverable for footer has a single visual style - effectively a simple footer.

The wide viewport view of Chameleon (base) footer.

The narrow viewport. Not the potential conflict on order of items which may require a design tweak or discussion.

Behavior

The MVP footer only includes basic behaviour - text and links.
Because links sit within the footer, they can take the “subtle” link style as they are recognised to be links.
Links will take standard link states (default, hover, focus, active). As menu items, visible visited states are unlikely.
External links will take the external icon style as is a general style across all links.

Analytics & Data

Standard ability to isolate elements within GTM to be able to track clicks, visibility and other common metrics.