Proximus design system
Important information:
Using the Design System implies following some rules: the code should be valid and same as the Design System. Meaning custom HTML & CSS override are forbidden.
Please don't forget to read Usage part of each element.

Footer

See deprecated code
expiry date: TBD

Bottom part of all the webpages, it contain the site map, the breadcrumb, legal mentions,...

last modified: 30/09/2021 11:10:06

Overview

The footer is the bottom part of all the webpages. It contain the site map, the breadcrumb, legal mentions,...

It's an important section for two reasons:

  • It displays pertinent technical information for the computer user
  • It serves a great purpose in creating more of a coherent look to the website

The footer is available in 5 versions:

  1. Footer RES
    Used for the residential segment of proximus.be

  2. Footer SE
    Used for the business segment of proximus.be

  3. Footer EBU
    Used for the large companies segment of proximus.be

  4. Footer APP
    Used for the application pages

  5. Footer EPIC
    Used for the epic (young) segment of proximus.be
    To know more about EPIC, please check this page

Anatomy

  1. Contact

  2. Breadcrumb

  3. Sitemap

  4. External services
    External applications, newsletter, ...

  5. Logo

  6. Legal mentions

last modified: 30/09/2021 11:10:06
Info box

Please refer to the font sizes and colors default values.

Sizes

Attribute Mobile Tablet Desktop
1. AYS Padding 3rem 3rem 3rem
2. AYS title Font-size 1.7rem 1.8rem 1.8rem
3. Space Padding 2rem 3rem 4rem
4. Part top Padding-top 2rem 5rem 2rem
5. Part title Font-size 1.5rem 1.8rem 1.8rem
6. Legal spaces Padding 2rem 3rem 4rem

Colors

RES/SE/EBU/APP

Attribute Value
1. AYS Background Grey2
2. Breadcrumb/Sitemap Background Purple9
3. Legal/logo Background Purple

EPIC

Attribute Value
1. AYS Background Black9
2. Legal/logo Background Black 30% opacity
last modified: 29/07/2022 16:25:05

Code

Accessibility

For links with target="_blank" please follow this documentation

Razor

To choose the version of the footer, you to change the parameter Page.FooterVersion at the beginning of your document

Footer RES

Footer SE

Footer EBU

Footer Pickx

Footer APP

Footer EPIC

Footer Legal

Footer Breadcrumb only

Deprecated

EXPIRY DATE: TBD

The Footer 2017 is deprecated and should no longer be used.
This element will no longer be available from the expiry date meaning the related css will be removed and the element design will be broken if it's not adapted to the new html.

Class rs-footer--1708