[1.0.2] Add mourning theme/mode

Created on 25 March 2024, 9 months ago
Updated 9 September 2024, 3 months ago

Problem/Motivation

Header component has a "morning" version which turn it :

Lors des périodes de deuil national, il est possible d’utiliser la version en berne du header, en ajoutant à la balise l’attribut data-fr-mourning. La Marianne s’affichera alors dans sa version en berne.

https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/en...

It is not a prop of header component because:

  • the attribute is expected outside the component markup
  • the attribute also alter footer component

It is a theme/mode, like light & dark, and mist be implemented with UI Skins

Proposed resolution

It will be a bit more complicated than expected, because data-fr-mourning is not replacing data-fr-scheme but used along it.

So, there are not 1 but 2 themes: "Mourning light" and "Mourning dark". Maybe 3 with "Mourning system"
Each one of those themes must be activated with the corresponding theme, so has a dependency on it:

mourning_system:
  label: "Mourning system"
  key: data-fr-mourning
  target: html
  value: ''
  dependencies:
   - system

mourning_light:
  label: "Mourning light"
  key: data-fr-mourning
  target: html
  value: ''
  dependencies:
   - light

mourning_dark:
  label: "Mourning dark"
  key: data-fr-mourning
  target: html
  value: ''
  dependencies:
   - dark

However, this dependency system is not implemented yet in UI Skins, so this issue is postponed.

Feature request
Status

Fixed

Version

1.0

Component

Code

Created by

🇫🇷France pdureau Paris

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Production build 0.71.5 2024