UNPKG

@codegouvfr/react-dsfr

Version:

French State Design System React integration library

2,423 lines (1,859 loc) 105 kB
/*! * DSFR v1.8.5 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions) */ @charset "UTF-8"; .fr-sidemenu { /* @include elevation.elevate(raised, (legacy:$legacy)); @include respond-from(md) { @include elevation.drop((legacy:$legacy)); } */ } .fr-tabs { /** * Tab button */ } .fr-table { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--green-tilleul-verveine { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--green-bourgeon { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--green-emeraude { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--green-menthe { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--green-archipel { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--blue-ecume { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--blue-cumulus { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--purple-glycine { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--pink-macaron { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--pink-tuile { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--yellow-tournesol { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--yellow-moutarde { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--orange-terre-battue { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--brown-cafe-creme { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--brown-caramel { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--brown-opera { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--beige-gris-galet { /* Style bordered, ajoute des bordures entre chaque ligne */ } .fr-table--bordered tbody tr { /* Style bordered, enleve le style even/odd */ } /** * L'input de type checkbox avec son label est contenu dans un groupe * Ce groupe contient également les textes de validation, d'erreur et d'aide (optionnels) */ .fr-checkbox-group { /** * On cache l'input de type checkbox pour le styler via le label */ /** * Modificateur pour gérer l'état erreur */ /** * Modificateur pour gérer l'état validé */ } .fr-checkbox-group input[type=checkbox] { /** * On applique les styles au pseudo élément before du label quand l'input présente * un état check ou active */ /** * Mixins pour appliquer les styles correspondant au focus ainsi qu'à l'état disabled */ } .fr-toggle { /* * Ajout d'un séparateur */ } .fr-select { /** * Mixin pour gérer l'état disabled */ /** * On applique un style lorsque la valeur est automatiquement remplie par le navigateur * sur les navigateurs webkit. */ } .fr-modal__body { max-height: calc(100vh - 2rem); } .fr-input:disabled { color: var(--text-disabled-grey); box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey); } .fr-input[type=date]:disabled { color: var(--text-disabled-grey); box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey); } .fr-search-bar .fr-input { /** * Modificateur pour le champ validés */ /** * Modificateur pour le champ présentant des erreurs */ } /** * Mixin d'ajout des icones des réseaux sociaux **/ /** * Mixin d'ajout des icones des réseaux sociaux **/ @media (min-width: 36em) { /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ /*! media sm */ } @media (min-width: 48em) { /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ /*! media md */ } @media (min-width: 62em) { /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ .fr-translate .fr-translate__btn[aria-expanded=true]:hover { background-color: var(--hover-tint); } .fr-translate .fr-translate__btn[aria-expanded=true]:active { background-color: var(--active-tint); } /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ /*! media lg */ } @media (min-width: 78em) { /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ /*! media xl */ } @media all and (-ms-high-contrast: none) and (-ms-high-contrast: none), (-ms-high-contrast: none) and (-ms-high-contrast: active), (-ms-high-contrast: active) and (-ms-high-contrast: none), (-ms-high-contrast: active) and (-ms-high-contrast: active) { .fr-enlarge-link { background-color: transparent; } .fr-enlarge-link:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-enlarge-link:active { background-color: rgba(0, 0, 0, 0.1); } .fr-pagination__link { background-color: transparent; } .fr-pagination__link:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-pagination__link:active { background-color: rgba(0, 0, 0, 0.1); } .fr-nav__link, .fr-nav__btn { background-color: transparent; } .fr-nav__link:hover, .fr-nav__btn:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-nav__link:active, .fr-nav__btn:active { background-color: rgba(0, 0, 0, 0.1); } } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .fr-enlarge-link [href] { text-decoration: none; } [href], .fr-reset-link { text-decoration: underline; } .fr-raw-link { text-decoration: none; } .fr-reset-link::after { content: none; } [target=_blank]::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/external-link-line.svg"); width: 1rem; height: 1rem; } .fr-responsive-vid::before { content: ""; display: block; padding-bottom: 56.25%; } ul { list-style-type: disc; } ol { list-style-type: decimal; } ul, ol { padding-left: 1rem; margin-top: 0.5rem; margin-bottom: 0.5rem; } [class^=fr-icon-]::before, [class*=" fr-icon-"]::before, [class^=fr-fi-]::before, [class*=" fr-fi-"]::before { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1.5rem; height: 1.5rem; } .fr-icon--xs::before { width: 0.75rem; height: 0.75rem; } .fr-icon--sm::before { width: 1rem; height: 1rem; } .fr-icon--md::before { width: 1.5rem; height: 1.5rem; } .fr-icon--lg::before { width: 2rem; height: 2rem; } body { background-color: #fff; color: #3a3a3a; } a:not([href]), button:disabled, input:disabled, input[type=checkbox]:disabled, input[type=checkbox]:disabled + label, input[type=radio]:disabled, input[type=radio]:disabled + label, textarea:disabled, video:not([href]), audio:not([href]) { color: #929292; } .fr-artwork-decorative { fill: #ececfe; } .fr-artwork-minor { fill: #e1000f; } .fr-artwork-major { fill: #000091; } .fr-artwork-background { fill: #f6f6f6; } .fr-artwork-motif { fill: #e5e5e5; } .fr-artwork--green-tilleul-verveine .fr-artwork-minor { fill: #b7a73f; } .fr-artwork--green-bourgeon .fr-artwork-minor { fill: #68a532; } .fr-artwork--green-emeraude .fr-artwork-minor { fill: #00a95f; } .fr-artwork--green-menthe .fr-artwork-minor { fill: #009081; } .fr-artwork--green-archipel .fr-artwork-minor { fill: #009099; } .fr-artwork--blue-ecume .fr-artwork-minor { fill: #465f9d; } .fr-artwork--blue-cumulus .fr-artwork-minor { fill: #417dc4; } .fr-artwork--purple-glycine .fr-artwork-minor { fill: #a558a0; } .fr-artwork--pink-macaron .fr-artwork-minor { fill: #e18b76; } .fr-artwork--pink-tuile .fr-artwork-minor { fill: #ce614a; } .fr-artwork--yellow-tournesol .fr-artwork-minor { fill: #c8aa39; } .fr-artwork--yellow-moutarde .fr-artwork-minor { fill: #c3992a; } .fr-artwork--orange-terre-battue .fr-artwork-minor { fill: #e4794a; } .fr-artwork--brown-cafe-creme .fr-artwork-minor { fill: #d1b781; } .fr-artwork--brown-caramel .fr-artwork-minor { fill: #c08c65; } .fr-artwork--brown-opera .fr-artwork-minor { fill: #bd987a; } .fr-artwork--beige-gris-galet .fr-artwork-minor { fill: #aea397; } .fr-h6, .fr-h5, .fr-h4, .fr-h3, .fr-h2, .fr-h1, .fr-display-xs, .fr-display-sm, .fr-display-md, .fr-display-lg, .fr-display-xl { color: #161616; } h6, h5, h4, h3, h2, h1 { color: #161616; } hr { background-image: linear-gradient(0deg, #ddd, #ddd); } .fr-hr-or::before, .fr-hr-or::after { background-color: #ddd; } .fr-hr { background-image: linear-gradient(0deg, #ddd, #ddd); } /** * Reset liste à puce */ .fr-accordions-group ul { list-style-type: none; } .fr-accordions-group ol { list-style-type: none; } .fr-accordions-group ul, .fr-accordions-group ol { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-accordion__btn::before, .fr-accordion__btn::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/add-line.svg"); width: 1rem; height: 1rem; } .fr-accordion__btn[aria-expanded=true]::before, .fr-accordion__btn[aria-expanded=true]::after { background-image: url("icons/system/subtract-line.svg"); } .fr-accordion::before { box-shadow: inset 0 1px 0 0 #ddd, 0 1px 0 0 #ddd; } .fr-accordion__btn { color: #161616; } .fr-accordion__btn[aria-expanded=true] { color: #161616; } .fr-badge::before, .fr-badge::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1rem; height: 1rem; } .fr-badge--sm::before { width: 0.75rem; height: 0.75rem; } .fr-badge.fr-badge--info::before, .fr-badge.fr-badge--info::after, .fr-badge--sm.fr-badge--info::before, .fr-badge--sm.fr-badge--info::after { background-image: url("icons/system/fr--info-fill.svg"); } .fr-badge.fr-badge--success::before, .fr-badge.fr-badge--success::after, .fr-badge--sm.fr-badge--success::before, .fr-badge--sm.fr-badge--success::after { background-image: url("icons/system/fr--success-fill.svg"); } .fr-badge.fr-badge--error::before, .fr-badge.fr-badge--error::after, .fr-badge--sm.fr-badge--error::before, .fr-badge--sm.fr-badge--error::after { background-image: url("icons/system/fr--error-fill.svg"); } .fr-badge.fr-badge--warning::before, .fr-badge.fr-badge--warning::after, .fr-badge--sm.fr-badge--warning::before, .fr-badge--sm.fr-badge--warning::after { background-image: url("icons/system/fr--warning-fill.svg"); } .fr-badge.fr-badge--new::before, .fr-badge.fr-badge--new::after, .fr-badge--sm.fr-badge--new::before, .fr-badge--sm.fr-badge--new::after { background-image: url("icons/weather/flashlight-fill.svg"); } ul.fr-badges-group { list-style-type: none; } ol.fr-badges-group { list-style-type: none; } ul.fr-badges-group, ol.fr-badges-group { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-badge { color: #3a3a3a; background-color: #eee; } .fr-badge--info { color: #0063cb; background-color: #e8edff; } .fr-badge--error { color: #ce0500; background-color: #ffe9e9; } .fr-badge--success { color: #18753c; background-color: #b8fec9; } .fr-badge--warning { color: #b34000; background-color: #ffe9e6; } .fr-badge--new { color: #695240; background-color: #feebd0; } .fr-badge--green-tilleul-verveine { color: #66673d; background-color: #fceeac; } .fr-badge--green-bourgeon { color: #447049; background-color: #c9fcac; } .fr-badge--green-emeraude { color: #297254; background-color: #c3fad5; } .fr-badge--green-menthe { color: #37635f; background-color: #bafaee; } .fr-badge--green-archipel { color: #006a6f; background-color: #c7f6fc; } .fr-badge--blue-ecume { color: #2f4077; background-color: #e9edfe; } .fr-badge--blue-cumulus { color: #3558a2; background-color: #e6eefe; } .fr-badge--purple-glycine { color: #6e445a; background-color: #fee7fc; } .fr-badge--pink-macaron { color: #8d533e; background-color: #fee9e6; } .fr-badge--pink-tuile { color: #a94645; background-color: #fee9e7; } .fr-badge--yellow-tournesol { color: #716043; background-color: #feecc2; } .fr-badge--yellow-moutarde { color: #695240; background-color: #feebd0; } .fr-badge--orange-terre-battue { color: #755348; background-color: #fee9e5; } .fr-badge--brown-cafe-creme { color: #685c48; background-color: #f7ecdb; } .fr-badge--brown-caramel { color: #845d48; background-color: #f7ebe5; } .fr-badge--brown-opera { color: #745b47; background-color: #f7ece4; } .fr-badge--beige-gris-galet { color: #6a6156; background-color: #f3ede5; } .fr-logo { color: #161616; } .fr-btn::before, .fr-btn::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1rem; height: 1rem; } .fr-btn[class^=fr-icon-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn[class^=fr-icon-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn[class*=" fr-icon-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn[class*=" fr-icon-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn[class^=fr-fi-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn[class^=fr-fi-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn[class*=" fr-fi-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn[class*=" fr-fi-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1.5rem; height: 1.5rem; } .fr-btn--sm::before, .fr-btn--sm::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 0.75rem; height: 0.75rem; } .fr-btn--sm[class^=fr-icon-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--sm[class^=fr-icon-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn--sm[class*=" fr-icon-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--sm[class*=" fr-icon-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn--sm[class^=fr-fi-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--sm[class^=fr-fi-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn--sm[class*=" fr-fi-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--sm[class*=" fr-fi-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1rem; height: 1rem; } .fr-btn--lg::before, .fr-btn--lg::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1.5rem; height: 1.5rem; } .fr-btn--lg[class^=fr-icon-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--lg[class^=fr-icon-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn--lg[class*=" fr-icon-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--lg[class*=" fr-icon-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn--lg[class^=fr-fi-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--lg[class^=fr-fi-]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after, .fr-btn--lg[class*=" fr-fi-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::before, .fr-btn--lg[class*=" fr-fi-"]:not([class^=fr-btn--icon-]):not([class*=" fr-btn--icon-"])::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 2rem; height: 2rem; } .fr-btn--close::before, .fr-btn--close::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/close-line.svg"); width: 1rem; height: 1rem; } .fr-btn--fullscreen::before, .fr-btn--fullscreen::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/media/fullscreen-line.svg"); width: 1rem; height: 1rem; } .fr-btn--display::before, .fr-btn--display::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/fr--theme-fill.svg"); width: 1rem; height: 1rem; } ul.fr-btns-group { list-style-type: none; } ol.fr-btns-group { list-style-type: none; } ul.fr-btns-group, ol.fr-btns-group { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-]::before, .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-]::after, .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"]::before, .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"]::after, .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-]::before, .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-]::after, .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"]::before, .fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"]::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1rem; height: 1rem; } .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-]::before, .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-]::after, .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"]::before, .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"]::after, .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-]::before, .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-]::after, .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"]::before, .fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"]::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 2rem; height: 2rem; } .fr-btn { background-color: #000091; color: #f5f5fe; } .fr-btn:hover { background-color: #1212ff; } .fr-btn:active { background-color: #2323ff; } .fr-btn:disabled, a.fr-btn:not([href]) { color: #929292; background-color: #e5e5e5; } .fr-btn--secondary { background-color: transparent; color: #000091; box-shadow: inset 0 0 0 1px #000091; } .fr-btn--secondary:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-btn--secondary:active { background-color: rgba(0, 0, 0, 0.1); } .fr-btn--secondary:disabled, a.fr-btn--secondary:not([href]) { color: #929292; box-shadow: inset 0 0 0 1px #e5e5e5; background-color: transparent; } .fr-btn--secondary:disabled:hover, a.fr-btn--secondary:not([href]):hover { background-color: rgba(0, 0, 0, 0.05); } .fr-btn--secondary:disabled:active, a.fr-btn--secondary:not([href]):active { background-color: rgba(0, 0, 0, 0.1); } .fr-btn--tertiary { background-color: transparent; color: #000091; box-shadow: inset 0 0 0 1px #ddd; } .fr-btn--tertiary:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-btn--tertiary:active { background-color: rgba(0, 0, 0, 0.1); } .fr-btn--tertiary:disabled, a.fr-btn--tertiary:not([href]) { color: #929292; box-shadow: inset 0 0 0 1px #e5e5e5; background-color: transparent; } .fr-btn--tertiary:disabled:hover, a.fr-btn--tertiary:not([href]):hover { background-color: rgba(0, 0, 0, 0.05); } .fr-btn--tertiary:disabled:active, a.fr-btn--tertiary:not([href]):active { background-color: rgba(0, 0, 0, 0.1); } .fr-btn--tertiary-no-outline, .fr-btn--close, .fr-btn--display, .fr-btn--fullscreen { background-color: transparent; color: #000091; } .fr-btn--tertiary-no-outline:hover, .fr-btn--close:hover, .fr-btn--display:hover, .fr-btn--fullscreen:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-btn--tertiary-no-outline:active, .fr-btn--close:active, .fr-btn--display:active, .fr-btn--fullscreen:active { background-color: rgba(0, 0, 0, 0.1); } .fr-btn--tertiary-no-outline:disabled, a.fr-btn--tertiary-no-outline:not([href]), a.fr-btn--close:not([href]), a.fr-btn--display:not([href]), a.fr-btn--fullscreen:not([href]), .fr-btn--close:disabled, .fr-btn--display:disabled, .fr-btn--fullscreen:disabled { color: #929292; background-color: transparent; } .fr-btn--tertiary-no-outline:disabled:hover, a.fr-btn--tertiary-no-outline:not([href]):hover, a.fr-btn--close:not([href]):hover, a.fr-btn--display:not([href]):hover, a.fr-btn--fullscreen:not([href]):hover, .fr-btn--close:disabled:hover, .fr-btn--display:disabled:hover, .fr-btn--fullscreen:disabled:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-btn--tertiary-no-outline:disabled:active, a.fr-btn--tertiary-no-outline:not([href]):active, a.fr-btn--close:not([href]):active, a.fr-btn--display:not([href]):active, a.fr-btn--fullscreen:not([href]):active, .fr-btn--close:disabled:active, .fr-btn--display:disabled:active, .fr-btn--fullscreen:disabled:active { background-color: rgba(0, 0, 0, 0.1); } .fr-connect { background-color: #000091; color: #f5f5fe; } .fr-connect::after { background-image: linear-gradient(0deg, #f5f5fe, #f5f5fe), linear-gradient(0deg, #f5f5fe, #f5f5fe); } .fr-connect:disabled, a.fr-connect:not([href]) { background-color: #e5e5e5; color: #929292; } .fr-connect:disabled::after, a.fr-connect:not([href])::after { background-image: linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292); } .fr-connect-group .fr-connect + p a { color: #000091; } .fr-connect-group p { color: #666; } /** * Correction largeur max du texte */ .fr-quote::before, .fr-quote::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/editor/fr--quote-line.svg"); width: 2rem; height: 2rem; } .fr-quote blockquote { max-width: 100%; } .fr-quote::before { color: #6a6af4; } .fr-quote--green-tilleul-verveine::before { color: #b7a73f; } .fr-quote--green-bourgeon::before { color: #68a532; } .fr-quote--green-emeraude::before { color: #00a95f; } .fr-quote--green-menthe::before { color: #009081; } .fr-quote--green-archipel::before { color: #009099; } .fr-quote--blue-ecume::before { color: #465f9d; } .fr-quote--blue-cumulus::before { color: #417dc4; } .fr-quote--purple-glycine::before { color: #a558a0; } .fr-quote--pink-macaron::before { color: #e18b76; } .fr-quote--pink-tuile::before { color: #ce614a; } .fr-quote--yellow-tournesol::before { color: #c8aa39; } .fr-quote--yellow-moutarde::before { color: #c3992a; } .fr-quote--orange-terre-battue::before { color: #e4794a; } .fr-quote--brown-cafe-creme::before { color: #d1b781; } .fr-quote--brown-caramel::before { color: #c08c65; } .fr-quote--brown-opera::before { color: #bd987a; } .fr-quote--beige-gris-galet::before { color: #aea397; } .fr-quote { background-image: linear-gradient(0deg, #ddd, #ddd); } .fr-quote__source { color: #666; } /** * reset liste à puce */ .fr-breadcrumb ul { list-style-type: none; } .fr-breadcrumb ol { list-style-type: none; } .fr-breadcrumb ul, .fr-breadcrumb ol { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-breadcrumb__link:not([aria-current])::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/arrow-right-s-line.svg"); width: 1rem; height: 1rem; } .fr-breadcrumb { color: #666; } .fr-breadcrumb__link[aria-current] { color: #161616; } .fr-fieldset__legend { max-width: 100%; color: #161616; } .fr-message--error::before, .fr-message--error::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/fr--error-fill.svg"); width: 1rem; height: 1rem; } .fr-message--valid::before, .fr-message--valid::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/fr--success-fill.svg"); width: 1rem; height: 1rem; } .fr-message--info::before, .fr-message--info::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/information-fill.svg"); width: 1rem; height: 1rem; } .fr-select-group--valid label, .fr-input-group--valid label, .fr-upload-group--valid label { color: #18753c; } .fr-select-group--error label, .fr-input-group--error label, .fr-upload-group--error label { color: #ce0500; } .fr-select-group--info label, .fr-input-group--info label, .fr-upload-group--info label { color: #0063cb; } .fr-select-group--disabled label, .fr-input-group--disabled label, .fr-upload-group--disabled label { color: #929292; } .fr-label { color: #161616; } .fr-label--error { color: #ce0500; } .fr-label--success { color: #18753c; } .fr-label--info { color: #0063cb; } .fr-label--disabled, .fr-label--disabled .fr-hint-text { color: #929292; } .fr-hint-text, .fr-message { color: #666; } .fr-message--error { color: #ce0500; } .fr-message--valid { color: #18753c; } .fr-message--info { color: #0063cb; } .fr-fieldset:disabled .fr-label, .fr-fieldset:disabled .fr-fieldset__legend { color: #929292; } .fr-fieldset--error, .fr-fieldset--error .fr-fieldset__legend { background-image: linear-gradient(0deg, #ce0500, #ce0500); } .fr-fieldset--error .fr-fieldset__legend, .fr-fieldset--error .fr-label { color: #ce0500; } .fr-fieldset--valid, .fr-fieldset--valid .fr-fieldset__legend { background-image: linear-gradient(0deg, #18753c, #18753c); } .fr-fieldset--valid .fr-fieldset__legend, .fr-fieldset--valid .fr-label { color: #18753c; } .fr-fieldset--info, .fr-fieldset--info .fr-fieldset__legend { background-image: linear-gradient(0deg, #0063cb, #0063cb); } .fr-fieldset--info .fr-fieldset__legend, .fr-fieldset--info .fr-label { color: #0063cb; } .fr-error-text::before, .fr-error-text::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/fr--error-fill.svg"); width: 1rem; height: 1rem; } .fr-valid-text::before, .fr-valid-text::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/fr--success-fill.svg"); width: 1rem; height: 1rem; } .fr-error-text { color: #ce0500; } .fr-valid-text { color: #18753c; } .fr-info-text { color: #0063cb; } .fr-fieldset--valid .fr-fieldset__content::before { box-shadow: inset 2px 0 0 0 #18753c; } .fr-fieldset--error .fr-fieldset__content::before { box-shadow: inset 2px 0 0 0 #ce0500; } .fr-fieldset--info .fr-fieldset__content::before { box-shadow: inset 2px 0 0 0 #0063cb; } .fr-stepper__title { margin-bottom: 0.75rem; color: #161616; } .fr-stepper__steps { display: none; background-image: repeating-linear-gradient(to right, #000091 0, #000091 var(--active-inner), transparent var(--active-inner), transparent var(--active-outer)), repeating-linear-gradient(to right, #eee 0, #eee var(--default-inner), transparent var(--default-inner), transparent var(--default-outer)); } .fr-stepper__state { color: #666; } .fr-stepper__details { color: #666; } .fr-link { background-image: none; text-decoration: underline; color: #000091; } .fr-link::before { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1rem; height: 1rem; } .fr-link--sm::before { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1rem; height: 1rem; } .fr-link--lg::before { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1.5rem; height: 1.5rem; } ul.fr-links-group { list-style-type: none; } ol.fr-links-group { list-style-type: none; } ul.fr-links-group, ol.fr-links-group { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-link--close { background-color: transparent; color: #000091; } .fr-link--close:hover { background-color: rgba(0, 0, 0, 0.05); } .fr-link--close:active { background-color: rgba(0, 0, 0, 0.1); } .fr-link--close:disabled, a.fr-link--close:not([href]) { color: #929292; background-color: transparent; } .fr-link--close:disabled:hover, a.fr-link--close:not([href]):hover { background-color: rgba(0, 0, 0, 0.05); } .fr-link--close:disabled:active, a.fr-link--close:not([href]):active { background-color: rgba(0, 0, 0, 0.1); } /** * Correctif de la hauteur de la navigation latérale */ .fr-sidemenu { height: auto; box-shadow: inset 0 -1px 0 0 #ddd, inset 0 1px 0 0 #ddd; } .fr-sidemenu ul { list-style-type: none; } .fr-sidemenu ol { list-style-type: none; } .fr-sidemenu ul, .fr-sidemenu ol { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-sidemenu [href] { text-decoration: none; } .fr-sidemenu__btn[aria-expanded]::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/arrow-down-s-line.svg"); width: 1rem; height: 1rem; } .fr-sidemenu__title { color: #161616; box-shadow: inset 0 -1px 0 0 #ddd; } .fr-sidemenu__item::before { box-shadow: 0 -1px 0 0 #ddd, inset 0 -1px 0 0 #ddd; } .fr-sidemenu__item:first-child::before { box-shadow: inset 0 -1px 0 0 #ddd; } .fr-sidemenu__item:last-child::before { box-shadow: 0 -1px 0 0 #ddd; } .fr-sidemenu__link, .fr-sidemenu__btn { color: #161616; } .fr-sidemenu__link[aria-current], .fr-sidemenu__btn[aria-current] { color: #000091; } .fr-sidemenu__link[aria-current]::before, .fr-sidemenu__btn[aria-current]::before { background-color: #000091; } .fr-highlight { box-shadow: inset 0.25rem 0 0 0 #6a6af4; } .fr-highlight--green-tilleul-verveine { box-shadow: inset 0.25rem 0 0 0 #b7a73f; } .fr-highlight--green-bourgeon { box-shadow: inset 0.25rem 0 0 0 #68a532; } .fr-highlight--green-emeraude { box-shadow: inset 0.25rem 0 0 0 #00a95f; } .fr-highlight--green-menthe { box-shadow: inset 0.25rem 0 0 0 #009081; } .fr-highlight--green-archipel { box-shadow: inset 0.25rem 0 0 0 #009099; } .fr-highlight--blue-ecume { box-shadow: inset 0.25rem 0 0 0 #465f9d; } .fr-highlight--blue-cumulus { box-shadow: inset 0.25rem 0 0 0 #417dc4; } .fr-highlight--purple-glycine { box-shadow: inset 0.25rem 0 0 0 #a558a0; } .fr-highlight--pink-macaron { box-shadow: inset 0.25rem 0 0 0 #e18b76; } .fr-highlight--pink-tuile { box-shadow: inset 0.25rem 0 0 0 #ce614a; } .fr-highlight--yellow-tournesol { box-shadow: inset 0.25rem 0 0 0 #c8aa39; } .fr-highlight--yellow-moutarde { box-shadow: inset 0.25rem 0 0 0 #c3992a; } .fr-highlight--orange-terre-battue { box-shadow: inset 0.25rem 0 0 0 #e4794a; } .fr-highlight--brown-cafe-creme { box-shadow: inset 0.25rem 0 0 0 #d1b781; } .fr-highlight--brown-caramel { box-shadow: inset 0.25rem 0 0 0 #c08c65; } .fr-highlight--brown-opera { box-shadow: inset 0.25rem 0 0 0 #bd987a; } .fr-highlight--beige-gris-galet { box-shadow: inset 0.25rem 0 0 0 #aea397; } /** * Reset liste à puce */ .fr-tabs ul { list-style-type: none; } .fr-tabs ol { list-style-type: none; } .fr-tabs ul, .fr-tabs ol { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-tabs__panel [href] { text-decoration: underline; } .fr-tabs { box-shadow: inset 0 -1px 0 0 #ddd; } .fr-tabs::before { box-shadow: inset 0 1px 0 0 #ddd, inset 1px 0 0 0 #ddd, inset -1px 0 0 0 #ddd; } .fr-tabs__tab { background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd); box-shadow: 0 2px 0 0 #fff; } .fr-tabs__tab:not([aria-selected=true]) { background-color: #e3e3fd; color: #161616; } .fr-tabs__tab[aria-selected=true] { background-color: #fff; color: #000091; } .fr-tabs__tab:disabled { color: #929292; background-color: #e5e5e5; } /** * Correctif de la largeur de la légende d'un fieldset */ .fr-pagination [href] { text-decoration: none; } .fr-pagination ul { list-style-type: none; } .fr-pagination ol { list-style-type: none; } .fr-pagination ul, .fr-pagination ol { padding-left: 0; margin-top: 0; margin-bottom: 0; } .fr-pagination__link--first::before, .fr-pagination__link--first::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/fr--arrow-left-s-first-line.svg"); width: 1.5rem; height: 1.5rem; } .fr-pagination__link--prev::before, .fr-pagination__link--prev::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/arrow-left-s-line.svg"); width: 1.5rem; height: 1.5rem; } .fr-pagination__link--next::before, .fr-pagination__link--next::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/arrow-right-s-line.svg"); width: 1.5rem; height: 1.5rem; } .fr-pagination__link--last::before, .fr-pagination__link--last::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/fr--arrow-right-s-last-line.svg"); width: 1.5rem; height: 1.5rem; } .fr-pagination { color: #161616; } .fr-pagination__link[aria-current] { background-color: #000091; color: #f5f5fe; } .fr-pagination__link[aria-current]:hover { background-color: #1212ff; } .fr-pagination__link[aria-current]:active { background-color: #2323ff; } .fr-pagination__link:not([aria-current]):disabled, a.fr-pagination__link:not([aria-current]):not([href]) { color: #929292; } .fr-summary { background-color: #eee; } .fr-summary__title { color: #161616; } .fr-summary li > a { color: #161616; } /** * Correctif placement caption */ .fr-table[data-fr-js-table=true] caption { position: relative; } .fr-table caption { color: #161616; } .fr-table thead { background-image: linear-gradient(0deg, #3a3a3a, #3a3a3a); background-color: #eee; color: #161616; } .fr-table tbody { background-color: #f6f6f6; } .fr-table tbody tr:nth-child(even) { background-color: #eee; } .fr-table--green-tilleul-verveine thead { background-image: linear-gradient(0deg, #66673d, #66673d); background-color: #fceeac; } .fr-table--green-tilleul-verveine tbody { background-color: #fef7da; } .fr-table--green-tilleul-verveine tbody tr:nth-child(even) { background-color: #fceeac; } .fr-table--green-tilleul-verveine.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #b7a73f, #b7a73f); } .fr-table--green-bourgeon thead { background-image: linear-gradient(0deg, #447049, #447049); background-color: #c9fcac; } .fr-table--green-bourgeon tbody { background-color: #e6feda; } .fr-table--green-bourgeon tbody tr:nth-child(even) { background-color: #c9fcac; } .fr-table--green-bourgeon.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #68a532, #68a532); } .fr-table--green-emeraude thead { background-image: linear-gradient(0deg, #297254, #297254); background-color: #c3fad5; } .fr-table--green-emeraude tbody { background-color: #e3fdeb; } .fr-table--green-emeraude tbody tr:nth-child(even) { background-color: #c3fad5; } .fr-table--green-emeraude.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #00a95f, #00a95f); } .fr-table--green-menthe thead { background-image: linear-gradient(0deg, #37635f, #37635f); background-color: #bafaee; } .fr-table--green-menthe tbody { background-color: #dffdf7; } .fr-table--green-menthe tbody tr:nth-child(even) { background-color: #bafaee; } .fr-table--green-menthe.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #009081, #009081); } .fr-table--green-archipel thead { background-image: linear-gradient(0deg, #006a6f, #006a6f); background-color: #c7f6fc; } .fr-table--green-archipel tbody { background-color: #e5fbfd; } .fr-table--green-archipel tbody tr:nth-child(even) { background-color: #c7f6fc; } .fr-table--green-archipel.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #009099, #009099); } .fr-table--blue-ecume thead { background-image: linear-gradient(0deg, #2f4077, #2f4077); background-color: #e9edfe; } .fr-table--blue-ecume tbody { background-color: #f4f6fe; } .fr-table--blue-ecume tbody tr:nth-child(even) { background-color: #e9edfe; } .fr-table--blue-ecume.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #465f9d, #465f9d); } .fr-table--blue-cumulus thead { background-image: linear-gradient(0deg, #3558a2, #3558a2); background-color: #e6eefe; } .fr-table--blue-cumulus tbody { background-color: #f3f6fe; } .fr-table--blue-cumulus tbody tr:nth-child(even) { background-color: #e6eefe; } .fr-table--blue-cumulus.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #417dc4, #417dc4); } .fr-table--purple-glycine thead { background-image: linear-gradient(0deg, #6e445a, #6e445a); background-color: #fee7fc; } .fr-table--purple-glycine tbody { background-color: #fef3fd; } .fr-table--purple-glycine tbody tr:nth-child(even) { background-color: #fee7fc; } .fr-table--purple-glycine.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #a558a0, #a558a0); } .fr-table--pink-macaron thead { background-image: linear-gradient(0deg, #8d533e, #8d533e); background-color: #fee9e6; } .fr-table--pink-macaron tbody { background-color: #fef4f2; } .fr-table--pink-macaron tbody tr:nth-child(even) { background-color: #fee9e6; } .fr-table--pink-macaron.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #e18b76, #e18b76); } .fr-table--pink-tuile thead { background-image: linear-gradient(0deg, #a94645, #a94645); background-color: #fee9e7; } .fr-table--pink-tuile tbody { background-color: #fef4f3; } .fr-table--pink-tuile tbody tr:nth-child(even) { background-color: #fee9e7; } .fr-table--pink-tuile.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #ce614a, #ce614a); } .fr-table--yellow-tournesol thead { background-image: linear-gradient(0deg, #716043, #716043); background-color: #feecc2; } .fr-table--yellow-tournesol tbody { background-color: #fef6e3; } .fr-table--yellow-tournesol tbody tr:nth-child(even) { background-color: #feecc2; } .fr-table--yellow-tournesol.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #c8aa39, #c8aa39); } .fr-table--yellow-moutarde thead { background-image: linear-gradient(0deg, #695240, #695240); background-color: #feebd0; } .fr-table--yellow-moutarde tbody { background-color: #fef5e8; } .fr-table--yellow-moutarde tbody tr:nth-child(even) { background-color: #feebd0; } .fr-table--yellow-moutarde.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #c3992a, #c3992a); } .fr-table--orange-terre-battue thead { background-image: linear-gradient(0deg, #755348, #755348); background-color: #fee9e5; } .fr-table--orange-terre-battue tbody { background-color: #fef4f2; } .fr-table--orange-terre-battue tbody tr:nth-child(even) { background-color: #fee9e5; } .fr-table--orange-terre-battue.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #e4794a, #e4794a); } .fr-table--brown-cafe-creme thead { background-image: linear-gradient(0deg, #685c48, #685c48); background-color: #f7ecdb; } .fr-table--brown-cafe-creme tbody { background-color: #fbf6ed; } .fr-table--brown-cafe-creme tbody tr:nth-child(even) { background-color: #f7ecdb; } .fr-table--brown-cafe-creme.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #d1b781, #d1b781); } .fr-table--brown-caramel thead { background-image: linear-gradient(0deg, #845d48, #845d48); background-color: #f7ebe5; } .fr-table--brown-caramel tbody { background-color: #fbf5f2; } .fr-table--brown-caramel tbody tr:nth-child(even) { background-color: #f7ebe5; } .fr-table--brown-caramel.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #c08c65, #c08c65); } .fr-table--brown-opera thead { background-image: linear-gradient(0deg, #745b47, #745b47); background-color: #f7ece4; } .fr-table--brown-opera tbody { background-color: #fbf5f2; } .fr-table--brown-opera tbody tr:nth-child(even) { background-color: #f7ece4; } .fr-table--brown-opera.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #bd987a, #bd987a); } .fr-table--beige-gris-galet thead { background-image: linear-gradient(0deg, #6a6156, #6a6156); background-color: #f3ede5; } .fr-table--beige-gris-galet tbody { background-color: #f9f6f2; } .fr-table--beige-gris-galet tbody tr:nth-child(even) { background-color: #f3ede5; } .fr-table--beige-gris-galet.fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #aea397, #aea397); } .fr-table--bordered tbody tr { background-image: linear-gradient(0deg, #ddd, #ddd); } .fr-table--bordered tbody tr:nth-child(even) { background-color: transparent; } .fr-table--bordered tbody tr:nth-child(even):hover { background-color: rgba(0, 0, 0, 0.05); } .fr-table--bordered tbody tr:nth-child(even):active { background-color: rgba(0, 0, 0, 0.1); } .fr-tag::before, .fr-tag::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 1rem; height: 1rem; } .fr-tag .fr-tag--sm::before { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 0.75rem; height: 0.75rem; } button .fr-tag[aria-pressed=true], input[type=button] .fr-tag[aria-pressed=true] { background-size: 100% 100%, 100% 100%; } button .fr-tag[aria-pressed=true]::after, input[type=button] .fr-tag[aria-pressed=true]::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/checkbox-circle-line.svg"); width: 1rem; height: 1rem; } button .fr-tag[aria-pressed=true] .fr-tag--sm::after, input[type=button] .fr-tag[aria-pressed=true] .fr-tag--sm::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 0.75rem; height: 0.75rem; } button .fr-tag .fr-tag--dismiss::after, input[type=button] .fr-tag .fr-tag--dismiss::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; background-image: url("icons/system/close-line.svg"); width: 1rem; height: 1rem; } button .fr-tag .fr-tag--dismiss .fr-tag--sm::after, input[type=button] .fr-tag .fr-tag--dismiss .fr-tag--sm::after { background-color: transparent; background-size: 100%; background-repeat: no-repeat; width: 0.75rem; height: 0.75rem; } ul.fr-tags-group { list-style-type: none; } ol.fr-tags-group { list-style-type: none; } ul.fr-tags-group, ol.fr-tags-g