@lab-anssi/ui-kit 1.40.0 → 1.41.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/assets/dsfr-variables.css +47 -12
  2. package/dist/assets/lab-anssi-theme.mac.css +69 -0
  3. package/dist/assets/lab-anssi-theme.msc.css +109 -0
  4. package/dist/assets/lab-anssi-theme.mss.css +108 -0
  5. package/dist/assets/lab-anssi-theme.nis2.css +69 -0
  6. package/dist/webcomponents/lab-anssi-ui-kit.iife.js +9 -9
  7. package/package.json +11 -9
package/dist/assets/dsfr-variables.css CHANGED
@@ -1,3 +1,34 @@
1
+ @charset "UTF-8";
2
+ /**
3
+ * Fixe le scroll en arrière plan
4
+ */
5
+ :root {
6
+ --scrollbar-width: 0;
7
+ }
8
+ :root body {
9
+ border-right: var(--scrollbar-width) solid transparent;
10
+ }
11
+ :root[data-fr-scrolling] body {
12
+ overflow: hidden;
13
+ bottom: 0;
14
+ left: 0;
15
+ position: fixed;
16
+ right: 0;
17
+ top: 0;
18
+ }
19
+
20
+ :root {
21
+ --ground: 0;
22
+ --shadow-color: rgba(0, 0, 18, 0.16);
23
+ --raised-shadow: 0 1px 3px var(--shadow-color);
24
+ --overlap-shadow: 0 2px 6px var(--shadow-color);
25
+ --lifted-shadow: 0 3px 9px var(--shadow-color);
26
+ }
27
+
28
+ :root[data-fr-theme=dark] {
29
+ --shadow-color: rgba(0, 0, 18, 0.32);
30
+ }
31
+
1
32
  :root {
2
33
  --background-default-grey: var(--grey-1000-50);
3
34
  --background-default-grey-hover: var(--grey-1000-50-hover);
@@ -944,18 +975,6 @@
944
975
  --beige-gris-galet-850-200: #e0cab0;
945
976
  }
946
977
 
947
- :root {
948
- --ground: 0;
949
- --shadow-color: rgba(0, 0, 18, 0.16);
950
- --raised-shadow: 0 1px 3px var(--shadow-color);
951
- --overlap-shadow: 0 2px 6px var(--shadow-color);
952
- --lifted-shadow: 0 3px 9px var(--shadow-color);
953
- }
954
-
955
- :root[data-fr-theme=dark] {
956
- --shadow-color: rgba(0, 0, 18, 0.32);
957
- }
958
-
959
978
  :root[data-fr-theme=dark] {
960
979
  --grey-1000-50: #161616;
961
980
  --grey-1000-50-hover: #343434;
@@ -1295,3 +1314,19 @@
1295
1314
  --brighten: 1;
1296
1315
  }
1297
1316
  }
1317
+ :root {
1318
+ --text-spacing: 0 0 1.5rem;
1319
+ --title-spacing: 0 0 1.5rem;
1320
+ --display-spacing: 0 0 2rem;
1321
+ }
1322
+
1323
+ :root {
1324
+ --underline-max-width: 100%;
1325
+ --underline-hover-width: 0;
1326
+ --underline-idle-width: var(--underline-max-width);
1327
+ --underline-x: calc(var(--underline-max-width) * 0);
1328
+ --underline-thickness: 0.0625em;
1329
+ --underline-img: linear-gradient(0deg, currentColor, currentColor);
1330
+ --external-link-content: '';
1331
+ --text-decoration: none;
1332
+ }
package/dist/assets/lab-anssi-theme.mac.css ADDED
@@ -0,0 +1,69 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --centre-aide-background-entete: #5d2a9d;
7
+ --centre-aide-background-bouton: var(--centre-aide-background-entete);
8
+ --centre-aide-background-hover-lien: #9c51d0;
9
+ --centre-aide-background-hover-declencheur: var(--centre-aide-background-hover-lien);
10
+ --centre-aide-font-color-bouton: #ffffff;
11
+ --centre-aide-font-color-lien-secondaire: var(--centre-aide-background-entete);
12
+ --centre-aide-border-lien-secondaire: var(--centre-aide-background-entete);
13
+ --brique-background-primaire: var(--centre-aide-background-entete);
14
+ --brique-background-secondaire: #f5f1f9;
15
+ --brique-hero-bouton-gauche-background: #ffffff;
16
+ --brique-hero-bouton-gauche-background-hover: #f6f6f6;
17
+ --brique-hero-bouton-gauche-background-active: #f6f6f6;
18
+ --brique-hero-bouton-gauche-texte: #5d2a9d;
19
+ --brique-hero-bouton-droite-background: rgba(0, 0, 0, 0);
20
+ --brique-hero-bouton-droite-background-hover: rgba(255, 255, 255, 0.08);
21
+ --brique-hero-bouton-droite-background-active: rgba(255, 255, 255, 0.16);
22
+ --brique-hero-bouton-droite-texte: #ffffff;
23
+ --brique-carrousel-bouton-action-texte-couleur: #5d2a9d;
24
+ --brique-marelle-titre-couleur: #5d2a9d;
25
+ --brique-marelle-etapes-numero-etape-couleur: #9c51d0;
26
+ --brique-marelle-etapes-lien-couleur: #5d2a9d;
27
+ --brique-marelle-bouton-background: #5d2a9d;
28
+ --brique-marelle-bouton-background-hover: #9c51d0;
29
+ --brique-marelle-bouton-background-active: #9c51d0;
30
+ --brique-marelle-bouton-texte: #ffffff;
31
+ --brique-temoignages-titre-couleur: #5d2a9d;
32
+ --brique-temoignages-icone-couleur: #9c51d0;
33
+ --brique-contenu-deux-colonnes-action-bouton-background: #ffffff;
34
+ --brique-contenu-deux-colonnes-action-bouton-background-hover: #f6f6f6;
35
+ --brique-contenu-deux-colonnes-action-bouton-background-active: #f6f6f6;
36
+ --brique-contenu-deux-colonnes-action-bouton-texte: #5d2a9d;
37
+ --brique-presentation-anssi-titre-couleur: #5d2a9d;
38
+ --brique-presentation-anssi-bouton-background: #ffffff;
39
+ --brique-presentation-anssi-bouton-background-hover: rgba(0, 0, 0, 0.04);
40
+ --brique-presentation-anssi-bouton-background-active: rgba(0, 0, 0, 0.08);
41
+ --brique-presentation-anssi-bouton-texte: #5d2a9d;
42
+ --titre-couleur-primaire: #5d2a9d;
43
+ --bandeau-titre-background: var(--centre-aide-background-entete);
44
+ --couleur-lien: #5d2a9d;
45
+ --couleur-focus: #5d2a9d;
46
+ --filtre-couleur-primaire: brightness(0) invert(13%) sepia(46%) saturate(5189%) hue-rotate(261deg) brightness(104%) contrast(89%);
47
+ --sommaire-actif-indicateur-couleur: #fed980;
48
+ --sommaire-actif-couleur: #5d2a9d;
49
+ --sommaire-mobile-fond: #f5f1f9;
50
+ --liste-articles-couleur-fleche: #ff0000;
51
+ --liste-articles-couleur-texte: #ff0000;
52
+ --bouton-secondaire-tertiaire-couleur-texte: #5d2a9d;
53
+ --bouton-secondaire-couleur-bordure: #0d0c21;
54
+ --bouton-primaire-couleur-texte: #ffffff;
55
+ --bouton-primaire-couleur-fond: #5d2a9d;
56
+ --bouton-primaire-couleur-fond-survol: #9c51d0;
57
+ --bouton-primaire-couleur-fond-clique: #9c51d0;
58
+ --bouton-arrondi: 8px;
59
+ --tag-couleur-fond: #eeeeee;
60
+ --tag-couleur-texte: #161616;
61
+ --tag-selectionnable-couleur-texte: #000091;
62
+ --tag-selectionnable-couleur-fond: #e3e3fd;
63
+ --tag-selectionnable-couleur-fond-survol: #c1c1fb;
64
+ --tag-selectionnable-couleur-fond-clique: #adadf9;
65
+ --tag-selectionne-couleur-texte: #f5f5fe;
66
+ --tag-selectionne-couleur-fond: #000091;
67
+ --tag-selectionne-couleur-fond-survol: #1212ff;
68
+ --tag-selectionne-couleur-fond-clique: #2323ff;
69
+ }
package/dist/assets/lab-anssi-theme.msc.css ADDED
@@ -0,0 +1,109 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --yellow-msc-50: #fff7e6;
7
+ --yellow-msc-75: #fff0cf;
8
+ --yellow-msc-100: #fee9b8;
9
+ --yellow-msc-150: #fee2a2;
10
+ --yellow-msc-200: #fed980;
11
+ --yellow-msc-250: #ecca79;
12
+ --yellow-msc-275: #ddbd70;
13
+ --midnight-blue-msc-950: #0d0c21;
14
+ --centre-aide-background-entete: #0d0c21 url("src/lib/assets/illustrations/tuile-msc.svg") repeat top left/500px;
15
+ --centre-aide-background-bouton: #fed980;
16
+ --centre-aide-background-hover-lien: #e4c274;
17
+ --centre-aide-background-hover-declencheur: #22213c url("src/lib/assets/illustrations/tuile-msc.svg") repeat top left/500px;
18
+ --centre-aide-font-color-bouton: #0d0c21;
19
+ --centre-aide-font-color-lien-secondaire: var(--centre-aide-font-color-bouton);
20
+ --centre-aide-border-lien-secondaire: #0d0c21;
21
+ --brique-background-primaire: var(--centre-aide-background-entete);
22
+ --brique-background-secondaire: rgba(0, 0, 0, 0);
23
+ --brique-hero-bouton-gauche-background: #fed980;
24
+ --brique-hero-bouton-gauche-background-hover: #ecca79;
25
+ --brique-hero-bouton-gauche-background-active: #ddbd70;
26
+ --brique-hero-bouton-gauche-texte: #0d0c21;
27
+ --brique-hero-bouton-droite-background: rgba(0, 0, 0, 0);
28
+ --brique-hero-bouton-droite-background-hover: rgba(255, 255, 255, 0.08);
29
+ --brique-hero-bouton-droite-background-active: rgba(255, 255, 255, 0.16);
30
+ --brique-hero-bouton-droite-texte: #ffffff;
31
+ --brique-carrousel-bouton-action-texte-couleur: #0d0c21;
32
+ --brique-marelle-titre-couleur: #0d0c21;
33
+ --brique-marelle-etapes-numero-etape-couleur: #0d0c21;
34
+ --brique-marelle-etapes-lien-couleur: #0d0c21;
35
+ --brique-marelle-bouton-background: #fed980;
36
+ --brique-marelle-bouton-background-hover: #ecca79;
37
+ --brique-marelle-bouton-background-active: #ddbd70;
38
+ --brique-marelle-bouton-texte: #0d0c21;
39
+ --brique-temoignages-titre-couleur: #0d0c21;
40
+ --brique-temoignages-icone-couleur: #fed980;
41
+ --brique-contenu-deux-colonnes-action-bouton-background: #fed980;
42
+ --brique-contenu-deux-colonnes-action-bouton-background-hover: #ecca79;
43
+ --brique-contenu-deux-colonnes-action-bouton-background-active: #ddbd70;
44
+ --brique-contenu-deux-colonnes-action-bouton-texte: #0d0c21;
45
+ --brique-presentation-anssi-titre-couleur: #0d0c21;
46
+ --brique-presentation-anssi-bouton-background: rgba(0, 0, 0, 0);
47
+ --brique-presentation-anssi-bouton-background-hover: rgba(0, 0, 0, 0.04);
48
+ --brique-presentation-anssi-bouton-background-active: rgba(0, 0, 0, 0.08);
49
+ --brique-presentation-anssi-bouton-texte: #0d0c21;
50
+ --titre-couleur-primaire: #0d0c21;
51
+ --bandeau-titre-background: var(--centre-aide-background-entete);
52
+ --couleur-lien: #0d0c21;
53
+ --couleur-focus: #fed980;
54
+ --filtre-couleur-primaire: brightness(0) invert(3%) sepia(26%) saturate(6797%) hue-rotate(236deg) brightness(105%) contrast(97%);
55
+ --sommaire-actif-indicateur-couleur: #fed980;
56
+ --sommaire-actif-couleur: #0d0c21;
57
+ --sommaire-mobile-fond: #fff7db;
58
+ --liste-articles-couleur-fleche: #ff0000;
59
+ --liste-articles-couleur-texte: #ff0000;
60
+ --bouton-secondaire-tertiaire-couleur-texte: #0d0c21;
61
+ --bouton-secondaire-couleur-bordure: #0d0c21;
62
+ --bouton-primaire-couleur-texte: #0d0c21;
63
+ --bouton-primaire-couleur-fond: #fed980;
64
+ --bouton-primaire-couleur-fond-survol: #ecca79;
65
+ --bouton-primaire-couleur-fond-clique: #ddbd70;
66
+ --bouton-arrondi: 8px;
67
+ --tag-couleur-fond: #fcf1cf;
68
+ --tag-couleur-texte: #0d0c21;
69
+ --tag-selectionnable-couleur-texte: #0d0c21;
70
+ --tag-selectionnable-couleur-fond: #fcf1cf;
71
+ --tag-selectionnable-couleur-fond-survol: #faecb7;
72
+ --tag-selectionnable-couleur-fond-clique: #f8e5a0;
73
+ --tag-selectionne-couleur-texte: #0d0c21;
74
+ --tag-selectionne-couleur-fond: #fed980;
75
+ --tag-selectionne-couleur-fond-survol: #ecca79;
76
+ --tag-selectionne-couleur-fond-clique: #ddbd70;
77
+ --lab-border-radius: var(--bouton-arrondi);
78
+ }
79
+
80
+ [data-themeable] {
81
+ --background-alt-blue-france: var(--yellow-msc-200);
82
+ --background-action-high-blue-france: var(--yellow-msc-200);
83
+ --background-action-high-blue-france-hover: var(--yellow-msc-250);
84
+ --background-action-high-blue-france-active: var(--yellow-msc-275);
85
+ --background-action-low-blue-france: var(--yellow-msc-50);
86
+ --background-action-low-blue-france-hover: var(--yellow-msc-75);
87
+ --background-action-low-blue-france-active: var(--yellow-msc-100);
88
+ --background-active-blue-france: var(--yellow-msc-200);
89
+ --background-open-blue-france: var(--yellow-msc-50);
90
+ --background-open-blue-france-hover: var(--yellow-msc-75);
91
+ --background-open-blue-france-active: var(--yellow-msc-100);
92
+ --background-flat-blue-france-lab: var(--midnight-blue-msc-950);
93
+ --background-contrast-blue-france: var(--yellow-msc-75);
94
+ --artwork-major-blue-france: var(--midnight-blue-msc-950);
95
+ --artwork-minor-blue-france: var(--yellow-msc-200);
96
+ --artwork-minor-red-marianne: var(--yellow-msc-200);
97
+ --artwork-decorative-blue-france: var(--yellow-msc-50);
98
+ --border-active-alt-blue-france-lab: var(--yellow-msc-200);
99
+ --border-default-blue-france: var(--yellow-msc-200);
100
+ --border-action-high-blue-france: var(--midnight-blue-msc-950);
101
+ --border-active-blue-france: var(--midnight-blue-msc-950);
102
+ --border-open-blue-france: var(--yellow-msc-50);
103
+ --border-plain-blue-france: var(--midnight-blue-msc-950);
104
+ --text-title-blue-france: var(--midnight-blue-msc-950);
105
+ --text-action-high-blue-france: var(--midnight-blue-msc-950);
106
+ --text-inverted-blue-france: var(--midnight-blue-msc-950);
107
+ --text-active-blue-france: var(--midnight-blue-msc-950);
108
+ --text-marianne: #000000;
109
+ }
package/dist/assets/lab-anssi-theme.mss.css ADDED
@@ -0,0 +1,108 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --blue-mss-50: #eaf5ff;
7
+ --blue-mss-75: #dbeeff;
8
+ --blue-mss-100: #cce6ff;
9
+ --blue-mss-150: #bcdfff;
10
+ --blue-mss-600: #0079d0;
11
+ --blue-mss-700: #0c5c98;
12
+ --blue-mss-900: #09416a;
13
+ --slate-mss-800: #2f3a43;
14
+ --centre-aide-background-entete: var(--blue-mss-600);
15
+ --centre-aide-background-bouton: var(--centre-aide-background-entete);
16
+ --centre-aide-background-hover-lien: #0c5c98;
17
+ --centre-aide-background-hover-declencheur: var(--centre-aide-background-hover-lien);
18
+ --centre-aide-font-color-bouton: #ffffff;
19
+ --centre-aide-font-color-lien-secondaire: var(--centre-aide-background-entete);
20
+ --centre-aide-border-lien-secondaire: var(--centre-aide-background-entete);
21
+ --brique-background-primaire: var(--centre-aide-background-entete);
22
+ --brique-background-secondaire: rgba(0, 0, 0, 0);
23
+ --brique-hero-bouton-gauche-background: #ffffff;
24
+ --brique-hero-bouton-gauche-background-hover: #f6f6f6;
25
+ --brique-hero-bouton-gauche-background-active: #f6f6f6;
26
+ --brique-hero-bouton-gauche-texte: var(--blue-mss-600);
27
+ --brique-hero-bouton-droite-background: rgba(0, 0, 0, 0);
28
+ --brique-hero-bouton-droite-background-hover: rgba(255, 255, 255, 0.08);
29
+ --brique-hero-bouton-droite-background-active: rgba(255, 255, 255, 0.16);
30
+ --brique-hero-bouton-droite-texte: #ffffff;
31
+ --brique-carrousel-bouton-action-texte-couleur: var(--blue-mss-600);
32
+ --brique-marelle-titre-couleur: #09416a;
33
+ --brique-marelle-etapes-numero-etape-couleur: var(--blue-mss-600);
34
+ --brique-marelle-etapes-lien-couleur: var(--blue-mss-600);
35
+ --brique-marelle-bouton-background: #0c5c98;
36
+ --brique-marelle-bouton-background-hover: var(--blue-mss-600);
37
+ --brique-marelle-bouton-background-active: var(--blue-mss-600);
38
+ --brique-marelle-bouton-texte: #ffffff;
39
+ --brique-temoignages-titre-couleur: #09416a;
40
+ --brique-temoignages-icone-couleur: var(--blue-mss-600);
41
+ --brique-contenu-deux-colonnes-action-bouton-background: #ffffff;
42
+ --brique-contenu-deux-colonnes-action-bouton-background-hover: #f6f6f6;
43
+ --brique-contenu-deux-colonnes-action-bouton-background-active: #f6f6f6;
44
+ --brique-contenu-deux-colonnes-action-bouton-texte: var(--blue-mss-600);
45
+ --brique-presentation-anssi-titre-couleur: #09416a;
46
+ --brique-presentation-anssi-bouton-background: rgba(0, 0, 0, 0);
47
+ --brique-presentation-anssi-bouton-background-hover: rgba(0, 0, 0, 0.04);
48
+ --brique-presentation-anssi-bouton-background-active: rgba(0, 0, 0, 0.08);
49
+ --brique-presentation-anssi-bouton-texte: var(--blue-mss-600);
50
+ --titre-couleur-primaire: #09416a;
51
+ --bandeau-titre-background: var(--centre-aide-background-entete);
52
+ --couleur-lien: #0079d0;
53
+ --couleur-focus: #0a76f6;
54
+ --filtre-couleur-primaire: brightness(0) invert(29%) sepia(95%) saturate(1420%) hue-rotate(184deg) brightness(98%) contrast(101%);
55
+ --sommaire-actif-indicateur-couleur: #0079d0;
56
+ --sommaire-actif-couleur: #0079d0;
57
+ --sommaire-mobile-fond: #f1f5f9;
58
+ --liste-articles-couleur-fleche: #0079d0;
59
+ --liste-articles-couleur-texte: #09416a;
60
+ --bouton-secondaire-tertiaire-couleur-texte: #0079d0;
61
+ --bouton-secondaire-couleur-bordure: #0079d0;
62
+ --bouton-primaire-couleur-texte: #ffffff;
63
+ --bouton-primaire-couleur-fond: #0079d0;
64
+ --bouton-primaire-couleur-fond-survol: #0c5c98;
65
+ --bouton-primaire-couleur-fond-clique: #09416a;
66
+ --bouton-arrondi: 4px;
67
+ --tag-couleur-fond: #eeeeee;
68
+ --tag-couleur-texte: #161616;
69
+ --tag-selectionnable-couleur-texte: #000091;
70
+ --tag-selectionnable-couleur-fond: #e3e3fd;
71
+ --tag-selectionnable-couleur-fond-survol: #c1c1fb;
72
+ --tag-selectionnable-couleur-fond-clique: #adadf9;
73
+ --tag-selectionne-couleur-texte: #f5f5fe;
74
+ --tag-selectionne-couleur-fond: #000091;
75
+ --tag-selectionne-couleur-fond-survol: #1212ff;
76
+ --tag-selectionne-couleur-fond-clique: #2323ff;
77
+ --lab-border-radius: var(--bouton-arrondi);
78
+ }
79
+
80
+ [data-themeable] {
81
+ --background-alt-blue-france: var(--blue-mss-50);
82
+ --background-action-high-blue-france: var(--blue-mss-600);
83
+ --background-action-high-blue-france-hover: var(--blue-mss-700);
84
+ --background-action-high-blue-france-active: var(--blue-mss-900);
85
+ --background-action-low-blue-france: var(--blue-mss-50);
86
+ --background-action-low-blue-france-hover: var(--blue-mss-75);
87
+ --background-action-low-blue-france-active: var(--blue-mss-100);
88
+ --background-active-blue-france: var(--blue-mss-600);
89
+ --background-open-blue-france: var(--blue-mss-50);
90
+ --background-open-blue-france-hover: var(--blue-mss-75);
91
+ --background-open-blue-france-active: var(--blue-mss-100);
92
+ --background-flat-blue-france-lab: var(--blue-mss-600);
93
+ --background-contrast-blue-france: var(--blue-mss-75);
94
+ --artwork-major-blue-france: var(--slate-mss-800);
95
+ --artwork-minor-blue-france: var(--blue-mss-600);
96
+ --artwork-minor-red-marianne: var(--blue-mss-600);
97
+ --artwork-decorative-blue-france: var(--blue-mss-50);
98
+ --border-active-alt-blue-france-lab: var(--blue-mss-600);
99
+ --border-default-blue-france: var(--blue-mss-600);
100
+ --border-action-high-blue-france: var(--blue-mss-600);
101
+ --border-active-blue-france: var(--blue-mss-600);
102
+ --border-open-blue-france: var(--blue-mss-50);
103
+ --border-plain-blue-france: var(--blue-mss-600);
104
+ --text-title-blue-france: var(--blue-mss-900);
105
+ --text-action-high-blue-france: var(--blue-mss-600);
106
+ --text-active-blue-france: var(--blue-mss-600);
107
+ --text-marianne: #000000;
108
+ }
package/dist/assets/lab-anssi-theme.nis2.css ADDED
@@ -0,0 +1,69 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --centre-aide-background-entete: #272771;
7
+ --centre-aide-background-bouton: var(--centre-aide-background-entete);
8
+ --centre-aide-background-hover-lien: #41419f;
9
+ --centre-aide-background-hover-declencheur: var(--centre-aide-background-hover-lien);
10
+ --centre-aide-font-color-bouton: #ffffff;
11
+ --centre-aide-font-color-lien-secondaire: var(--centre-aide-background-entete);
12
+ --centre-aide-border-lien-secondaire: var(--centre-aide-background-entete);
13
+ --brique-background-primaire: var(--centre-aide-background-entete);
14
+ --brique-background-secondaire: rgba(0, 0, 0, 0);
15
+ --brique-hero-bouton-gauche-background: #ffffff;
16
+ --brique-hero-bouton-gauche-background-hover: #ffffff;
17
+ --brique-hero-bouton-gauche-background-active: #ffffff;
18
+ --brique-hero-bouton-gauche-texte: #272771;
19
+ --brique-hero-bouton-droite-background: rgba(0, 0, 0, 0);
20
+ --brique-hero-bouton-droite-background-hover: rgba(255, 255, 255, 0.08);
21
+ --brique-hero-bouton-droite-background-active: rgba(255, 255, 255, 0.16);
22
+ --brique-hero-bouton-droite-texte: #ffffff;
23
+ --brique-carrousel-bouton-action-texte-couleur: #272771;
24
+ --brique-marelle-titre-couleur: #272771;
25
+ --brique-marelle-etapes-numero-etape-couleur: #272771;
26
+ --brique-marelle-etapes-lien-couleur: #272771;
27
+ --brique-marelle-bouton-background: #272771;
28
+ --brique-marelle-bouton-background-hover: #41419f;
29
+ --brique-marelle-bouton-background-active: #41419f;
30
+ --brique-marelle-bouton-texte: #ffffff;
31
+ --brique-temoignages-titre-couleur: #272771;
32
+ --brique-temoignages-icone-couleur: #41419f;
33
+ --brique-contenu-deux-colonnes-action-bouton-background: #ffffff;
34
+ --brique-contenu-deux-colonnes-action-bouton-background-hover: #ffffff;
35
+ --brique-contenu-deux-colonnes-action-bouton-background-active: #ffffff;
36
+ --brique-contenu-deux-colonnes-action-bouton-texte: #272771;
37
+ --brique-presentation-anssi-titre-couleur: #272771;
38
+ --brique-presentation-anssi-bouton-background: #ffffff;
39
+ --brique-presentation-anssi-bouton-background-hover: rgba(0, 0, 0, 0.04);
40
+ --brique-presentation-anssi-bouton-background-active: rgba(0, 0, 0, 0.08);
41
+ --brique-presentation-anssi-bouton-texte: #272771;
42
+ --titre-couleur-primaire: #272771;
43
+ --bandeau-titre-background: var(--centre-aide-background-entete);
44
+ --couleur-lien: #272771;
45
+ --couleur-focus: #272771;
46
+ --filtre-couleur-primaire: brightness(0) invert(16%) sepia(31%) saturate(3600%) hue-rotate(224deg) brightness(93%) contrast(101%);
47
+ --sommaire-actif-indicateur-couleur: #fed980;
48
+ --sommaire-actif-couleur: #272771;
49
+ --sommaire-mobile-fond: #f5f5fe;
50
+ --liste-articles-couleur-fleche: #ff0000;
51
+ --liste-articles-couleur-texte: #ff0000;
52
+ --bouton-secondaire-tertiaire-couleur-texte: #272771;
53
+ --bouton-secondaire-couleur-bordure: #0d0c21;
54
+ --bouton-primaire-couleur-texte: #3a3a3a;
55
+ --bouton-primaire-couleur-fond: #fdc82e;
56
+ --bouton-primaire-couleur-fond-survol: #ffdb71;
57
+ --bouton-primaire-couleur-fond-clique: #ededed;
58
+ --bouton-arrondi: 8px;
59
+ --tag-couleur-fond: #eeeeee;
60
+ --tag-couleur-texte: #161616;
61
+ --tag-selectionnable-couleur-texte: #000091;
62
+ --tag-selectionnable-couleur-fond: #e3e3fd;
63
+ --tag-selectionnable-couleur-fond-survol: #c1c1fb;
64
+ --tag-selectionnable-couleur-fond-clique: #adadf9;
65
+ --tag-selectionne-couleur-texte: #f5f5fe;
66
+ --tag-selectionne-couleur-fond: #000091;
67
+ --tag-selectionne-couleur-fond-survol: #1212ff;
68
+ --tag-selectionne-couleur-fond-clique: #2323ff;
69
+ }