22032 lines
588 KiB
CSS
22032 lines
588 KiB
CSS
|
/*!
|
|||
|
|
* DSFR v1.11.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions)
|
|||
|
|
*/
|
|||
|
|
@charset "UTF-8";
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
UPLOAD
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-upload-group .fr-label .fr-hint-text {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-upload-group .fr-label + .fr-upload {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-upload-group .fr-message:first-child {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-upload {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
width: 100%;
|
|||
|
|
display: inline-flex;
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-upload:disabled::-webkit-file-upload-button {
|
|||
|
|
outline-style: none;
|
|||
|
|
cursor: not-allowed;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-upload::-webkit-file-upload-button {
|
|||
|
|
-webkit-appearance: button;
|
|||
|
|
-moz-appearance: button;
|
|||
|
|
appearance: button;
|
|||
|
|
font: inherit;
|
|||
|
|
cursor: pointer;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
RANGE
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-range-group {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--valid::before,
|
|||
|
|
.fr-range-group--error::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
pointer-events: none;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: -0.75rem;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: -0.75rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: 0 0;
|
|||
|
|
background-size: 0.125rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range {
|
|||
|
|
--thumb-size: 1.5rem;
|
|||
|
|
position: relative;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range input[type=range] {
|
|||
|
|
outline: none;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range__output {
|
|||
|
|
visibility: hidden;
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range__output,
|
|||
|
|
.fr-range__min,
|
|||
|
|
.fr-range__max {
|
|||
|
|
text-align: center;
|
|||
|
|
min-width: var(--thumb-size);
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] {
|
|||
|
|
--progress-left: 0;
|
|||
|
|
--progress-right: calc(var(--thumb-size) * 0.5);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range]::before,
|
|||
|
|
.fr-range[data-fr-js-range]::after {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 1.625rem;
|
|||
|
|
right: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 0.75rem;
|
|||
|
|
border-radius: 0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range]::before {
|
|||
|
|
outline-offset: -1px;
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range]::after {
|
|||
|
|
clip-path: polygon(var(--progress-left) 0, var(--progress-right) 0, var(--progress-right) 100%, var(--progress-left) 100%);
|
|||
|
|
background-color: var(--background-active-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-active-blue-france-hover);
|
|||
|
|
--active: var(--background-active-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range] {
|
|||
|
|
-webkit-appearance: none;
|
|||
|
|
-moz-appearance: none;
|
|||
|
|
appearance: none;
|
|||
|
|
background-color: transparent;
|
|||
|
|
width: 100%;
|
|||
|
|
height: var(--thumb-size);
|
|||
|
|
z-index: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]:not(:only-of-type) {
|
|||
|
|
pointer-events: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]::-webkit-slider-thumb {
|
|||
|
|
-webkit-appearance: none;
|
|||
|
|
-moz-appearance: none;
|
|||
|
|
appearance: none;
|
|||
|
|
width: var(--thumb-size);
|
|||
|
|
height: var(--thumb-size);
|
|||
|
|
border-radius: 50%;
|
|||
|
|
border: none;
|
|||
|
|
pointer-events: auto;
|
|||
|
|
z-index: calc(var(--ground) + 500);
|
|||
|
|
background-color: var(--background-raised-grey);
|
|||
|
|
--hover: var(--background-raised-grey-hover);
|
|||
|
|
--active: var(--background-raised-grey-active);
|
|||
|
|
filter: drop-shadow(var(--raised-shadow));
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
border: 1px solid var(--border-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]::-webkit-slider-thumb:active {
|
|||
|
|
z-index: 2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]::-moz-range-thumb {
|
|||
|
|
-webkit-appearance: none;
|
|||
|
|
-moz-appearance: none;
|
|||
|
|
appearance: none;
|
|||
|
|
width: var(--thumb-size);
|
|||
|
|
height: var(--thumb-size);
|
|||
|
|
border-radius: 50%;
|
|||
|
|
border: none;
|
|||
|
|
pointer-events: auto;
|
|||
|
|
z-index: calc(var(--ground) + 500);
|
|||
|
|
background-color: var(--background-raised-grey);
|
|||
|
|
--hover: var(--background-raised-grey-hover);
|
|||
|
|
--active: var(--background-raised-grey-active);
|
|||
|
|
filter: drop-shadow(var(--raised-shadow));
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
border: 1px solid var(--border-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]::-moz-range-thumb:active {
|
|||
|
|
z-index: 2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] .fr-range__output {
|
|||
|
|
visibility: visible;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm {
|
|||
|
|
--thumb-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range]::before,
|
|||
|
|
.fr-range--sm[data-fr-js-range]::after {
|
|||
|
|
top: 1.5rem;
|
|||
|
|
height: 0.5rem;
|
|||
|
|
border-radius: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step[data-fr-js-range] {
|
|||
|
|
--step-width: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step[data-fr-js-range]::before,
|
|||
|
|
.fr-range--step[data-fr-js-range]::after {
|
|||
|
|
padding-left: 0.625rem;
|
|||
|
|
padding-right: 0.625rem;
|
|||
|
|
background-repeat: repeat-x;
|
|||
|
|
background-size: var(--step-width) 100%;
|
|||
|
|
background-position: 0.625rem 0;
|
|||
|
|
background-clip: content-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step.fr-range--sm[data-fr-js-range]::before,
|
|||
|
|
.fr-range--step.fr-range--sm[data-fr-js-range]::after {
|
|||
|
|
background-position: 0.375rem 0;
|
|||
|
|
padding-left: 0.375rem;
|
|||
|
|
padding-right: 0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--double .fr-range__output {
|
|||
|
|
min-width: calc(var(--thumb-size) * 2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--double[data-fr-js-range] input[type=range] {
|
|||
|
|
width: calc(100% - var(--thumb-size));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--double[data-fr-js-range] input[type=range]:nth-of-type(1) {
|
|||
|
|
margin-right: var(--thumb-size);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--double[data-fr-js-range] input[type=range]:nth-of-type(2) {
|
|||
|
|
position: absolute;
|
|||
|
|
right: 0;
|
|||
|
|
top: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--double.fr-range--step[data-fr-js-range]::before,
|
|||
|
|
.fr-range--double.fr-range--step[data-fr-js-range]::after {
|
|||
|
|
background-size: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]:disabled::-webkit-slider-thumb {
|
|||
|
|
border: 1px solid var(--border-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]:disabled::-moz-range-thumb {
|
|||
|
|
border: 1px solid var(--border-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range__min,
|
|||
|
|
.fr-range__max {
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step[data-fr-js-range]::before {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, var(--background-action-high-blue-france) 0, var(--background-action-high-blue-france) 1px, transparent 1px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step[data-fr-js-range]::after {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, var(--background-action-low-blue-france) 0, var(--background-action-low-blue-france) 2px, transparent 2px);
|
|||
|
|
box-shadow: inset 10px 0 0 0 var(--border-active-blue-france), inset -10px 0 0 0 var(--border-active-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step.fr-range--sm[data-fr-js-range]::after {
|
|||
|
|
box-shadow: inset 6px 0 0 0 var(--border-active-blue-france), inset -6px 0 0 0 var(--border-active-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range[data-fr-js-range]::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range[data-fr-js-range]::after {
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range--step[data-fr-js-range]::before {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, var(--background-disabled-grey) 0, var(--background-disabled-grey) 1px, transparent 1px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range--step[data-fr-js-range]::after {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, var(--background-default-grey) 0, var(--background-default-grey) 2px, transparent 2px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range__output,
|
|||
|
|
.fr-range-group--disabled .fr-range__min,
|
|||
|
|
.fr-range-group--disabled .fr-range__max {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
ACCORDION
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-accordion {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey), 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__title {
|
|||
|
|
margin: 0;
|
|||
|
|
display: block;
|
|||
|
|
font-size: unset;
|
|||
|
|
line-height: unset;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion:focus-within {
|
|||
|
|
z-index: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
width: 100%;
|
|||
|
|
text-align: left;
|
|||
|
|
margin: 0;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn::before,
|
|||
|
|
.fr-accordion__btn::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
transition: transform 0.3s;
|
|||
|
|
margin-right: 0;
|
|||
|
|
margin-left: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion .fr-collapse {
|
|||
|
|
--ul-type: disc;
|
|||
|
|
--ol-type: decimal;
|
|||
|
|
--ul-start: 1rem;
|
|||
|
|
--ol-start: 1.5rem;
|
|||
|
|
--xl-block: 0.5rem;
|
|||
|
|
--li-bottom: 0.25rem;
|
|||
|
|
--xl-base: 1em;
|
|||
|
|
--ol-content: counters(li-counter, ".") ". ";
|
|||
|
|
transition: visibility 0.3s, padding 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion .fr-collapse--expanded {
|
|||
|
|
padding-top: 1rem;
|
|||
|
|
padding-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordions-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn[aria-expanded=true] {
|
|||
|
|
background-color: var(--background-open-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-open-blue-france-hover);
|
|||
|
|
--active: var(--background-open-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ------------------------------------ *\
|
|||
|
|
Badge
|
|||
|
|
\* ------------------------------------ */
|
|||
|
|
.fr-badge {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 1.5rem;
|
|||
|
|
padding: 0 0.5rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-height: none;
|
|||
|
|
font-weight: 700;
|
|||
|
|
max-width: 100%;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
border-radius: 0.25rem;
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge::before,
|
|||
|
|
.fr-badge::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-badge--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-badge--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-badge--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-badge--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-badge--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-badge--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge[class^=fr-icon-]:not([class*=fr-badge--icon-])::before,
|
|||
|
|
.fr-badge[class*=" fr-icon-"]:not([class*=fr-badge--icon-])::before,
|
|||
|
|
.fr-badge[class^=fr-fi-]:not([class*=fr-badge--icon-])::before,
|
|||
|
|
.fr-badge[class*=" fr-fi-"]:not([class*=fr-badge--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--sm {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.125rem;
|
|||
|
|
padding: 0 0.375rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-badge--sm.fr-badge--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
margin-left: -0.09375rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--sm[class^=fr-icon-]:not([class*=fr-badge--icon-])::before,
|
|||
|
|
.fr-badge--sm[class*=" fr-icon-"]:not([class*=fr-badge--icon-])::before,
|
|||
|
|
.fr-badge--sm[class^=fr-fi-]:not([class*=fr-badge--icon-])::before,
|
|||
|
|
.fr-badge--sm[class*=" fr-fi-"]:not([class*=fr-badge--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--sm::before {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
margin-left: -0.09375rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge.fr-badge--info::before,
|
|||
|
|
.fr-badge--sm.fr-badge--info::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge.fr-badge--success::before,
|
|||
|
|
.fr-badge--sm.fr-badge--success::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge.fr-badge--error::before,
|
|||
|
|
.fr-badge--sm.fr-badge--error::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge.fr-badge--warning::before,
|
|||
|
|
.fr-badge--sm.fr-badge--warning::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--warning-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--warning-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge.fr-badge--new::before,
|
|||
|
|
.fr-badge--sm.fr-badge--new::before {
|
|||
|
|
-webkit-mask-image: url("../icons/weather/flashlight-fill.svg");
|
|||
|
|
mask-image: url("../icons/weather/flashlight-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--info::before,
|
|||
|
|
.fr-badge--success::before,
|
|||
|
|
.fr-badge--error::before,
|
|||
|
|
.fr-badge--warning::before,
|
|||
|
|
.fr-badge--new::before,
|
|||
|
|
.fr-badge--sm--info::before,
|
|||
|
|
.fr-badge--sm--success::before,
|
|||
|
|
.fr-badge--sm--error::before,
|
|||
|
|
.fr-badge--sm--warning::before,
|
|||
|
|
.fr-badge--sm--new::before {
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge.fr-badge--no-icon::before,
|
|||
|
|
.fr-badge--sm.fr-badge--no-icon::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badges-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin-left: -0.25rem;
|
|||
|
|
margin-right: -0.25rem;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badges-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badges-group .fr-badge {
|
|||
|
|
margin: 0 0.25rem 0.5rem 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badges-group--sm .fr-badge {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.125rem;
|
|||
|
|
padding: 0 0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badges-group--sm .fr-badge::before,
|
|||
|
|
.fr-badges-group--sm .fr-badge::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--info {
|
|||
|
|
color: var(--text-default-info);
|
|||
|
|
background-color: var(--background-contrast-info);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-info-hover);
|
|||
|
|
--active: var(--background-contrast-info-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--error {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
background-color: var(--background-contrast-error);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-error-hover);
|
|||
|
|
--active: var(--background-contrast-error-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--success {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
background-color: var(--background-contrast-success);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-success-hover);
|
|||
|
|
--active: var(--background-contrast-success-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--warning {
|
|||
|
|
color: var(--text-default-warning);
|
|||
|
|
background-color: var(--background-contrast-warning);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-warning-hover);
|
|||
|
|
--active: var(--background-contrast-warning-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--new {
|
|||
|
|
color: var(--text-action-high-yellow-moutarde);
|
|||
|
|
background-color: var(--background-contrast-yellow-moutarde);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-moutarde-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-moutarde-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--green-tilleul-verveine {
|
|||
|
|
color: var(--text-label-green-tilleul-verveine);
|
|||
|
|
background-color: var(--background-contrast-green-tilleul-verveine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-tilleul-verveine-hover);
|
|||
|
|
--active: var(--background-contrast-green-tilleul-verveine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--green-bourgeon {
|
|||
|
|
color: var(--text-label-green-bourgeon);
|
|||
|
|
background-color: var(--background-contrast-green-bourgeon);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-bourgeon-hover);
|
|||
|
|
--active: var(--background-contrast-green-bourgeon-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--green-emeraude {
|
|||
|
|
color: var(--text-label-green-emeraude);
|
|||
|
|
background-color: var(--background-contrast-green-emeraude);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-emeraude-hover);
|
|||
|
|
--active: var(--background-contrast-green-emeraude-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--green-menthe {
|
|||
|
|
color: var(--text-label-green-menthe);
|
|||
|
|
background-color: var(--background-contrast-green-menthe);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-menthe-hover);
|
|||
|
|
--active: var(--background-contrast-green-menthe-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--green-archipel {
|
|||
|
|
color: var(--text-label-green-archipel);
|
|||
|
|
background-color: var(--background-contrast-green-archipel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-archipel-hover);
|
|||
|
|
--active: var(--background-contrast-green-archipel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--blue-ecume {
|
|||
|
|
color: var(--text-label-blue-ecume);
|
|||
|
|
background-color: var(--background-contrast-blue-ecume);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-ecume-hover);
|
|||
|
|
--active: var(--background-contrast-blue-ecume-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--blue-cumulus {
|
|||
|
|
color: var(--text-label-blue-cumulus);
|
|||
|
|
background-color: var(--background-contrast-blue-cumulus);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-cumulus-hover);
|
|||
|
|
--active: var(--background-contrast-blue-cumulus-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--purple-glycine {
|
|||
|
|
color: var(--text-label-purple-glycine);
|
|||
|
|
background-color: var(--background-contrast-purple-glycine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-purple-glycine-hover);
|
|||
|
|
--active: var(--background-contrast-purple-glycine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--pink-macaron {
|
|||
|
|
color: var(--text-label-pink-macaron);
|
|||
|
|
background-color: var(--background-contrast-pink-macaron);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-macaron-hover);
|
|||
|
|
--active: var(--background-contrast-pink-macaron-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--pink-tuile {
|
|||
|
|
color: var(--text-label-pink-tuile);
|
|||
|
|
background-color: var(--background-contrast-pink-tuile);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-tuile-hover);
|
|||
|
|
--active: var(--background-contrast-pink-tuile-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--yellow-tournesol {
|
|||
|
|
color: var(--text-label-yellow-tournesol);
|
|||
|
|
background-color: var(--background-contrast-yellow-tournesol);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-tournesol-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-tournesol-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--yellow-moutarde {
|
|||
|
|
color: var(--text-label-yellow-moutarde);
|
|||
|
|
background-color: var(--background-contrast-yellow-moutarde);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-moutarde-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-moutarde-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--orange-terre-battue {
|
|||
|
|
color: var(--text-label-orange-terre-battue);
|
|||
|
|
background-color: var(--background-contrast-orange-terre-battue);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-orange-terre-battue-hover);
|
|||
|
|
--active: var(--background-contrast-orange-terre-battue-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--brown-cafe-creme {
|
|||
|
|
color: var(--text-label-brown-cafe-creme);
|
|||
|
|
background-color: var(--background-contrast-brown-cafe-creme);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-cafe-creme-hover);
|
|||
|
|
--active: var(--background-contrast-brown-cafe-creme-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--brown-caramel {
|
|||
|
|
color: var(--text-label-brown-caramel);
|
|||
|
|
background-color: var(--background-contrast-brown-caramel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-caramel-hover);
|
|||
|
|
--active: var(--background-contrast-brown-caramel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--brown-opera {
|
|||
|
|
color: var(--text-label-brown-opera);
|
|||
|
|
background-color: var(--background-contrast-brown-opera);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-opera-hover);
|
|||
|
|
--active: var(--background-contrast-brown-opera-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge--beige-gris-galet {
|
|||
|
|
color: var(--text-label-beige-gris-galet);
|
|||
|
|
background-color: var(--background-contrast-beige-gris-galet);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-beige-gris-galet-hover);
|
|||
|
|
--active: var(--background-contrast-beige-gris-galet-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-badge-group .fr-badge {
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
LOGO
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-logo {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--underline-img: none;
|
|||
|
|
display: inline-block;
|
|||
|
|
font-weight: 700;
|
|||
|
|
line-height: 1.0317460317em;
|
|||
|
|
letter-spacing: -0.01em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
text-indent: -0.1em;
|
|||
|
|
font-size: 1.05rem;
|
|||
|
|
color: var(--text-black-white-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo::before {
|
|||
|
|
width: 2.75rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
margin-bottom: 0.3333333333rem;
|
|||
|
|
background-size: 2.75rem 1.125rem, 2.75rem 1rem, 0;
|
|||
|
|
background-position: 0 -0.0625rem, 0 0, 0 0;
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 18'%3E%3Cpath fill='%23fff' d='M11.3 10.2c-.9.6-1.7 1.3-2.3 2.1v-.1c.4-.5.7-1 1-1.5.4-.2.7-.5 1-.8.5-.5 1-1 1.7-1.3.3-.1.5-.1.8 0-.1.1-.2.1-.4.2H13v-.1c-.3.3-.7.5-1 .9-.1.2-.2.6-.7.6 0 .1.1 0 0 0zm1.6 4.6c0-.1-.1 0-.2 0l-.1.1-.1.1-.2.2s.1.1.2 0l.1-.1c.1 0 .2-.1.2-.2.1 0 .1 0 .1-.1 0 .1 0 0 0 0zm-1.6-4.3c.1 0 .2 0 .2-.1s.1-.1.1-.1v-.1c-.2.1-.3.2-.3.3zm2.4 1.9s0-.1 0 0c.1-.1.2-.1.3-.1.7-.1 1.4-.3 2.1-.6-.8-.5-1.7-.9-2.6-1h.1c-.1-.1-.3-.1-.5-.2h.1c-.2-.1-.5-.1-.7-.2.1 0 .2-.2.2-.3h-.1c-.4.2-.6.5-.8.9.2.1.5 0 .7.1h-.3c-.1 0-.2.1-.2.2h.1c-.1 0-.1.1-.2.1.1.1.2 0 .4 0 0 .1.1.1.1.1-.1 0-.2.1-.3.3-.1.2-.2.2-.3.3v.1c-.3.2-.6.5-.9.8v.1c-.1.1-.2.1-.2.2v.1c.4-.1.6-.4 1-.5l.6-.3c.2 0 .3-.1.5-.1v.1h.2c0 .1-.2 0-.1.1s.3.1.4 0c.2-.2.3-.2.4-.2zM12.4 14c-.4.2-.9.2-1.2.4 0 0 0 .1-.1.1 0 0-.1 0-.1.1-.1 0-.1.1-.2.2l-.1.1s0 .1.1 0l.1-.1s-.1.1-.1.2V15.3l-.1.1s0 .1-.1.1l-.1.1.2-.2.1-.1h.2s0-.1.1-.1c.1-.1.2-.2.3-.2h.1c.1-.1.3-.1.4-.2.1-.1.2-.2.3-.2.2-.2.5-.3.8-.5-.1 0-.2-.1-.3-.1 0 .1-.2 0-.3 0zM30 9.7c-.1.2-.4.2-.6.3-.2.2 0 .4.1.5.1.3-.2.5-.4.5.1.1.2.1.2.1 0 .2.2.2.1.4s-.5.3-.3.5c.1.2.1.5 0 .7-.1.2-.3.4-.5.5-.2.1-.4.1-.6 0-.1 0-.1-.1-.2-.1-.5-.1-1-.2-1.5-.2-.1 0-.3.1-.4.1-.1.1-.3.2-.4.3l-.1.1c-.1.1-.2.2-.2.3-.1.2-.2.4-.2.6-.2.5-.2 1 0 1.4 0 0 1 .3 1.7.6.2.1.5.2.7.4l1.7 1H13.2l1.6-1c.6-.4 1.3-.7 2-1 .5-.2 1.1-.5 1.5-.9.2-.2.3-.4.5-.5.3-.4.6-.7 1-1l.3-.3s0-.1.1-.1c-.2.1-.2.2-.4.2 0 0-.1 0 0-.1s.2-.2.3-.2v-.1c-.4 0-.7.2-1 .5h-.2c-.5.2-.8.5-1.2.7v-.1c-.2.1-.4.2-.5.2-.2 0-.5.1-.8 0-.4 0-.7.1-1.1.2-.2.1-.4.1-.6.2v.1l-.2.2c-.2.1-.3.2-.5.4l-.5.5h-.1l.1-.1.1-.1c0-.1.1-.1.1-.2.2-.1.3-.3.5-.4 0 0-.1 0 0 0 0 0 0-.1.1-.1l-.1.1c-.1.1-.1.2-.2.2v-.1-.1l.2-.2c.1-.1.2-.1.3-.2h.1c-.2.1-.3.1-.5.2H14h-.1c0-.1.1-.1.2-.2h.1c1-.8 2.3-.6 3.4-1 .1-.1.2-.1.3-.2.1-.1.3-.2.5-.3.2-.2.4-.4.5-.7v-.1c-.4.4-.8.7-1.3 1-.6.2-1.3.4-2 .4 0-.1.1-.1.1-.1 0-.1.1-.1.1-.2h.1s0-.1.1-.1h.1c-.1-.1-.3.1-.4 0 .1-.1 0-.2.1-.2h.1s0-.1.1-.1c.5-.3.9-.5 1.3-.7-.1 0-.1.1-.2 0 .1 0 0-.1.1-.1.3-.1.6-.3.9-.4-.1 0-.2.1-.3 0 .1 0 .1-.1.2-.1v-.1h0c0-.1.1 0 .2-.1h-.1c.1-.1.2-.2.4-.2 0-.1-.1 0-.1-.1h.1-.5c-.1 0 0-.1 0-.1.1-.2.2-.5.3-.7h-.1c-.3.3-.8.5-1.2.6h-.2c-.2.1-.4.1-.5 0-.1-.1-.2-.2-.3-.2-.2-.1-.5-.3-.8-.4-.7-.2-1.5-.4-2.3-.3.3-.1.7-.2 1.1-.3.5-.2 1-.3 1.5-.3h-.3c-.4 0-.9.1-1.3.2-.3.1-.6.2-.9.2-.2.1-.3.2-.5.2v-.1c.3-.4.7-.7 1.1-.8.5-.1 1.1 0 1.6.1.4 0 .8.1 1.1.2.1 0 .2.2.3.3.2.1.4 0 .5.1v-.2c.1-.1.3 0 .4 0 .2-.2-.2-.4-.3-.6v-.1c.2.2.5.4.7.6.1.1.5.2.5 0-.2-.3-.4-.6-.7-.9v-.2c-.1 0-.1 0-.1-.1-.1-.1-.1-.2-.1-.3-.1-.2 0-.4-.1-.5-.1-.2-.1-.3-.1-.5-.1-.5-.2-1-.3-1.4-.1-.6.3-1 .6-1.5.2-.4.5-.7.8-1 .1-.4.3-.7.6-1 .3-.3.6-.5.9-.6.3-.1.5-.2.8-.3l2.5-.4H25l1.8.3c.1 0 .2 0 .2.1.1.1.3.2.4.2.2.1.4.3.6.5.1.1.2.3.1.4-.1.1-.1.4-.2.4-.2.1-.4.1-.6.1-.1 0-.2 0-.4-.1.5.2.9.4 1.2.8 0 .1.2.1.3.1v.1c-.1.1-.1.1-.1.2h.1c.1-.1.1-.4.3-.3.2.1.2.3.1.4-.1.1-.2.2-.4.3v.2c.1.1.1.2.2.4s.1.5.2.7c.1.5.2.9.2 1.4 0 .2-.1.5 0 .7l.3.6c.1.2.2.3.3.5.2.3.6.6.4 1zm-15.6 5.2c-.1 0-.1.1-.1.1s.1 0 .1-.1zm5.8-1.8c-.1.1 0 0 0 0zm-6.7-.2c0 .1.1 0 .1 0 .2-.1.5 0 .6-.2-.1-.1-.2 0-.2-.1-.1 0-.2 0-.2.1-.1.1-.3.1-.3.2z'/%3E%3Cpath fill='gray' d='M27.9 6.8c.1 0 .3 0 .3.1-.1.2-.4.3-.6.5h-.1c-.1.1-.1.2-.1.2h-.3c.1.1.3.2.5.2l.1.1h.2V8c-.1.1-.2.1-.4.1.2.1.5.1.7 0 .2-.1 0-.4.1-.5-.1 0 0-.1-.1-.1.1-.1.1-.2.2-.2s.1 0 .2-.1c0-.1-.1-.1-.1-.2.2-.1.3-.3.3-.5 0-.1-.3-.1-.4-.2h-.5c-.2 0-.3.1-.5.1l-.6.3c.2-.1.4-.1.7-.2 0 .3.2.3.4.3'/%3E%3C/svg%3E"), linear-gradient(90deg, #000091 0%, #000091 50%, #e1000f 50%, #e1000f 100%), linear-gradient(90deg, #000 0%, #000 100%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-mourning] .fr-logo::before {
|
|||
|
|
background-size: 2.75rem 1.125rem, 0, 2.75rem 1rem;
|
|||
|
|
box-shadow: 0 0 0 1px #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo::after {
|
|||
|
|
min-width: 2.625rem;
|
|||
|
|
background-size: 5.25rem 3.75rem;
|
|||
|
|
background-position: 0 calc(100% + 1.875rem);
|
|||
|
|
padding-top: 2.2083333333rem;
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 252 180'%3E%3Cdefs%3E%3Csymbol id='a' viewBox='0 0 11 15.5'%3E%3Cpath d='M10.4 5.3C11.9 1.5 10.1 0 7.9 0 4.2 0 0 6.5 0 11.7c0 2.5 1.2 3.8 3 3.8 2.1 0 4.3-2 6.2-5.5h-1c-1.2 1.5-2.6 2.6-3.9 2.6-1.3 0-2-.8-2-2.6a10.7 10.7 0 01.3-2.2zm-4-3.1c1.1 0 2 .8 1.5 2.6L3.1 6.1c.8-2.2 2.2-4 3.4-4z'/%3E%3C/symbol%3E%3Csymbol id='b' viewBox='0 0 12.4 21.8'%3E%3Cuse width='11' height='15.5' y='6.4' href='%23a'/%3E%3Cpath d='M7.9 4.7L12.4.6V0h-3L6.7 4.7H8z'/%3E%3C/symbol%3E%3Csymbol id='c' viewBox='0 0 11.5 19'%3E%3Cpath d='M1.7 5.7h2.6L.1 17.1a1.3 1.3 0 001.2 2c3 0 6.4-2.6 7.8-6.2h-.7a9.4 9.4 0 01-5.1 3.5L7 5.7H11l.5-1.6H7.7L9 0H7.6L4.9 4.1l-3.2.4v1.2z'/%3E%3C/symbol%3E%3Csymbol id='d' viewBox='0 0 9.8 21.9'%3E%3Cpath d='M7.6 8c.3-1-.4-1.6-1-1.6-2.2 0-5 2.1-6 5h.7A5.6 5.6 0 014.4 9L.1 20.3a1.1 1.1 0 001 1.6c2.2 0 4.7-2 5.8-5H6A5.6 5.6 0 013 19.5zM8 3.7a1.8 1.8 0 001.8-1.8A1.8 1.8 0 008 0a1.8 1.8 0 00-1.8 1.8A1.8 1.8 0 008 3.6'/%3E%3C/symbol%3E%3Csymbol id='e' viewBox='0 0 14.8 15.5'%3E%3Cpath d='M3.3 3.1c.7 0 1 1 0 3.4l-3 6.8c-.7 1.3 0 2.2 1.2 2.2a1.3 1.3 0 001.5-1l3-8C7.4 4.8 10 3 11 3s.8.6.3 1.6l-4.6 9a1.3 1.3 0 001.1 1.9c2.3 0 5-2 6-5h-.6A5.6 5.6 0 0110 13l4-8a6.1 6.1 0 00.8-2.8A2 2 0 0012.6 0c-2 0-3.6 2.2-6 5V2.8C6.6 1.4 6.1 0 4.8 0 3.2 0 1.8 2.5.7 4.9h.7c.7-1.1 1.3-1.8 2-1.8'/%3E%3C/symbol%3E%3Csymbol id='f' viewBox='0 0 12 15.5'%3E%3Cpath d='M11.8 3.5c.5-1.9.2-3.5-1.2-3.5-1.8 0-2.3 1.2-4 5V2.8C6.5 1.3 6 0 4.6 0 3.1 0 1.7 2.5.5 5h.8C2 3.7 2.8 3 3.3 3c.7 0 1 1 0 3.4l-3 6.8c-.7 1.3 0 2.1 1.2 2.1a1.3 1.3 0 001.5-1l3-8a50.3 50.3 0 012.6-3h3.2z'/%3E%3C/symbol%3E%3Csymbol id='g' viewBox='0 0 14.7 16.2'%3E%3Cpath d='M10.5 13.1c-.6 0-1-1 0-3.4L14.6.1 13.4 0l-1.3 1.3h-.3C6.1 1.3 0 8.6 0 14.2a2 2 0 002.1 2.1c1.7 0 3.3-2.4 5.2-5l-.1 1c-.3 2.6.6 4 2 4 1.5 0 3-2.4 4-4.9h-.7c-.7 1.1-1.5 1.8-2 1.8zM7.9 9.8c-1.3 1.6-3.4 3.5-4.3 3.5-.5 0-.9-.5-.9-1.6 0-3.5 4-8.2 6-8.2a4.2 4.2 0 011.4.2z'/%3E%3C/symbol%3E%3Csymbol id='h' viewBox='0 0 21.9 19.8'%3E%3Cpath d='M11.2 19.8l.3-.9c-3.8-.7-4.3-.7-2.7-4.8l1.4-3.9h3c1.9 0 1.9.9 1.6 3h1l2.6-6.9h-1c-1 1.6-1.8 2.9-3.8 2.9h-3l2-5.6c.8-2 1.1-2.4 3.7-2.4h.7c2.6 0 3 .7 3 3.5h1l.9-4.7H7.3L7 .9c3 .6 3.3.9 2 4.8L5.7 14c-1.5 3.9-2 4.2-5.5 4.8l-.3.9z'/%3E%3C/symbol%3E%3Csymbol id='i' viewBox='0 0 10.1 21.9'%3E%3Cpath d='M2.9 19.4L10.1.3 9.8 0l-5 .6v.6l1 .7c.9.7.6 1.3-.2 3.4L.2 19.9a1.3 1.3 0 001.1 2c2.3 0 4.7-2.1 5.8-5h-.7a6.5 6.5 0 01-3.5 2.5'/%3E%3C/symbol%3E%3Csymbol id='j' viewBox='0 0 18 22'%3E%3Cpath d='M18 .6h-4.3a3.8 3.8 0 00-2.1-.6A6.6 6.6 0 005 6.5a3.3 3.3 0 003 3.6c-1.9.8-3 1.8-3 2.9a1.7 1.7 0 00.9 1.5c-4.3 1.3-6 2.8-6 4.7 0 2 2.6 2.8 5.6 2.8 5.3 0 9.6-2.7 9.6-5.1 0-1.8-1.6-2.5-4.3-3.3-2.2-.7-3.2-.8-3.2-1.6A2.4 2.4 0 019 10.2a6.6 6.6 0 006.1-6.5 4.5 4.5 0 00-.2-1.5h2.5zM9.8 16.2c2.1.7 3 1 3 1.6 0 1.4-2 2.5-5.6 2.5-2.7 0-4-.6-4-2 0-1.5 1.4-2.5 3.5-3.3a21.5 21.5 0 003 1.2zM9 9c-1 0-1.3-.8-1.3-1.7 0-2.8 1.4-6.2 3.5-6.2 1 0 1.3.8 1.3 1.6 0 2.9-1.4 6.3-3.5 6.3z'/%3E%3C/symbol%3E%3Csymbol id='k' viewBox='0 0 23 25.1'%3E%3Cpath d='M14.3 15.6c1.9 0 2 .8 1.6 2.8H17l2.5-6.8h-1c-1 1.6-1.7 2.9-3.8 2.9h-4.1l2-5.6c.7-2 1-2.4 3.7-2.4H18c2.6 0 3 .7 3 3.5h1l.9-4.7H7.3l-.3.9c3 .6 3.3.9 2 4.8l-3.2 8.4c-1.5 3.9-2 4.2-5.6 4.8l-.2 1h17.4l3.2-5h-1.2c-2 2-4 3.8-8 3.8-4.7 0-4.3-.3-2.7-4.6l1.4-3.8h4.2zm2.3-11.8L21 .6V0h-3l-2.6 3.9h1.2v-.1z'/%3E%3C/symbol%3E%3Csymbol id='l' viewBox='0 0 13.6 21.8'%3E%3Cpath d='M11.4 6.4c-2 0-4 2.2-5.8 4.8L9.6.3 9.4 0l-5 .6V1l1 .8c.9.7.6 1.3-.2 3.4L.8 16.8A13.9 13.9 0 000 19c0 1.4 1.8 2.7 3.5 2.7 3.8 0 10-6.9 10-12.2 0-2.3-.5-3.2-2.1-3.2zM4.8 19.5c-.8 0-1.9-.7-1.9-1.3a15.5 15.5 0 01.8-2.2L5 12.7C6.3 11 8.4 9.3 9.6 9.3c.7 0 1.2.4 1.2 1.5 0 3.1-2.9 8.7-6 8.7z'/%3E%3C/symbol%3E%3Csymbol id='m' viewBox='0 0 19.2 19.9'%3E%3Cpath d='M17.6 0H7.3L7 .9c3 .6 3.3.9 2 4.8l-3.2 8.5c-1.5 3.9-2 4.2-5.5 4.8L0 20h15.7l3.5-6H18c-2 2-4.2 4.8-7.7 4.8-2.7 0-3-.5-1.6-4.5l3.1-8.5c1.4-3.9 2-4.2 5.5-4.8z'/%3E%3C/symbol%3E%3Csymbol id='n' viewBox='0 0 126 90'%3E%3Cuse width='12.4' height='21.8' x='112.7' y='66.1' href='
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
[data-fr-theme=dark] .fr-logo::after {
|
|||
|
|
background-position: -2.625rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo--sm {
|
|||
|
|
font-size: 0.7875rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo--sm::before {
|
|||
|
|
width: 2.0625rem;
|
|||
|
|
height: 0.75rem;
|
|||
|
|
margin-bottom: 0.25rem;
|
|||
|
|
background-size: 2.0625rem 0.84375rem, 2.0625rem 0.75rem, 0;
|
|||
|
|
background-position: 0 -0.046875rem, 0 0, 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-mourning] .fr-logo--sm::before {
|
|||
|
|
background-size: 2.0625rem 0.84375rem, 0, 2.0625rem 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo--sm::after {
|
|||
|
|
min-width: 1.96875rem;
|
|||
|
|
background-size: 3.9375rem 2.8125rem;
|
|||
|
|
background-position: 0 calc(100% + 1.40625rem);
|
|||
|
|
padding-top: 1.65625rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
[data-fr-theme=dark] .fr-logo--sm::after {
|
|||
|
|
background-position: -1.96875rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo--lg {
|
|||
|
|
font-size: 1.3125rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo--lg::before {
|
|||
|
|
width: 3.4375rem;
|
|||
|
|
height: 1.25rem;
|
|||
|
|
margin-bottom: 0.4166666667rem;
|
|||
|
|
background-size: 3.4375rem 1.40625rem, 3.4375rem 1.25rem, 0;
|
|||
|
|
background-position: 0 -0.078125rem, 0 0, 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-mourning] .fr-logo--lg::before {
|
|||
|
|
background-size: 3.4375rem 1.40625rem, 0, 3.4375rem 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo--lg::after {
|
|||
|
|
min-width: 3.28125rem;
|
|||
|
|
background-size: 6.5625rem 4.6875rem;
|
|||
|
|
background-position: 0 calc(100% + 2.34375rem);
|
|||
|
|
padding-top: 2.7604166667rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
[data-fr-theme=dark] .fr-logo--lg::after {
|
|||
|
|
background-position: -3.28125rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
BUTTON
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-btn {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
background-color: var(--background-action-high-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-high-blue-france-hover);
|
|||
|
|
--active: var(--background-action-high-blue-france-active);
|
|||
|
|
color: var(--text-inverted-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn::before,
|
|||
|
|
.fr-btn::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--align-on-content {
|
|||
|
|
margin-left: -1rem;
|
|||
|
|
margin-right: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn[class^=fr-icon-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn[class*=" fr-icon-"]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn[class^=fr-fi-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn[class*=" fr-fi-"]:not([class*=fr-btn--icon-]) {
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn[class^=fr-icon-]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn[class*=" fr-icon-"]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn[class^=fr-fi-]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn[class*=" fr-fi-"]:not([class*=fr-btn--icon-])::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--align-on-content[class^=fr-icon-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--align-on-content[class*=" fr-icon-"]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--align-on-content[class^=fr-fi-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--align-on-content[class*=" fr-fi-"]:not([class*=fr-btn--icon-]) {
|
|||
|
|
margin-left: -0.5rem;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-btn--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-btn--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-btn--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btn--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-btn--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-left[class*=" fr-fi-"] {
|
|||
|
|
margin-left: -0.875rem;
|
|||
|
|
margin-right: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-btn--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-btn--icon-right[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--icon-right[class^=fr-icon-]::after,
|
|||
|
|
.fr-btn--icon-right[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-btn--icon-right[class^=fr-fi-]::after,
|
|||
|
|
.fr-btn--icon-right[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--icon-right[class^=fr-icon-]::before,
|
|||
|
|
.fr-btn--icon-right[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btn--icon-right[class^=fr-fi-]::before,
|
|||
|
|
.fr-btn--icon-right[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-btn--align-on-content.fr-btn--icon-right[class*=" fr-fi-"] {
|
|||
|
|
margin-left: -1rem;
|
|||
|
|
margin-right: -0.875rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content {
|
|||
|
|
margin-left: -0.75rem;
|
|||
|
|
margin-right: -0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm[class^=fr-icon-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--sm[class*=" fr-icon-"]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--sm[class^=fr-fi-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--sm[class*=" fr-fi-"]:not([class*=fr-btn--icon-]) {
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm[class^=fr-icon-]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn--sm[class*=" fr-icon-"]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn--sm[class^=fr-fi-]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn--sm[class*=" fr-fi-"]:not([class*=fr-btn--icon-])::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content[class^=fr-icon-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content[class*=" fr-icon-"]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content[class^=fr-fi-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content[class*=" fr-fi-"]:not([class*=fr-btn--icon-]) {
|
|||
|
|
margin-left: -0.5rem;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-left[class*=" fr-fi-"] {
|
|||
|
|
margin-left: -0.625rem;
|
|||
|
|
margin-right: -0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class^=fr-icon-]::after,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class^=fr-fi-]::after,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class^=fr-icon-]::before,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class^=fr-fi-]::before,
|
|||
|
|
.fr-btn--sm.fr-btn--icon-right[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-btn--sm.fr-btn--align-on-content.fr-btn--icon-right[class*=" fr-fi-"] {
|
|||
|
|
margin-left: -0.75rem;
|
|||
|
|
margin-right: -0.625rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-right: -0.1875rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content {
|
|||
|
|
margin-left: -1.5rem;
|
|||
|
|
margin-right: -1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg[class^=fr-icon-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--lg[class*=" fr-icon-"]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--lg[class^=fr-fi-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--lg[class*=" fr-fi-"]:not([class*=fr-btn--icon-]) {
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 3rem;
|
|||
|
|
max-height: 3rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg[class^=fr-icon-]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn--lg[class*=" fr-icon-"]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn--lg[class^=fr-fi-]:not([class*=fr-btn--icon-])::before,
|
|||
|
|
.fr-btn--lg[class*=" fr-fi-"]:not([class*=fr-btn--icon-])::before {
|
|||
|
|
--icon-size: 2rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content[class^=fr-icon-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content[class*=" fr-icon-"]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content[class^=fr-fi-]:not([class*=fr-btn--icon-]),
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content[class*=" fr-fi-"]:not([class*=fr-btn--icon-]) {
|
|||
|
|
margin-left: -0.5rem;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: -0.1875rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-left[class*=" fr-fi-"] {
|
|||
|
|
margin-left: -1.3125rem;
|
|||
|
|
margin-right: -1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class^=fr-icon-]::after,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class^=fr-fi-]::after,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-right: -0.1875rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class^=fr-icon-]::before,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class^=fr-fi-]::before,
|
|||
|
|
.fr-btn--lg.fr-btn--icon-right[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-btn--lg.fr-btn--align-on-content.fr-btn--icon-right[class*=" fr-fi-"] {
|
|||
|
|
margin-left: -1.5rem;
|
|||
|
|
margin-right: -1.3125rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: stretch;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin-left: -0.5rem;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--inline : aligne les boutons horizontalement dans tout les cas
|
|||
|
|
* fr-btns-group--inline-(sm/md/lg) : permet de passer en horizontal à partir de la valeur du breakpoint appliqué (sm, md, lg)
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--left : (Défaut) aligne les boutons sur la gauche (en lecture L-t-R)
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--right : aligne les boutons sur la droite
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--center : aligne les boutons au centre du conteneur
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--center : aligne les boutons au centre du conteneur
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--equisized : Fixe la largeur des boutons à celle du plus grand. Géré en grande partie en JS.
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--sm : Fixe les boutons à la taille SM
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--md : (défaut) Fixe les boutons à la taille MD
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fr-btns-group--lg : Fixe les boutons à la taille LG (sans modfifieur => MD)
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group > li,
|
|||
|
|
.fr-btns-group > div {
|
|||
|
|
width: 100%;
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group .fr-btn {
|
|||
|
|
width: calc(100% - 1rem);
|
|||
|
|
margin: 0 0.5rem 1rem;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline.fr-btns-group--right.fr-btns-group--inline-reverse {
|
|||
|
|
flex-direction: row-reverse;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--left,
|
|||
|
|
.fr-btns-group--left li {
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
text-align: left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--right,
|
|||
|
|
.fr-btns-group--right li {
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--center,
|
|||
|
|
.fr-btns-group--center li {
|
|||
|
|
justify-content: center;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--between,
|
|||
|
|
.fr-btns-group--between li {
|
|||
|
|
justify-content: space-between;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--equisized {
|
|||
|
|
--equisized-width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--equisized .fr-btn {
|
|||
|
|
justify-content: center;
|
|||
|
|
width: var(--equisized-width);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--sm .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group--sm:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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-"]::before,
|
|||
|
|
.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-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-left .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class^=fr-icon-]::after,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class^=fr-fi-]::after,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-btns-group--sm.fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.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:not(.fr-btns-group--sm):not(.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:not(.fr-btns-group--sm):not(.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:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-left .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class^=fr-icon-]::after,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class^=fr-fi-]::after,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg).fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--lg .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group--lg:not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 3rem;
|
|||
|
|
max-height: 3rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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-"]::before,
|
|||
|
|
.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-"]::before {
|
|||
|
|
--icon-size: 2rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-left .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: -0.1875rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class^=fr-icon-]::after,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class^=fr-fi-]::after,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-right: -0.1875rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-btns-group--lg.fr-btns-group--icon-right .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element > .fr-btns-group {
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--close {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
display: flex;
|
|||
|
|
margin-left: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--close::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--close::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tooltip {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tooltip::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/question-line.svg");
|
|||
|
|
mask-image: url("../icons/system/question-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--fullscreen {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--fullscreen::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/media/fullscreen-line.svg");
|
|||
|
|
mask-image: url("../icons/media/fullscreen-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--fullscreen::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--display {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--display::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--theme-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--theme-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--account {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--account::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/user/account-circle-fill.svg");
|
|||
|
|
mask-image: url("../icons/user/account-circle-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--team {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--team::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/user/team-line.svg");
|
|||
|
|
mask-image: url("../icons/user/team-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--briefcase {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--briefcase::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/business/briefcase-fill.svg");
|
|||
|
|
mask-image: url("../icons/business/briefcase-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn:disabled,
|
|||
|
|
a.fr-btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--secondary {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--secondary:disabled,
|
|||
|
|
a.fr-btn--secondary:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary,
|
|||
|
|
.fr-btn--account {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:disabled,
|
|||
|
|
a.fr-btn--tertiary:not([href]),
|
|||
|
|
a.fr-btn--account:not([href]),
|
|||
|
|
.fr-btn--account:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary-no-outline,
|
|||
|
|
.fr-btn--close,
|
|||
|
|
.fr-btn--display,
|
|||
|
|
.fr-btn--fullscreen,
|
|||
|
|
.fr-btn--tooltip,
|
|||
|
|
.fr-btn--briefcase,
|
|||
|
|
.fr-btn--team {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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]),
|
|||
|
|
a.fr-btn--tooltip:not([href]),
|
|||
|
|
a.fr-btn--briefcase:not([href]),
|
|||
|
|
a.fr-btn--team:not([href]),
|
|||
|
|
.fr-btn--close:disabled,
|
|||
|
|
.fr-btn--display:disabled,
|
|||
|
|
.fr-btn--fullscreen:disabled,
|
|||
|
|
.fr-btn--tooltip:disabled,
|
|||
|
|
.fr-btn--briefcase:disabled,
|
|||
|
|
.fr-btn--team:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
CONNECT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-connect {
|
|||
|
|
position: relative;
|
|||
|
|
padding: 0.625em 0.75em 0.625em 4em;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
--active-tint: var(--active);
|
|||
|
|
--external-link-content: none;
|
|||
|
|
background-color: var(--background-action-high-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-high-blue-france-hover);
|
|||
|
|
--active: var(--background-action-high-blue-france-active);
|
|||
|
|
color: var(--text-inverted-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect:hover {
|
|||
|
|
background-color: var(--hover-tint);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect:active {
|
|||
|
|
background-color: var(--active-tint);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 50%;
|
|||
|
|
bottom: 0.25em;
|
|||
|
|
left: 0.75em;
|
|||
|
|
width: 2.5em;
|
|||
|
|
height: 3em;
|
|||
|
|
margin-top: -1.5em;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 48'%3E%3Cpath fill='%232a2f82' d='M34.965 15.1 19.971 6.423 4.977 15.184a.606.606 0 0 0-.306.524v16.948a.666.666 0 0 0 .306.524l14.992 8.6 14.994-8.706a.665.665 0 0 0 .306-.524V15.628a.605.605 0 0 0-.304-.528Z'/%3E%3Cpath fill='%23df1f26' d='m14.614 15.6-5.029 8.628-4.557-9.175 5.39-3.113 4.489 3.16ZM35.27 32.58V15.622a.6.6 0 0 0-.306-.523L19.971 6.423'/%3E%3Cpath fill='%232e65b0' d='m4.673 32.58 15.3-26.157v35.362L4.977 33.18a.666.666 0 0 1-.306-.524V15.708Zm24.669-20.735L34.8 15l-4.489 9.15-5.387-9.236Z'/%3E%3Cpath fill='%23fff' d='m39.606 12.305-19.19-11.02a.933.933 0 0 0-.832 0L.394 12.305A.886.886 0 0 0 0 13v22a.886.886 0 0 0 .394.7l19.189 11.02a.933.933 0 0 0 .832 0L39.606 35.7A.886.886 0 0 0 40 35V13a.886.886 0 0 0-.394-.695ZM10.762 30.061h.079c-.042 0-.079.007-.079.05 0 .1.151 0 .2.1a.912.912 0 0 0-.629.276c0 .051.1.051.151.051-.075.1-.226.05-.277.151a.177.177 0 0 0 .1.05c-.05 0-.1 0-.1.051v.151c-.126 0-.176.1-.277.151.2.151.327 0 .528 0-.528.2-.956.478-1.484.629-.1 0 0 .151-.1.151.151.1.227-.05.377-.05-.654.377-1.333.7-2.037 1.132a.351.351 0 0 0-.1.2h-.2c-.1.05-.05.176-.151.277.226.151.5-.2.654 0 .05 0-.1.05-.2.05-.05 0-.05.1-.1.1h-.154c-.1.075-.2.126-.2.276a.219.219 0 0 0-.226.1 9.034 9.034 0 0 0 3.144-.578 7.685 7.685 0 0 0 2.088-1.559.176.176 0 0 1 .05.1 2.168 2.168 0 0 1-.806 1.08c-.277.151-.478.377-.7.478a4.045 4.045 0 0 0-.428.276 10.761 10.761 0 0 1-1.939.412l-.305.044c-.225.033-.449.069-.671.108L4.977 33.18a.648.648 0 0 1-.288-.411.574.574 0 0 0 .094-.063.265.265 0 0 0-.113-.071v-.65a12.786 12.786 0 0 0 3.038-.942A8.746 8.746 0 0 0 4.671 29.7v-1.515a11.662 11.662 0 0 1 1.639.392 6.415 6.415 0 0 1 1.182.578 3.113 3.113 0 0 0 .478.377.91.91 0 0 0 .8.05h.33a3.961 3.961 0 0 0 1.937-.905c0 .05.05.05.1.05a3.63 3.63 0 0 1-.428 1.132c.003.051-.048.152.053.202Zm2.817 3.571c.251-.1.4-.277.629-.377-.05.05-.05.151-.1.2a3.691 3.691 0 0 0-.528.4 15.96 15.96 0 0 0-1.585 1.61c-.252.3-.528.578-.8.855a2.385 2.385 0 0 1-.31.245l-2.527-1.45a4.047 4.047 0 0 0 1.076-.053 4.984 4.984 0 0 0 .855-.327v.1c.7-.277 1.232-.906 1.937-1.132.025 0 .126.1.226.05a1.883 1.883 0 0 1 1.509-.7c0 .05 0 .1.05.1h.025c-.151.126-.327.251-.5.377-.057.052-.007.102.043.102Zm-8.908-6.164v-.186a5.814 5.814 0 0 1 1.588-.188 1.52 1.52 0 0 1 .478 0 5.861 5.861 0 0 0-2.066.374Zm30.6 5.088a.665.665 0 0 1-.306.524l-10.079 5.851a32.3 32.3 0 0 1-3.408-1.185 2.826 2.826 0 0 1-.05-2.245 3.794 3.794 0 0 1 .352-.883c.025-.025.05-.05.05-.076a.025.025 0 0 0 .025-.025 4.316 4.316 0 0 1 .377-.555l.015-.015.02-.021.015-.015c0-.025.025-.05.05-.076.025-.051.075-.076.1-.126a3.771 3.771 0 0 1 .579-.5 4.07 4.07 0 0 1 .654-.177 19.817 19.817 0 0 1 2.415.328.751.751 0 0 1 .277.1 1.849 1.849 0 0 0 .905-.05 1.137 1.137 0 0 0 .855-.706 1.212 1.212 0 0 0 .05-1.059c-.178-.276-.013-.437.181-.59l.068-.055a1.17 1.17 0 0 0 .231-.216c.126-.252-.1-.4-.151-.63-.05-.1-.226-.05-.327-.2.352-.151.855-.429.629-.857-.151-.227-.377-.63-.1-.857.352-.2.855-.151 1.006-.479a1.138 1.138 0 0 0-.292-1.085l-.075-.108a4.754 4.754 0 0 1-.211-.32 6.914 6.914 0 0 0-.528-.757 4.3 4.3 0 0 1-.528-1.009c-.151-.378.05-.706.05-1.084a6.347 6.347 0 0 0-.327-2.144c-.126-.353-.176-.731-.327-1.059a1.12 1.12 0 0 0-.226-.58.375.375 0 0 1 0-.328 4.874 4.874 0 0 0 .579-.479.567.567 0 0 0-.2-.706c-.327-.151-.3.328-.528.429h-.151c-.05-.126.05-.177.151-.277 0-.05 0-.151-.05-.151-.2 0-.377-.051-.428-.151a3.957 3.957 0 0 0-1.861-1.286 2.319 2.319 0 0 0 .579.1 1.67 1.67 0 0 0 1.006-.1c.227-.076.277-.479.377-.706a.8.8 0 0 0-.151-.631 2.189 2.189 0 0 0-.906-.756 9.13 9.13 0 0 1-.679-.353.952.952 0 0 0-.251-.126c-2.965-1.485-9.069-.2-9.534 0h-.009a8.244 8.244 0 0 0-1.249.475 3.922 3.922 0 0 0-2.365 2.465 3.829 3.829 0 0 0-1.333 1.509c-.428.8-1.056 1.509-.956 2.414.1.78.277 1.484.428 2.289a4.668 4.668 0 0 0 .2.8c.1.276 0 .629.151.855.075.151.025.327.227.428v.2c.05.05.05.1.151.1v.2a6.446 6.446 0 0 1 1.107 1.434c.1.276-.478.151-.7.05a5.979 5.979 0 0 1-1.132-.956.175.175 0 0 0-.051.1c.2.352.906.78.528 1.006-.2.1-.428-.
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: 50% 50%;
|
|||
|
|
background-size: 2.5em 3em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect__login,
|
|||
|
|
.fr-connect__brand {
|
|||
|
|
line-height: 1;
|
|||
|
|
z-index: 1;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect__login {
|
|||
|
|
font-size: 1.0625em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect__brand {
|
|||
|
|
font-weight: bold;
|
|||
|
|
font-size: 1.125em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect--plus {
|
|||
|
|
padding-right: 3em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect--plus::after {
|
|||
|
|
content: "+";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
right: 0.25em;
|
|||
|
|
bottom: 0;
|
|||
|
|
font-size: 3em;
|
|||
|
|
font-weight: bold;
|
|||
|
|
line-height: 1;
|
|||
|
|
transform: translate(5%, -17%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect-group {
|
|||
|
|
--text-spacing: 0 0 1rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect-group p {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect-group .fr-connect + p a {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect:disabled,
|
|||
|
|
a.fr-connect:not([href]) {
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
QUOTE
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-quote {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 0 0.5rem 2rem 0.5rem;
|
|||
|
|
background-size: 50% 1px;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: 0.5rem 100%;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote::before,
|
|||
|
|
.fr-quote::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/editor/fr--quote-line.svg");
|
|||
|
|
mask-image: url("../icons/editor/fr--quote-line.svg");
|
|||
|
|
--icon-size: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
color: var(--artwork-minor-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column .fr-quote__author {
|
|||
|
|
margin-left: 5.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column .fr-quote__source {
|
|||
|
|
margin-left: 5.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column figcaption {
|
|||
|
|
min-height: 4.25rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote blockquote {
|
|||
|
|
margin: 0;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote blockquote p {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote__author {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote__image {
|
|||
|
|
width: 4.25rem;
|
|||
|
|
background-size: cover;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
overflow: hidden;
|
|||
|
|
position: absolute;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote__image img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote cite {
|
|||
|
|
font-style: italic;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote figcaption {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote figcaption .fr-quote__source {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote figcaption .fr-quote__source li {
|
|||
|
|
display: inline-block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote figcaption .fr-quote__source li:not(:last-child)::after {
|
|||
|
|
content: "·";
|
|||
|
|
display: inline-block;
|
|||
|
|
padding-left: 0.25rem;
|
|||
|
|
padding-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--green-tilleul-verveine::before {
|
|||
|
|
color: var(--artwork-minor-green-tilleul-verveine);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--green-bourgeon::before {
|
|||
|
|
color: var(--artwork-minor-green-bourgeon);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--green-emeraude::before {
|
|||
|
|
color: var(--artwork-minor-green-emeraude);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--green-menthe::before {
|
|||
|
|
color: var(--artwork-minor-green-menthe);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--green-archipel::before {
|
|||
|
|
color: var(--artwork-minor-green-archipel);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--blue-ecume::before {
|
|||
|
|
color: var(--artwork-minor-blue-ecume);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--blue-cumulus::before {
|
|||
|
|
color: var(--artwork-minor-blue-cumulus);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--purple-glycine::before {
|
|||
|
|
color: var(--artwork-minor-purple-glycine);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--pink-macaron::before {
|
|||
|
|
color: var(--artwork-minor-pink-macaron);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--pink-tuile::before {
|
|||
|
|
color: var(--artwork-minor-pink-tuile);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--yellow-tournesol::before {
|
|||
|
|
color: var(--artwork-minor-yellow-tournesol);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--yellow-moutarde::before {
|
|||
|
|
color: var(--artwork-minor-yellow-moutarde);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--orange-terre-battue::before {
|
|||
|
|
color: var(--artwork-minor-orange-terre-battue);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--brown-cafe-creme::before {
|
|||
|
|
color: var(--artwork-minor-brown-cafe-creme);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--brown-caramel::before {
|
|||
|
|
color: var(--artwork-minor-brown-caramel);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--brown-opera::before {
|
|||
|
|
color: var(--artwork-minor-brown-opera);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--beige-gris-galet::before {
|
|||
|
|
color: var(--artwork-minor-beige-gris-galet);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote__source {
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
BREADCRUMB
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
un padding de 4px et une marge négative en compensation sont mis en place afin d'éviter de couper le focus.
|
|||
|
|
*/
|
|||
|
|
.fr-breadcrumb {
|
|||
|
|
margin: 1rem 0 2rem;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 0.5rem;
|
|||
|
|
position: relative;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__button {
|
|||
|
|
background-image: var(--underline-img), var(--underline-img);
|
|||
|
|
background-position: var(--underline-x) 100%, var(--underline-x) calc(100% - var(--underline-thickness));
|
|||
|
|
background-repeat: no-repeat, no-repeat;
|
|||
|
|
transition: background-size 0s;
|
|||
|
|
background-size: var(--underline-hover-width) calc(var(--underline-thickness) * 2), var(--underline-idle-width) var(--underline-thickness);
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 0;
|
|||
|
|
|
|||
|
|
--hover-tint: var(--idle);
|
|||
|
|
--active-tint: var(--idle);
|
|||
|
|
color: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__button:hover,
|
|||
|
|
.fr-breadcrumb__button:active {
|
|||
|
|
--underline-hover-width: var(--underline-max-width);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__button[aria-expanded=true] {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb .fr-collapse {
|
|||
|
|
margin-left: -4px;
|
|||
|
|
margin-right: -4px;
|
|||
|
|
padding-left: 4px;
|
|||
|
|
padding-right: 4px;
|
|||
|
|
transform: translateY(-4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__list {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
transform: translateY(4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__list li {
|
|||
|
|
display: inline;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* flèche séparatrice en font-icon
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__list li:not(:first-child)::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
vertical-align: -0.0625em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__link {
|
|||
|
|
vertical-align: top;
|
|||
|
|
position: relative;
|
|||
|
|
background-image: var(--underline-img), var(--underline-img);
|
|||
|
|
background-position: var(--underline-x) 100%, var(--underline-x) calc(100% - var(--underline-thickness));
|
|||
|
|
background-repeat: no-repeat, no-repeat;
|
|||
|
|
transition: background-size 0s;
|
|||
|
|
background-size: var(--underline-hover-width) calc(var(--underline-thickness) * 2), var(--underline-idle-width) var(--underline-thickness);
|
|||
|
|
|
|||
|
|
--hover-tint: var(--idle);
|
|||
|
|
--active-tint: var(--idle);
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__link:hover,
|
|||
|
|
.fr-breadcrumb__link:active {
|
|||
|
|
--underline-hover-width: var(--underline-max-width);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__link[aria-current]:not([aria-current=false]) {
|
|||
|
|
pointer-events: none;
|
|||
|
|
cursor: default;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
FORM
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-label {
|
|||
|
|
display: block;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
color: var(--text-label-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-label + .fr-input,
|
|||
|
|
.fr-label + .fr-input-wrap,
|
|||
|
|
.fr-label + .fr-select {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-hint-text {
|
|||
|
|
display: block;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-hint-text + .fr-hint-text {
|
|||
|
|
margin-top: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0 -0.75rem 1rem;
|
|||
|
|
padding: 0 0.25rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-end;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
border: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__legend {
|
|||
|
|
padding-bottom: 1rem;
|
|||
|
|
padding-left: 0.75rem;
|
|||
|
|
padding-right: 0.75rem;
|
|||
|
|
margin-left: -0.25rem;
|
|||
|
|
margin-right: -0.25rem;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
width: 100%;
|
|||
|
|
color: var(--text-label-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__legend--regular {
|
|||
|
|
font-weight: 400;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__legend .fr-hint-text {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid,
|
|||
|
|
.fr-fieldset--error,
|
|||
|
|
.fr-fieldset--info {
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: 0 -2.25rem;
|
|||
|
|
background-size: 2px calc(100% + 1.25rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-fieldset__legend,
|
|||
|
|
.fr-fieldset--error .fr-fieldset__legend,
|
|||
|
|
.fr-fieldset--info .fr-fieldset__legend {
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: 0 0;
|
|||
|
|
background-size: 2px 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element {
|
|||
|
|
flex: 1 1 100%;
|
|||
|
|
max-width: 100%;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--inline {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--inline-grow,
|
|||
|
|
.fr-fieldset__element--inline\@md.fr-fieldset__element--inline-grow {
|
|||
|
|
flex-grow: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--year {
|
|||
|
|
flex: 0 0 8rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--year:not(.fr-fieldset__element--inline) {
|
|||
|
|
margin-right: calc(100% - 8rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--postal {
|
|||
|
|
flex: 0 0 16rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--postal:not(.fr-fieldset__element--inline) {
|
|||
|
|
margin-right: calc(100% - 16rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--number {
|
|||
|
|
flex: 0 0 6rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__element--number:not(.fr-fieldset__element--inline) {
|
|||
|
|
margin-right: calc(100% - 6rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__legend > h1:last-child::after,
|
|||
|
|
.fr-fieldset__legend > h2:last-child::after,
|
|||
|
|
.fr-fieldset__legend > h3:last-child::after,
|
|||
|
|
.fr-fieldset__legend > h4:last-child::after,
|
|||
|
|
.fr-fieldset__legend > h5:last-child::after,
|
|||
|
|
.fr-fieldset__legend > h6:last-child::after,
|
|||
|
|
.fr-fieldset__legend > p:last-child::after,
|
|||
|
|
.fr-fieldset__legend > .fr-fieldset:last-child::after,
|
|||
|
|
.fr-fieldset__element > h1:last-child::after,
|
|||
|
|
.fr-fieldset__element > h2:last-child::after,
|
|||
|
|
.fr-fieldset__element > h3:last-child::after,
|
|||
|
|
.fr-fieldset__element > h4:last-child::after,
|
|||
|
|
.fr-fieldset__element > h5:last-child::after,
|
|||
|
|
.fr-fieldset__element > h6:last-child::after,
|
|||
|
|
.fr-fieldset__element > p:last-child::after,
|
|||
|
|
.fr-fieldset__element > .fr-fieldset:last-child::after {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset > .fr-messages-group {
|
|||
|
|
flex: 1 1 100%;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset > .fr-messages-group > .fr-message:last-child {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message {
|
|||
|
|
--comma: ", ";
|
|||
|
|
--content: var(--comma);
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
margin: 0 0 0.25rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message::after {
|
|||
|
|
content: var(--content);
|
|||
|
|
position: absolute;
|
|||
|
|
width: 1px;
|
|||
|
|
height: 1px;
|
|||
|
|
padding: 0;
|
|||
|
|
margin: -1px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
clip: rect(0, 0, 0, 0);
|
|||
|
|
white-space: nowrap; /* added line */
|
|||
|
|
border: 0;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message:last-child {
|
|||
|
|
--comma: ". ";
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--error::before,
|
|||
|
|
.fr-message--valid::before,
|
|||
|
|
.fr-message--info::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
display: inline-block;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
margin-top: 0.125rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--error::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--valid::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--info::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--valid label,
|
|||
|
|
.fr-input-group--valid label,
|
|||
|
|
.fr-range-group--valid label,
|
|||
|
|
.fr-upload-group--valid label {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--error label,
|
|||
|
|
.fr-input-group--error label,
|
|||
|
|
.fr-range-group--error label,
|
|||
|
|
.fr-upload-group--error label {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--info label,
|
|||
|
|
.fr-input-group--info label,
|
|||
|
|
.fr-range-group--info label,
|
|||
|
|
.fr-upload-group--info label {
|
|||
|
|
color: var(--text-default-info);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--disabled label,
|
|||
|
|
.fr-select-group--disabled .fr-hint-text,
|
|||
|
|
.fr-input-group--disabled label,
|
|||
|
|
.fr-input-group--disabled .fr-hint-text,
|
|||
|
|
.fr-range-group--disabled label,
|
|||
|
|
.fr-range-group--disabled .fr-hint-text,
|
|||
|
|
.fr-upload-group--disabled label,
|
|||
|
|
.fr-upload-group--disabled .fr-hint-text {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-label--error {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-label--success {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-label--info {
|
|||
|
|
color: var(--text-default-info);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-label--disabled,
|
|||
|
|
.fr-label--disabled .fr-hint-text {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-hint-text,
|
|||
|
|
.fr-message {
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--error {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--valid {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--info {
|
|||
|
|
color: var(--text-default-info);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset:disabled .fr-label,
|
|||
|
|
.fr-fieldset:disabled .fr-hint-text,
|
|||
|
|
.fr-fieldset:disabled .fr-fieldset__legend {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset input:disabled + label,
|
|||
|
|
.fr-fieldset input:disabled + label .fr-hint-text,
|
|||
|
|
.fr-fieldset input:disabled + label + .fr-hint-text {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error,
|
|||
|
|
.fr-fieldset--error .fr-fieldset__legend {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-fieldset__legend,
|
|||
|
|
.fr-fieldset--error .fr-label {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid,
|
|||
|
|
.fr-fieldset--valid .fr-fieldset__legend {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-fieldset__legend,
|
|||
|
|
.fr-fieldset--valid .fr-label {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info,
|
|||
|
|
.fr-fieldset--info .fr-fieldset__legend {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-info), var(--border-plain-info));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-fieldset__legend,
|
|||
|
|
.fr-fieldset--info .fr-label {
|
|||
|
|
color: var(--text-default-info);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group:not(:last-child),
|
|||
|
|
.fr-input-group:not(:last-child) {
|
|||
|
|
margin-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group .fr-label .fr-hint-text,
|
|||
|
|
.fr-input-group .fr-label .fr-hint-text {
|
|||
|
|
margin-top: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-fieldset__content {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: baseline;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin: -0.75rem 0.5rem 0 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-checkbox-group {
|
|||
|
|
display: inline-flex;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-checkbox-group:first-child {
|
|||
|
|
margin-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-checkbox-group:not(:last-child) {
|
|||
|
|
margin-right: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-checkbox-group:last-child {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-radio-group {
|
|||
|
|
display: inline-flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-radio-group:not(:last-child) {
|
|||
|
|
margin-right: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-radio-group:first-child {
|
|||
|
|
margin-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-radio-group:last-child {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__content {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0 0.5rem;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__content .fr-radio-group:first-child,
|
|||
|
|
.fr-fieldset__content .fr-checkbox-group:first-child {
|
|||
|
|
margin-top: -0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__content .fr-radio-group label,
|
|||
|
|
.fr-fieldset__content .fr-checkbox-group label {
|
|||
|
|
padding: 0.75rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__content .fr-radio-group:not(.fr-radio-rich) input[type=radio] + label::before,
|
|||
|
|
.fr-fieldset__content .fr-checkbox-group input[type=checkbox] + label::before {
|
|||
|
|
top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__content + .fr-error-text,
|
|||
|
|
.fr-fieldset__content + .fr-valid-text,
|
|||
|
|
.fr-fieldset__content + .fr-info-text {
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-error-text,
|
|||
|
|
.fr-valid-text,
|
|||
|
|
.fr-info-text {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-error-text::before,
|
|||
|
|
.fr-valid-text::before,
|
|||
|
|
.fr-info-text::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
display: inline-block;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-error-text + .fr-error-text,
|
|||
|
|
.fr-error-text + .fr-valid-text,
|
|||
|
|
.fr-error-text + .fr-info-text,
|
|||
|
|
.fr-valid-text + .fr-error-text,
|
|||
|
|
.fr-valid-text + .fr-valid-text,
|
|||
|
|
.fr-valid-text + .fr-info-text,
|
|||
|
|
.fr-info-text + .fr-error-text,
|
|||
|
|
.fr-info-text + .fr-valid-text,
|
|||
|
|
.fr-info-text + .fr-info-text {
|
|||
|
|
margin-top: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-error-text::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-valid-text::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-info-text::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-error-text {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-valid-text {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-info-text {
|
|||
|
|
color: var(--text-default-info);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-fieldset__content::before {
|
|||
|
|
box-shadow: inset 2px 0 0 0 var(--border-plain-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-fieldset__content::before {
|
|||
|
|
box-shadow: inset 2px 0 0 0 var(--border-plain-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-fieldset__content::before {
|
|||
|
|
box-shadow: inset 2px 0 0 0 var(--border-plain-info);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
STEPPER
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-stepper {
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__title {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column-reverse;
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
|
|||
|
|
--title-spacing: 0 0 0.75rem 0;
|
|||
|
|
--text-spacing: 0 0 0.75rem 0;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__state {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
|
|||
|
|
--title-spacing: 0 0 0.25rem 0;
|
|||
|
|
--text-spacing: 0 0 0.25rem 0;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__state::after {
|
|||
|
|
content: "\a";
|
|||
|
|
white-space: pre;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__details {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper .fr-stepper__steps[data-fr-steps="2"][data-fr-current-step="2"] + .fr-stepper__details,
|
|||
|
|
.fr-stepper .fr-stepper__steps[data-fr-steps="3"][data-fr-current-step="3"] + .fr-stepper__details,
|
|||
|
|
.fr-stepper .fr-stepper__steps[data-fr-steps="4"][data-fr-current-step="4"] + .fr-stepper__details,
|
|||
|
|
.fr-stepper .fr-stepper__steps[data-fr-steps="5"][data-fr-current-step="5"] + .fr-stepper__details,
|
|||
|
|
.fr-stepper .fr-stepper__steps[data-fr-steps="6"][data-fr-current-step="6"] + .fr-stepper__details,
|
|||
|
|
.fr-stepper .fr-stepper__steps[data-fr-steps="7"][data-fr-current-step="7"] + .fr-stepper__details,
|
|||
|
|
.fr-stepper .fr-stepper__steps[data-fr-steps="8"][data-fr-current-step="8"] + .fr-stepper__details {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps {
|
|||
|
|
--stepper-size: 0.5rem;
|
|||
|
|
--default-outer: calc((100% + var(--stepper-size)) / var(--steps));
|
|||
|
|
--default-inner: calc(var(--default-outer) - var(--stepper-size));
|
|||
|
|
--active-outer: calc((100% + var(--stepper-size)) / var(--current-step));
|
|||
|
|
--active-inner: calc(var(--active-outer) - var(--stepper-size));
|
|||
|
|
width: 100%;
|
|||
|
|
height: var(--stepper-size);
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: calc((100% + var(--stepper-size)) * var(--current-step) / var(--steps) - var(--stepper-size)) 100%, 100% 100%;
|
|||
|
|
background-position: 0 0, 0 0;
|
|||
|
|
|
|||
|
|
--current-step: 0;
|
|||
|
|
background-image: repeating-linear-gradient(to right, var(--background-active-blue-france) 0, var(--background-active-blue-france) var(--active-inner), transparent var(--active-inner), transparent var(--active-outer)), repeating-linear-gradient(to right, var(--background-contrast-grey) 0, var(--background-contrast-grey) var(--default-inner), transparent var(--default-inner), transparent var(--default-outer));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-steps="2"] {
|
|||
|
|
--steps: 2;
|
|||
|
|
--step-width: calc(100% / 2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-steps="3"] {
|
|||
|
|
--steps: 3;
|
|||
|
|
--step-width: calc(100% / 3);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-steps="4"] {
|
|||
|
|
--steps: 4;
|
|||
|
|
--step-width: calc(100% / 4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-steps="5"] {
|
|||
|
|
--steps: 5;
|
|||
|
|
--step-width: calc(100% / 5);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-steps="6"] {
|
|||
|
|
--steps: 6;
|
|||
|
|
--step-width: calc(100% / 6);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-steps="7"] {
|
|||
|
|
--steps: 7;
|
|||
|
|
--step-width: calc(100% / 7);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-steps="8"] {
|
|||
|
|
--steps: 8;
|
|||
|
|
--step-width: calc(100% / 8);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="1"] {
|
|||
|
|
--current-step: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="2"] {
|
|||
|
|
--current-step: 2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="3"] {
|
|||
|
|
--current-step: 3;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="4"] {
|
|||
|
|
--current-step: 4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="5"] {
|
|||
|
|
--current-step: 5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="6"] {
|
|||
|
|
--current-step: 6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="7"] {
|
|||
|
|
--current-step: 7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps[data-fr-current-step="8"] {
|
|||
|
|
--current-step: 8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TOOLTIP
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-tooltip {
|
|||
|
|
--arrow-x: 0;
|
|||
|
|
display: block;
|
|||
|
|
max-width: min(24rem, calc((100vw - 2rem) * 2 / 3));
|
|||
|
|
padding: 0.5rem 0.5rem 1.25rem;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
opacity: 1;
|
|||
|
|
visibility: visible;
|
|||
|
|
transition: opacity 0s 0.15s, visibility 0s 0.15s;
|
|||
|
|
text-align: left;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: calc(50% + var(--arrow-x)) calc(100% - 0.5rem), calc(50% + var(--arrow-x)) calc(100% - 0.375rem), 50% calc(100% - 0.75rem), 50% calc(100% - 0.75rem);
|
|||
|
|
background-size: 0.5rem 0.375rem, 0.5rem 0.375rem, 100% 1px, 100% calc(100% - 0.75rem);
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip:not(.fr-tooltip--shown) {
|
|||
|
|
display: none;
|
|||
|
|
opacity: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip.fr-placement--bottom {
|
|||
|
|
padding-top: 1.25rem;
|
|||
|
|
padding-bottom: 0.5rem;
|
|||
|
|
background-position-y: 0.5rem, 0.375rem, 0.75rem, 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip.fr-placement {
|
|||
|
|
z-index: calc(var(--ground) + 1000);
|
|||
|
|
filter: drop-shadow(var(--overlap-shadow));
|
|||
|
|
background-image: linear-gradient(90deg, var(--background-overlap-grey), var(--background-overlap-grey));
|
|||
|
|
}
|
|||
|
|
@supports (background: conic-gradient(white, black)) {
|
|||
|
|
.fr-tooltip.fr-placement--top {
|
|||
|
|
background-image: conic-gradient(from -33.69deg at 50% 100%, transparent 0deg, var(--background-overlap-grey) 0deg, var(--background-overlap-grey) 67.38deg, transparent 67.38deg), conic-gradient(from -33.69deg at 50% 100%, transparent 0deg, var(--border-default-grey) 0deg, var(--border-default-grey) 67.38deg, transparent 67.38deg), linear-gradient(90deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(90deg, var(--background-overlap-grey), var(--background-overlap-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip.fr-placement--bottom {
|
|||
|
|
background-image: conic-gradient(from 146.31deg at 50% 0%, transparent 0deg, var(--background-overlap-grey) 0deg, var(--background-overlap-grey) 67.38deg, transparent 67.38deg), conic-gradient(from 146.31deg at 50% 0%, transparent 0deg, var(--border-default-grey) 0deg, var(--border-default-grey) 67.38deg, transparent 67.38deg), linear-gradient(90deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(90deg, var(--background-overlap-grey), var(--background-overlap-grey));
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
LINK
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-link {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-link--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-link--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-link--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-link--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-link--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-link--icon-right[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--icon-right[class^=fr-icon-]::after,
|
|||
|
|
.fr-link--icon-right[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-link--icon-right[class^=fr-fi-]::after,
|
|||
|
|
.fr-link--icon-right[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--icon-right[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--icon-right[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--icon-right[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--icon-right[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link[class^=fr-icon-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link[class*=" fr-icon-"]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link[class^=fr-fi-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link[class*=" fr-fi-"]:not([class*=fr-link--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
margin-right: -0.09375rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--xs.fr-link--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
margin-left: -0.09375rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class^=fr-icon-]::after,
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class^=fr-fi-]::after,
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
margin-right: -0.09375rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--xs.fr-link--icon-right[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--xs[class^=fr-icon-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--xs[class*=" fr-icon-"]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--xs[class^=fr-fi-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--xs[class*=" fr-fi-"]:not([class*=fr-link--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--sm.fr-link--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class^=fr-icon-]::after,
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class^=fr-fi-]::after,
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--sm.fr-link--icon-right[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--sm[class^=fr-icon-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--sm[class*=" fr-icon-"]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--sm[class^=fr-fi-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--sm[class*=" fr-fi-"]:not([class*=fr-link--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-right: -0.1875rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--lg.fr-link--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: -0.1875rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class^=fr-icon-],
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class*=" fr-icon-"],
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class^=fr-fi-],
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class^=fr-icon-]::after,
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class*=" fr-icon-"]::after,
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class^=fr-fi-]::after,
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class*=" fr-fi-"]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-right: -0.1875rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class^=fr-icon-]::before,
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class^=fr-fi-]::before,
|
|||
|
|
.fr-link--lg.fr-link--icon-right[class*=" fr-fi-"]::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--lg[class^=fr-icon-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--lg[class*=" fr-icon-"]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--lg[class^=fr-fi-]:not([class*=fr-link--icon-])::before,
|
|||
|
|
.fr-link--lg[class*=" fr-fi-"]:not([class*=fr-link--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download .fr-link,
|
|||
|
|
.fr-link--download {
|
|||
|
|
position: relative;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download .fr-link::after,
|
|||
|
|
.fr-link--download::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
margin-bottom: 1.75rem;
|
|||
|
|
vertical-align: calc((0.75rem - var(--icon-size)) * 0.5 - 1.75rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download .fr-link::before,
|
|||
|
|
.fr-link--download::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download .fr-link .fr-link__detail,
|
|||
|
|
.fr-link--download .fr-link__detail {
|
|||
|
|
position: absolute;
|
|||
|
|
left: 0;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
margin-top: 1.75rem;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
pointer-events: none;
|
|||
|
|
cursor: text;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download .fr-link .fr-link__detail abbr,
|
|||
|
|
.fr-link--download .fr-link__detail abbr {
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download {
|
|||
|
|
--ul-type: disc;
|
|||
|
|
--ol-type: decimal;
|
|||
|
|
--ul-start: 1rem;
|
|||
|
|
--ol-start: 1.5rem;
|
|||
|
|
--xl-block: 0.5rem;
|
|||
|
|
--li-bottom: 0.25rem;
|
|||
|
|
--xl-base: 1em;
|
|||
|
|
--ol-content: counters(li-counter, ".") ". ";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download > li {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--download .fr-link,
|
|||
|
|
.fr-links-group .fr-link--download {
|
|||
|
|
margin-bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group {
|
|||
|
|
--li-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--inline {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
display: inline;
|
|||
|
|
margin: 0 -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--inline > li {
|
|||
|
|
display: inline;
|
|||
|
|
line-height: 2.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--inline .fr-link {
|
|||
|
|
margin: 0 0.5rem 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--sm .fr-link {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--sm .fr-link::before,
|
|||
|
|
.fr-links-group--sm .fr-link::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--sm .fr-link:not(.fr-link--download) {
|
|||
|
|
vertical-align: top;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--lg .fr-link {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--lg .fr-link::before,
|
|||
|
|
.fr-links-group--lg .fr-link::after {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
margin: var(--title-spacing);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--bordered {
|
|||
|
|
padding: 1.5rem 1.5rem 0.5rem;
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--close {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
display: flex;
|
|||
|
|
margin-left: auto;
|
|||
|
|
margin-right: -1rem;
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--close::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--close::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link.fr-link--icon-left.fr-fi-theme-fill {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link.fr-link--icon-left.fr-fi-theme-fill::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link__detail {
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group li::marker {
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link--close:disabled,
|
|||
|
|
a.fr-link--close:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
SIDEMENU
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-sidemenu {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
--underline-img: none;
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
position: relative;
|
|||
|
|
margin-left: -1rem;
|
|||
|
|
margin-right: -1rem;
|
|||
|
|
/**
|
|||
|
|
* Titre facultatif
|
|||
|
|
*/
|
|||
|
|
/**
|
|||
|
|
* Variantes du sidemenu proposées juste à partir du breakpoint md
|
|||
|
|
*/
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey), inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
@include elevation.elevate(raised, (legacy:$legacy));
|
|||
|
|
@include respond-from(md) {
|
|||
|
|
@include elevation.drop((legacy:$legacy));
|
|||
|
|
}
|
|||
|
|
*/
|
|||
|
|
/*
|
|||
|
|
@include elevation.elevate(raised, (legacy:$legacy));
|
|||
|
|
@include respond-from(md) {
|
|||
|
|
@include elevation.drop((legacy:$legacy));
|
|||
|
|
}
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu a:not([href]) {
|
|||
|
|
cursor: default;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu .fr-collapse {
|
|||
|
|
margin: -0.25rem -0.25rem 0;
|
|||
|
|
padding: 0.25rem 0.25rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu .fr-collapse.fr-collapsing {
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
padding-top: 0;
|
|||
|
|
padding-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__title {
|
|||
|
|
padding: 1rem 0;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__list {
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__list .fr-sidemenu__list {
|
|||
|
|
margin: 0 1rem 1rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__list .fr-sidemenu__list .fr-sidemenu__link,
|
|||
|
|
.fr-sidemenu__list .fr-sidemenu__list .fr-sidemenu__btn {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__list .fr-sidemenu__list .fr-sidemenu__list .fr-sidemenu__link,
|
|||
|
|
.fr-sidemenu__list .fr-sidemenu__list .fr-sidemenu__list .fr-sidemenu__btn {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: 0 -1px 0 0 var(--border-default-grey), inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item .fr-sidemenu__item .fr-sidemenu__item::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner {
|
|||
|
|
/**
|
|||
|
|
* Ce wrapper ne sert que pour la version mobile
|
|||
|
|
* On l'utilise pour l'ouverture/fermeture du sidemenu entier
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner > .fr-collapse {
|
|||
|
|
margin: -0.25rem 0.75rem 0;
|
|||
|
|
padding: 0.25rem 0.75rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Styles du bouton et du lien d'accès direct du sidemnu
|
|||
|
|
*/
|
|||
|
|
.fr-sidemenu__link,
|
|||
|
|
.fr-sidemenu__btn {
|
|||
|
|
position: relative;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
text-align: left;
|
|||
|
|
font-weight: 700;
|
|||
|
|
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
--active-tint: var(--active);
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-sidemenu__btn[aria-current]:not([aria-current=false])::before {
|
|||
|
|
content: "";
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0.75rem;
|
|||
|
|
bottom: 0.75rem;
|
|||
|
|
left: 0;
|
|||
|
|
width: 2px;
|
|||
|
|
background-color: var(--border-active-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--border-active-blue-france-hover);
|
|||
|
|
--active: var(--border-active-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link:not([href])[aria-current]:not([aria-current=false]) {
|
|||
|
|
pointer-events: none;
|
|||
|
|
cursor: default;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Style du bouton du sidemnenu pour ouvrir/refermer les listes de niveaux 1 et 2
|
|||
|
|
* Bouton pour la version mobile pour ouvrir/refermer le sidemenu
|
|||
|
|
*/
|
|||
|
|
.fr-sidemenu__btn[aria-expanded] {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__btn[aria-expanded]::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: auto;
|
|||
|
|
margin-right: 0;
|
|||
|
|
transition: transform 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modificateur pour le bouton en version mobile permettant d'ouvrir/refermer le sidemenu
|
|||
|
|
* L'icône de gauche est défini dans _sidemenu.scss (provisoire)
|
|||
|
|
*/
|
|||
|
|
.fr-sidemenu__inner > .fr-sidemenu__btn {
|
|||
|
|
width: 100%;
|
|||
|
|
font-weight: 500;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Ajout de l'icône de menu en mode mobile (provisoire)
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner > .fr-sidemenu__btn::after {
|
|||
|
|
margin-right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner > .fr-sidemenu__btn::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/menu-2-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/menu-2-fill.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item .fr-sidemenu__link,
|
|||
|
|
.fr-sidemenu__item .fr-sidemenu__btn {
|
|||
|
|
color: var(--text-action-high-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item:first-child::before {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item:last-child::before {
|
|||
|
|
box-shadow: 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link[aria-current]:not([aria-current=false]),
|
|||
|
|
.fr-sidemenu__btn[aria-current]:not([aria-current=false]) {
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__btn[aria-expanded=true] {
|
|||
|
|
background-color: var(--background-open-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-open-blue-france-hover);
|
|||
|
|
--active: var(--background-open-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
HIGHLIGHT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-highlight {
|
|||
|
|
padding-left: 1.25rem;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
background-size: 0.25rem 100%;
|
|||
|
|
background-position: 0 0;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-france), var(--border-default-blue-france));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-tilleul-verveine {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-tilleul-verveine), var(--border-default-green-tilleul-verveine));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-bourgeon {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-bourgeon), var(--border-default-green-bourgeon));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-emeraude {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-emeraude), var(--border-default-green-emeraude));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-menthe {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-menthe), var(--border-default-green-menthe));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-archipel {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-archipel), var(--border-default-green-archipel));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--blue-ecume {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-ecume), var(--border-default-blue-ecume));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--blue-cumulus {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-cumulus), var(--border-default-blue-cumulus));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--purple-glycine {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-purple-glycine), var(--border-default-purple-glycine));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--pink-macaron {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-pink-macaron), var(--border-default-pink-macaron));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--pink-tuile {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-pink-tuile), var(--border-default-pink-tuile));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--yellow-tournesol {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-yellow-tournesol), var(--border-default-yellow-tournesol));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--yellow-moutarde {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-yellow-moutarde), var(--border-default-yellow-moutarde));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--orange-terre-battue {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-orange-terre-battue), var(--border-default-orange-terre-battue));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-cafe-creme {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-cafe-creme), var(--border-default-brown-cafe-creme));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-caramel {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-caramel), var(--border-default-brown-caramel));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-opera {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-opera), var(--border-default-brown-opera));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--beige-gris-galet {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-beige-gris-galet), var(--border-default-beige-gris-galet));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TAB
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-tabs__tab {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
position: relative;
|
|||
|
|
overflow: visible;
|
|||
|
|
font-weight: 700;
|
|||
|
|
z-index: 1;
|
|||
|
|
margin: 0 0.25rem;
|
|||
|
|
height: 100%;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
background-size: 0 2px, 1px 0, 1px 0, 100% 1px;
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
|
|||
|
|
background-position: 0 0, 0 calc(100% - 1px), 100% calc(100% - 1px), 100% 100%;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
box-shadow: 0 2px 0 0 var(--background-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab::before,
|
|||
|
|
.fr-tabs__tab::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab[class^=fr-icon-]:not([class*=fr-tabs__tab--icon-]),
|
|||
|
|
.fr-tabs__tab[class*=" fr-icon-"]:not([class*=fr-tabs__tab--icon-]),
|
|||
|
|
.fr-tabs__tab[class^=fr-fi-]:not([class*=fr-tabs__tab--icon-]),
|
|||
|
|
.fr-tabs__tab[class*=" fr-fi-"]:not([class*=fr-tabs__tab--icon-]) {
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.75rem;
|
|||
|
|
padding-right: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab[class^=fr-icon-]:not([class*=fr-tabs__tab--icon-])::before,
|
|||
|
|
.fr-tabs__tab[class*=" fr-icon-"]:not([class*=fr-tabs__tab--icon-])::before,
|
|||
|
|
.fr-tabs__tab[class^=fr-fi-]:not([class*=fr-tabs__tab--icon-])::before,
|
|||
|
|
.fr-tabs__tab[class*=" fr-fi-"]:not([class*=fr-tabs__tab--icon-])::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-tabs__tab--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-tabs__tab--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-tabs__tab--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-tabs__tab--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-tabs__tab--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-tabs__tab--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs {
|
|||
|
|
--tabs-height: auto;
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
--underline-img: none;
|
|||
|
|
position: relative;
|
|||
|
|
overflow: hidden;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0;
|
|||
|
|
margin-top: -4px;
|
|||
|
|
padding-top: 4px;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
height: var(--tabs-height);
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Animation de la hauteur du panel
|
|||
|
|
*/
|
|||
|
|
transition: height 0.3s;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* ul : element srollable des boutons
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Tab button
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Tab Panel
|
|||
|
|
*/
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Tab button
|
|||
|
|
*/
|
|||
|
|
/**
|
|||
|
|
* Tab button
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs--viewport-width {
|
|||
|
|
margin-left: calc(50% - 50vw);
|
|||
|
|
margin-right: calc(50% - 50vw);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
margin-top: -1px;
|
|||
|
|
order: 2;
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey), inset 1px 0 0 0 var(--border-default-grey), inset -1px 0 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__list {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: stretch;
|
|||
|
|
overflow-x: auto;
|
|||
|
|
width: 100%;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
z-index: 1;
|
|||
|
|
order: 1;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* overflow vertical de 4px pour le focus
|
|||
|
|
*/
|
|||
|
|
margin: -4px 0 -4px;
|
|||
|
|
padding: 4px 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab[aria-selected=true] {
|
|||
|
|
background-size: 100% 2px, 1px calc(100% - 1px), 1px calc(100% - 1px), 0 1px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel {
|
|||
|
|
--underline-img: linear-gradient(0deg, currentColor, currentColor);
|
|||
|
|
--ul-type: disc;
|
|||
|
|
--ol-type: decimal;
|
|||
|
|
--ul-start: 1rem;
|
|||
|
|
--ol-start: 1.5rem;
|
|||
|
|
--xl-block: 0.5rem;
|
|||
|
|
--li-bottom: 0.25rem;
|
|||
|
|
--xl-base: 1em;
|
|||
|
|
--ol-content: counters(li-counter, ".") ". ";
|
|||
|
|
display: block;
|
|||
|
|
order: 3;
|
|||
|
|
position: relative;
|
|||
|
|
left: -100%;
|
|||
|
|
width: 100%;
|
|||
|
|
height: auto;
|
|||
|
|
padding: 1rem;
|
|||
|
|
margin-right: -100%;
|
|||
|
|
flex: 0 0 100%;
|
|||
|
|
transition: visibility 0.3s, transform 0.3s;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Les éléments non sélectionnés sont cachés et rendus innaccessibles au focus
|
|||
|
|
* Point d'attention : visibility hidden sur le panel et surcharge sur l'élément selected avec visibility visible créé des problèmes dans la gestion du focus en cas d'imbrication d'onglets
|
|||
|
|
*
|
|||
|
|
* tabs
|
|||
|
|
* └─ panel selected
|
|||
|
|
* └─ panel (visibility hidden, tabindex -1)
|
|||
|
|
* └─ tabs
|
|||
|
|
* └─ panel selected (visibility visible tabindex 0)
|
|||
|
|
* ↑ ce panel est accessible alors que caché par son panel parent
|
|||
|
|
* solution : visibility hidden seulement sur les éléments non sélectionnés
|
|||
|
|
**/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel:focus,
|
|||
|
|
.fr-tabs__panel:focus-visible {
|
|||
|
|
outline-offset: calc(-1rem + 2px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel--direction-end {
|
|||
|
|
transform: translate(100%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel--direction-start {
|
|||
|
|
transform: translate(-100%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel:not(.fr-tabs__panel--selected) {
|
|||
|
|
visibility: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* Ombres ajoutées en Js si le contenu est plus grand que le conteneur
|
|||
|
|
*/
|
|||
|
|
.fr-tabs__shadow {
|
|||
|
|
--tabs-list-height: 3rem;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modifier ombre à gauche
|
|||
|
|
**/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modifier ombre à droite
|
|||
|
|
**/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modifier combinaison ombre à gauche et ombre à droite
|
|||
|
|
**/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__shadow::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 4px;
|
|||
|
|
right: 0;
|
|||
|
|
left: 0;
|
|||
|
|
z-index: 2;
|
|||
|
|
box-shadow: inset 0 0 0 0 rgba(22, 22, 22, 0), inset 0 0 0 0 rgba(22, 22, 22, 0);
|
|||
|
|
height: calc(var(--tabs-list-height) - 8px);
|
|||
|
|
opacity: 0.8;
|
|||
|
|
pointer-events: none;
|
|||
|
|
transition: box-shadow 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__shadow--left::before {
|
|||
|
|
box-shadow: inset 2rem 0 1.5rem -2rem #161616, inset 0 0 0 0 rgba(22, 22, 22, 0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__shadow--right::before {
|
|||
|
|
box-shadow: inset 0 0 0 0 rgba(22, 22, 22, 0), inset -2rem 0 1.5rem -2rem #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__shadow--left.fr-tabs__shadow--right::before {
|
|||
|
|
box-shadow: inset 2rem 0 1.5rem -2rem #161616, inset -2rem 0 1.5rem -2rem #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-tabs__shadow::before {
|
|||
|
|
opacity: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab:not([aria-selected=true]) {
|
|||
|
|
background-color: var(--background-action-low-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-blue-france-hover);
|
|||
|
|
--active: var(--background-action-low-blue-france-active);
|
|||
|
|
color: var(--text-action-high-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab[aria-selected=true]:not(:disabled) {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-active-blue-france), var(--border-active-blue-france)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
PAGINATION
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-pagination__link {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
min-width: 2rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link::before,
|
|||
|
|
.fr-pagination__link::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination {
|
|||
|
|
--underline-img: none;
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
color: var(--text-action-high-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__list {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__list > *:first-child,
|
|||
|
|
.fr-pagination__list > *:first-child * {
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__list > *:last-child,
|
|||
|
|
.fr-pagination__list > *:last-child * {
|
|||
|
|
margin-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link:not([href])[aria-current]:not([aria-current=false]) {
|
|||
|
|
cursor: default;
|
|||
|
|
pointer-events: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--first {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--first::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--arrow-left-s-first-line.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--arrow-left-s-first-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--first.fr-pagination__link--label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--first.fr-pagination__link--label::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--arrow-left-s-first-line.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--arrow-left-s-first-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--prev {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--prev::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-left-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-left-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--prev.fr-pagination__link--label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--prev.fr-pagination__link--label::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-left-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-left-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next.fr-pagination__link--label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next.fr-pagination__link--label::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next.fr-pagination__link--label::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--arrow-right-s-last-line.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--arrow-right-s-last-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last.fr-pagination__link--label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last.fr-pagination__link--label::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--arrow-right-s-last-line.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--arrow-right-s-last-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last.fr-pagination__link--label::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]) {
|
|||
|
|
background-color: var(--background-active-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-active-blue-france-hover);
|
|||
|
|
--active: var(--background-active-blue-france-active);
|
|||
|
|
color: var(--text-inverted-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link:not([aria-current]):disabled,
|
|||
|
|
a.fr-pagination__link:not([aria-current]):not([href]),
|
|||
|
|
a.fr-pagination__link[aria-current=false]:not([href]),
|
|||
|
|
.fr-pagination__link[aria-current=false]:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
SUMMARY
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-summary {
|
|||
|
|
--text-spacing: 0 0 0.5rem 0;
|
|||
|
|
--title-spacing: 0 0 0.5rem 0;
|
|||
|
|
padding: 1.5rem;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary ol {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary li {
|
|||
|
|
padding: 0.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary li::marker {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary__title {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary__link {
|
|||
|
|
display: inline;
|
|||
|
|
position: relative;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary__link::before {
|
|||
|
|
content: var(--ol-content);
|
|||
|
|
position: absolute;
|
|||
|
|
right: 100%;
|
|||
|
|
font-size: var(--xl-size);
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary__link:not(:hover):not(:active) {
|
|||
|
|
--underline-idle-width: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary li > a {
|
|||
|
|
color: var(--text-action-high-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TABLE
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-table {
|
|||
|
|
--table-offset: 1rem;
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
position: relative;
|
|||
|
|
margin-bottom: 2.5rem;
|
|||
|
|
padding-top: var(--table-offset);
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table:not(.fr-table--no-scroll) table {
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table table {
|
|||
|
|
width: 100%;
|
|||
|
|
display: block;
|
|||
|
|
overflow: auto;
|
|||
|
|
border-spacing: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table[data-fr-js-table=true] caption {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table caption {
|
|||
|
|
position: initial;
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
margin: var(--title-spacing);
|
|||
|
|
font-weight: 700;
|
|||
|
|
text-align: left;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table td,
|
|||
|
|
.fr-table th {
|
|||
|
|
text-align: left;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
display: table-cell;
|
|||
|
|
border: 0;
|
|||
|
|
padding: 0.75rem;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table th {
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table thead {
|
|||
|
|
background-size: 100% 2px;
|
|||
|
|
background-position: bottom;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-grey), var(--border-plain-grey));
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table thead td,
|
|||
|
|
.fr-table thead th {
|
|||
|
|
font-weight: 700;
|
|||
|
|
padding-bottom: 0.875rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* Cache la caption
|
|||
|
|
*/
|
|||
|
|
.fr-table--no-caption {
|
|||
|
|
padding-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--no-caption caption {
|
|||
|
|
position: absolute;
|
|||
|
|
width: 1px;
|
|||
|
|
height: 1px;
|
|||
|
|
padding: 0;
|
|||
|
|
margin: -1px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
clip: rect(0, 0, 0, 0);
|
|||
|
|
white-space: nowrap; /* added line */
|
|||
|
|
border: 0;
|
|||
|
|
display: block;
|
|||
|
|
height: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* Fixe le caption en bas du tableau
|
|||
|
|
*/
|
|||
|
|
.fr-table--caption-bottom {
|
|||
|
|
padding-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--caption-bottom table {
|
|||
|
|
margin-bottom: calc(var(--table-offset) + 2.75rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--caption-bottom[data-fr-js-table=true] caption {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 100%;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--caption-bottom caption {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
height: min-content;
|
|||
|
|
caption-side: bottom;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* pas de scroll ni de shadow
|
|||
|
|
*/
|
|||
|
|
.fr-table--no-scroll {
|
|||
|
|
min-width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--no-scroll table {
|
|||
|
|
overflow-x: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--no-scroll caption {
|
|||
|
|
max-width: calc(100vw - 2rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* Fixe la taille des colonnes du tableau
|
|||
|
|
*/
|
|||
|
|
.fr-table--layout-fixed table {
|
|||
|
|
display: table;
|
|||
|
|
table-layout: fixed;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
.fr-table--bordered tbody tr {
|
|||
|
|
background-size: 100% 1px;
|
|||
|
|
background-position: bottom;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
|
|||
|
|
/* Style bordered, enleve le style even/odd */
|
|||
|
|
/* Style bordered, enleve le style even/odd */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* Ombres ajoutées en Js si le contenu est plus grand que le conteneur
|
|||
|
|
*/
|
|||
|
|
.fr-table__shadow {
|
|||
|
|
/**
|
|||
|
|
* Modifier ombre à gauche
|
|||
|
|
**/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modifier ombre à droite
|
|||
|
|
**/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modifier combinaison ombre à gauche et ombre à droite
|
|||
|
|
**/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table__shadow::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: var(--table-offset);
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
z-index: 1;
|
|||
|
|
box-shadow: inset 0 0 0 0 #161616, inset 0 0 0 0 #161616;
|
|||
|
|
opacity: 0.32;
|
|||
|
|
pointer-events: none;
|
|||
|
|
transition: box-shadow 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table__shadow--left::before {
|
|||
|
|
box-shadow: inset 2rem 0 1rem -2rem #161616, inset 0 0 0 0 #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table__shadow--right::before {
|
|||
|
|
box-shadow: inset 0 0 0 0 #161616, inset -2rem 0 1rem -2rem #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table__shadow--left.fr-table__shadow--right::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
box-shadow: inset 2rem 0 1rem -2rem #161616, inset -2rem 0 1rem -2rem #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* Positionnement ombres sur le tableau sans caption
|
|||
|
|
*/
|
|||
|
|
.fr-table--no-caption .fr-table__shadow::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
* Positionnement ombres sur le tableau avec caption en bas
|
|||
|
|
*/
|
|||
|
|
.fr-table--caption-bottom .fr-table__shadow::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-table__shadow::before {
|
|||
|
|
opacity: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table tbody {
|
|||
|
|
background-color: var(--background-alt-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-grey-hover);
|
|||
|
|
--active: var(--background-alt-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-tilleul-verveine {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-tilleul-verveine thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-green-tilleul-verveine), var(--border-plain-green-tilleul-verveine));
|
|||
|
|
background-color: var(--background-contrast-green-tilleul-verveine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-tilleul-verveine-hover);
|
|||
|
|
--active: var(--background-contrast-green-tilleul-verveine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-tilleul-verveine tbody {
|
|||
|
|
background-color: var(--background-alt-green-tilleul-verveine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-green-tilleul-verveine-hover);
|
|||
|
|
--active: var(--background-alt-green-tilleul-verveine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-tilleul-verveine tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-green-tilleul-verveine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-tilleul-verveine-hover);
|
|||
|
|
--active: var(--background-contrast-green-tilleul-verveine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-tilleul-verveine.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-tilleul-verveine), var(--border-default-green-tilleul-verveine));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-bourgeon {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-bourgeon thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-green-bourgeon), var(--border-plain-green-bourgeon));
|
|||
|
|
background-color: var(--background-contrast-green-bourgeon);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-bourgeon-hover);
|
|||
|
|
--active: var(--background-contrast-green-bourgeon-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-bourgeon tbody {
|
|||
|
|
background-color: var(--background-alt-green-bourgeon);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-green-bourgeon-hover);
|
|||
|
|
--active: var(--background-alt-green-bourgeon-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-bourgeon tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-green-bourgeon);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-bourgeon-hover);
|
|||
|
|
--active: var(--background-contrast-green-bourgeon-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-bourgeon.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-bourgeon), var(--border-default-green-bourgeon));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-emeraude {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-emeraude thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-green-emeraude), var(--border-plain-green-emeraude));
|
|||
|
|
background-color: var(--background-contrast-green-emeraude);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-emeraude-hover);
|
|||
|
|
--active: var(--background-contrast-green-emeraude-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-emeraude tbody {
|
|||
|
|
background-color: var(--background-alt-green-emeraude);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-green-emeraude-hover);
|
|||
|
|
--active: var(--background-alt-green-emeraude-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-emeraude tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-green-emeraude);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-emeraude-hover);
|
|||
|
|
--active: var(--background-contrast-green-emeraude-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-emeraude.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-emeraude), var(--border-default-green-emeraude));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-menthe {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-menthe thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-green-menthe), var(--border-plain-green-menthe));
|
|||
|
|
background-color: var(--background-contrast-green-menthe);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-menthe-hover);
|
|||
|
|
--active: var(--background-contrast-green-menthe-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-menthe tbody {
|
|||
|
|
background-color: var(--background-alt-green-menthe);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-green-menthe-hover);
|
|||
|
|
--active: var(--background-alt-green-menthe-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-menthe tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-green-menthe);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-menthe-hover);
|
|||
|
|
--active: var(--background-contrast-green-menthe-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-menthe.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-menthe), var(--border-default-green-menthe));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-archipel {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-archipel thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-green-archipel), var(--border-plain-green-archipel));
|
|||
|
|
background-color: var(--background-contrast-green-archipel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-archipel-hover);
|
|||
|
|
--active: var(--background-contrast-green-archipel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-archipel tbody {
|
|||
|
|
background-color: var(--background-alt-green-archipel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-green-archipel-hover);
|
|||
|
|
--active: var(--background-alt-green-archipel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-archipel tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-green-archipel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-archipel-hover);
|
|||
|
|
--active: var(--background-contrast-green-archipel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--green-archipel.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-archipel), var(--border-default-green-archipel));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-ecume {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-ecume thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-blue-ecume), var(--border-plain-blue-ecume));
|
|||
|
|
background-color: var(--background-contrast-blue-ecume);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-ecume-hover);
|
|||
|
|
--active: var(--background-contrast-blue-ecume-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-ecume tbody {
|
|||
|
|
background-color: var(--background-alt-blue-ecume);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-blue-ecume-hover);
|
|||
|
|
--active: var(--background-alt-blue-ecume-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-ecume tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-blue-ecume);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-ecume-hover);
|
|||
|
|
--active: var(--background-contrast-blue-ecume-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-ecume.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-ecume), var(--border-default-blue-ecume));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-cumulus {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-cumulus thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-blue-cumulus), var(--border-plain-blue-cumulus));
|
|||
|
|
background-color: var(--background-contrast-blue-cumulus);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-cumulus-hover);
|
|||
|
|
--active: var(--background-contrast-blue-cumulus-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-cumulus tbody {
|
|||
|
|
background-color: var(--background-alt-blue-cumulus);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-blue-cumulus-hover);
|
|||
|
|
--active: var(--background-alt-blue-cumulus-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-cumulus tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-blue-cumulus);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-cumulus-hover);
|
|||
|
|
--active: var(--background-contrast-blue-cumulus-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--blue-cumulus.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-cumulus), var(--border-default-blue-cumulus));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--purple-glycine {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--purple-glycine thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-purple-glycine), var(--border-plain-purple-glycine));
|
|||
|
|
background-color: var(--background-contrast-purple-glycine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-purple-glycine-hover);
|
|||
|
|
--active: var(--background-contrast-purple-glycine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--purple-glycine tbody {
|
|||
|
|
background-color: var(--background-alt-purple-glycine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-purple-glycine-hover);
|
|||
|
|
--active: var(--background-alt-purple-glycine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--purple-glycine tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-purple-glycine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-purple-glycine-hover);
|
|||
|
|
--active: var(--background-contrast-purple-glycine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--purple-glycine.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-purple-glycine), var(--border-default-purple-glycine));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-macaron {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-macaron thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-pink-macaron), var(--border-plain-pink-macaron));
|
|||
|
|
background-color: var(--background-contrast-pink-macaron);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-macaron-hover);
|
|||
|
|
--active: var(--background-contrast-pink-macaron-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-macaron tbody {
|
|||
|
|
background-color: var(--background-alt-pink-macaron);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-pink-macaron-hover);
|
|||
|
|
--active: var(--background-alt-pink-macaron-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-macaron tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-pink-macaron);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-macaron-hover);
|
|||
|
|
--active: var(--background-contrast-pink-macaron-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-macaron.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-pink-macaron), var(--border-default-pink-macaron));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-tuile {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-tuile thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-pink-tuile), var(--border-plain-pink-tuile));
|
|||
|
|
background-color: var(--background-contrast-pink-tuile);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-tuile-hover);
|
|||
|
|
--active: var(--background-contrast-pink-tuile-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-tuile tbody {
|
|||
|
|
background-color: var(--background-alt-pink-tuile);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-pink-tuile-hover);
|
|||
|
|
--active: var(--background-alt-pink-tuile-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-tuile tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-pink-tuile);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-tuile-hover);
|
|||
|
|
--active: var(--background-contrast-pink-tuile-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--pink-tuile.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-pink-tuile), var(--border-default-pink-tuile));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-tournesol {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-tournesol thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-yellow-tournesol), var(--border-plain-yellow-tournesol));
|
|||
|
|
background-color: var(--background-contrast-yellow-tournesol);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-tournesol-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-tournesol-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-tournesol tbody {
|
|||
|
|
background-color: var(--background-alt-yellow-tournesol);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-yellow-tournesol-hover);
|
|||
|
|
--active: var(--background-alt-yellow-tournesol-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-tournesol tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-yellow-tournesol);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-tournesol-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-tournesol-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-tournesol.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-yellow-tournesol), var(--border-default-yellow-tournesol));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-moutarde {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-moutarde thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-yellow-moutarde), var(--border-plain-yellow-moutarde));
|
|||
|
|
background-color: var(--background-contrast-yellow-moutarde);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-moutarde-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-moutarde-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-moutarde tbody {
|
|||
|
|
background-color: var(--background-alt-yellow-moutarde);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-yellow-moutarde-hover);
|
|||
|
|
--active: var(--background-alt-yellow-moutarde-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-moutarde tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-yellow-moutarde);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-moutarde-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-moutarde-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--yellow-moutarde.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-yellow-moutarde), var(--border-default-yellow-moutarde));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--orange-terre-battue {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--orange-terre-battue thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-orange-terre-battue), var(--border-plain-orange-terre-battue));
|
|||
|
|
background-color: var(--background-contrast-orange-terre-battue);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-orange-terre-battue-hover);
|
|||
|
|
--active: var(--background-contrast-orange-terre-battue-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--orange-terre-battue tbody {
|
|||
|
|
background-color: var(--background-alt-orange-terre-battue);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-orange-terre-battue-hover);
|
|||
|
|
--active: var(--background-alt-orange-terre-battue-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--orange-terre-battue tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-orange-terre-battue);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-orange-terre-battue-hover);
|
|||
|
|
--active: var(--background-contrast-orange-terre-battue-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--orange-terre-battue.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-orange-terre-battue), var(--border-default-orange-terre-battue));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-cafe-creme {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-cafe-creme thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-brown-cafe-creme), var(--border-plain-brown-cafe-creme));
|
|||
|
|
background-color: var(--background-contrast-brown-cafe-creme);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-cafe-creme-hover);
|
|||
|
|
--active: var(--background-contrast-brown-cafe-creme-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-cafe-creme tbody {
|
|||
|
|
background-color: var(--background-alt-brown-cafe-creme);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-brown-cafe-creme-hover);
|
|||
|
|
--active: var(--background-alt-brown-cafe-creme-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-cafe-creme tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-brown-cafe-creme);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-cafe-creme-hover);
|
|||
|
|
--active: var(--background-contrast-brown-cafe-creme-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-cafe-creme.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-cafe-creme), var(--border-default-brown-cafe-creme));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-caramel {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-caramel thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-brown-caramel), var(--border-plain-brown-caramel));
|
|||
|
|
background-color: var(--background-contrast-brown-caramel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-caramel-hover);
|
|||
|
|
--active: var(--background-contrast-brown-caramel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-caramel tbody {
|
|||
|
|
background-color: var(--background-alt-brown-caramel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-brown-caramel-hover);
|
|||
|
|
--active: var(--background-alt-brown-caramel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-caramel tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-brown-caramel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-caramel-hover);
|
|||
|
|
--active: var(--background-contrast-brown-caramel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-caramel.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-caramel), var(--border-default-brown-caramel));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-opera {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-opera thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-brown-opera), var(--border-plain-brown-opera));
|
|||
|
|
background-color: var(--background-contrast-brown-opera);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-opera-hover);
|
|||
|
|
--active: var(--background-contrast-brown-opera-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-opera tbody {
|
|||
|
|
background-color: var(--background-alt-brown-opera);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-brown-opera-hover);
|
|||
|
|
--active: var(--background-alt-brown-opera-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-opera tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-brown-opera);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-opera-hover);
|
|||
|
|
--active: var(--background-contrast-brown-opera-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--brown-opera.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-opera), var(--border-default-brown-opera));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--beige-gris-galet {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--beige-gris-galet thead {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-beige-gris-galet), var(--border-plain-beige-gris-galet));
|
|||
|
|
background-color: var(--background-contrast-beige-gris-galet);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-beige-gris-galet-hover);
|
|||
|
|
--active: var(--background-contrast-beige-gris-galet-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--beige-gris-galet tbody {
|
|||
|
|
background-color: var(--background-alt-beige-gris-galet);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-beige-gris-galet-hover);
|
|||
|
|
--active: var(--background-alt-beige-gris-galet-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--beige-gris-galet tbody tr:nth-child(even) {
|
|||
|
|
background-color: var(--background-contrast-beige-gris-galet);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-beige-gris-galet-hover);
|
|||
|
|
--active: var(--background-contrast-beige-gris-galet-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--beige-gris-galet.fr-table--bordered tbody tr {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-beige-gris-galet), var(--border-default-beige-gris-galet));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table--bordered tbody tr:nth-child(even) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TAG
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-tag {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
border-radius: 1rem;
|
|||
|
|
min-width: 2.25rem;
|
|||
|
|
justify-content: center;
|
|||
|
|
color: var(--text-label-grey);
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag::before,
|
|||
|
|
.fr-tag::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-tag--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-tag--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-tag--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-tag--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-tag--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-tag--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[class^=fr-icon-]:not([class*=fr-tag--icon-])::before,
|
|||
|
|
.fr-tag[class*=" fr-icon-"]:not([class*=fr-tag--icon-])::before,
|
|||
|
|
.fr-tag[class^=fr-fi-]:not([class*=fr-tag--icon-])::before,
|
|||
|
|
.fr-tag[class*=" fr-fi-"]:not([class*=fr-tag--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--sm {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.5rem;
|
|||
|
|
padding: 0.125rem 0.5rem;
|
|||
|
|
border-radius: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--sm[target=_blank] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--sm[target=_blank]::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
margin-right: -0.09375rem;
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class^=fr-icon-],
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class*=" fr-icon-"],
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class^=fr-fi-],
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class*=" fr-fi-"] {
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class^=fr-icon-]::before,
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class^=fr-fi-]::before,
|
|||
|
|
.fr-tag--sm.fr-tag--icon-left[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
margin-left: -0.09375rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag--sm[class^=fr-icon-]:not([class*=fr-tag--icon-])::before,
|
|||
|
|
.fr-tag--sm[class*=" fr-icon-"]:not([class*=fr-tag--icon-])::before,
|
|||
|
|
.fr-tag--sm[class^=fr-fi-]:not([class*=fr-tag--icon-])::before,
|
|||
|
|
.fr-tag--sm[class*=" fr-fi-"]:not([class*=fr-tag--icon-])::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag[aria-pressed=true],
|
|||
|
|
button.fr-tag[aria-pressed=true],
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true],
|
|||
|
|
input[type=image].fr-tag[aria-pressed=true],
|
|||
|
|
input[type=reset].fr-tag[aria-pressed=true],
|
|||
|
|
input[type=submit].fr-tag[aria-pressed=true] {
|
|||
|
|
position: relative;
|
|||
|
|
overflow: visible;
|
|||
|
|
background-position: 50%;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag[aria-pressed=true]::after,
|
|||
|
|
button.fr-tag[aria-pressed=true]::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]::after,
|
|||
|
|
input[type=image].fr-tag[aria-pressed=true]::after,
|
|||
|
|
input[type=reset].fr-tag[aria-pressed=true]::after,
|
|||
|
|
input[type=submit].fr-tag[aria-pressed=true]::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/checkbox-circle-line.svg");
|
|||
|
|
mask-image: url("../icons/system/checkbox-circle-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
position: absolute;
|
|||
|
|
top: 4px;
|
|||
|
|
right: 0;
|
|||
|
|
margin: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag[aria-pressed=true].fr-tag--sm::after,
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm::after,
|
|||
|
|
input[type=image].fr-tag[aria-pressed=true].fr-tag--sm::after,
|
|||
|
|
input[type=reset].fr-tag[aria-pressed=true].fr-tag--sm::after,
|
|||
|
|
input[type=submit].fr-tag[aria-pressed=true].fr-tag--sm::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
content: "";
|
|||
|
|
position: absolute;
|
|||
|
|
top: 3px;
|
|||
|
|
right: 0;
|
|||
|
|
margin: -0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--dismiss::before,
|
|||
|
|
button.fr-tag--dismiss::before,
|
|||
|
|
input[type=button].fr-tag--dismiss::before,
|
|||
|
|
input[type=image].fr-tag--dismiss::before,
|
|||
|
|
input[type=reset].fr-tag--dismiss::before,
|
|||
|
|
input[type=submit].fr-tag--dismiss::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--dismiss::after,
|
|||
|
|
button.fr-tag--dismiss::after,
|
|||
|
|
input[type=button].fr-tag--dismiss::after,
|
|||
|
|
input[type=image].fr-tag--dismiss::after,
|
|||
|
|
input[type=reset].fr-tag--dismiss::after,
|
|||
|
|
input[type=submit].fr-tag--dismiss::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
margin-right: -0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--dismiss.fr-tag--sm::after,
|
|||
|
|
button.fr-tag--dismiss.fr-tag--sm::after,
|
|||
|
|
input[type=button].fr-tag--dismiss.fr-tag--sm::after,
|
|||
|
|
input[type=image].fr-tag--dismiss.fr-tag--sm::after,
|
|||
|
|
input[type=reset].fr-tag--dismiss.fr-tag--sm::after,
|
|||
|
|
input[type=submit].fr-tag--dismiss.fr-tag--sm::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-right: -0.1875rem;
|
|||
|
|
margin-left: 0.125rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
margin-left: -0.25rem;
|
|||
|
|
margin-right: -0.25rem;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group > li {
|
|||
|
|
line-height: 2.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group .fr-tag {
|
|||
|
|
margin: 0 0.25rem 0.5rem 0.25rem;
|
|||
|
|
vertical-align: top;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm .fr-tag {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.5rem;
|
|||
|
|
padding: 0.125rem 0.5rem;
|
|||
|
|
border-radius: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm .fr-tag::before,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm .fr-tag::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag.fr-tag--dismiss::after,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag.fr-tag--dismiss::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-right: -0.1875rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]::after,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
content: "";
|
|||
|
|
position: absolute;
|
|||
|
|
top: 3px;
|
|||
|
|
right: 0;
|
|||
|
|
margin: -0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[aria-pressed=false] {
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
background-color: var(--background-action-low-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-blue-france-hover);
|
|||
|
|
--active: var(--background-action-low-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag.fr-tag--dismiss {
|
|||
|
|
color: var(--text-inverted-blue-france);
|
|||
|
|
background-color: var(--background-action-high-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-high-blue-france-hover);
|
|||
|
|
--active: var(--background-action-high-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag,
|
|||
|
|
button.fr-tag,
|
|||
|
|
input[type=button].fr-tag {
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
background-color: var(--background-action-low-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-blue-france-hover);
|
|||
|
|
--active: var(--background-action-low-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-tilleul-verveine,
|
|||
|
|
button.fr-tag--green-tilleul-verveine,
|
|||
|
|
input[type=button].fr-tag--green-tilleul-verveine {
|
|||
|
|
color: var(--text-action-high-green-tilleul-verveine);
|
|||
|
|
background-color: var(--background-action-low-green-tilleul-verveine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-green-tilleul-verveine-hover);
|
|||
|
|
--active: var(--background-action-low-green-tilleul-verveine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-bourgeon,
|
|||
|
|
button.fr-tag--green-bourgeon,
|
|||
|
|
input[type=button].fr-tag--green-bourgeon {
|
|||
|
|
color: var(--text-action-high-green-bourgeon);
|
|||
|
|
background-color: var(--background-action-low-green-bourgeon);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-green-bourgeon-hover);
|
|||
|
|
--active: var(--background-action-low-green-bourgeon-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-emeraude,
|
|||
|
|
button.fr-tag--green-emeraude,
|
|||
|
|
input[type=button].fr-tag--green-emeraude {
|
|||
|
|
color: var(--text-action-high-green-emeraude);
|
|||
|
|
background-color: var(--background-action-low-green-emeraude);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-green-emeraude-hover);
|
|||
|
|
--active: var(--background-action-low-green-emeraude-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-menthe,
|
|||
|
|
button.fr-tag--green-menthe,
|
|||
|
|
input[type=button].fr-tag--green-menthe {
|
|||
|
|
color: var(--text-action-high-green-menthe);
|
|||
|
|
background-color: var(--background-action-low-green-menthe);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-green-menthe-hover);
|
|||
|
|
--active: var(--background-action-low-green-menthe-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-archipel,
|
|||
|
|
button.fr-tag--green-archipel,
|
|||
|
|
input[type=button].fr-tag--green-archipel {
|
|||
|
|
color: var(--text-action-high-green-archipel);
|
|||
|
|
background-color: var(--background-action-low-green-archipel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-green-archipel-hover);
|
|||
|
|
--active: var(--background-action-low-green-archipel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-ecume,
|
|||
|
|
button.fr-tag--blue-ecume,
|
|||
|
|
input[type=button].fr-tag--blue-ecume {
|
|||
|
|
color: var(--text-action-high-blue-ecume);
|
|||
|
|
background-color: var(--background-action-low-blue-ecume);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-blue-ecume-hover);
|
|||
|
|
--active: var(--background-action-low-blue-ecume-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-cumulus,
|
|||
|
|
button.fr-tag--blue-cumulus,
|
|||
|
|
input[type=button].fr-tag--blue-cumulus {
|
|||
|
|
color: var(--text-action-high-blue-cumulus);
|
|||
|
|
background-color: var(--background-action-low-blue-cumulus);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-blue-cumulus-hover);
|
|||
|
|
--active: var(--background-action-low-blue-cumulus-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--purple-glycine,
|
|||
|
|
button.fr-tag--purple-glycine,
|
|||
|
|
input[type=button].fr-tag--purple-glycine {
|
|||
|
|
color: var(--text-action-high-purple-glycine);
|
|||
|
|
background-color: var(--background-action-low-purple-glycine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-purple-glycine-hover);
|
|||
|
|
--active: var(--background-action-low-purple-glycine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-macaron,
|
|||
|
|
button.fr-tag--pink-macaron,
|
|||
|
|
input[type=button].fr-tag--pink-macaron {
|
|||
|
|
color: var(--text-action-high-pink-macaron);
|
|||
|
|
background-color: var(--background-action-low-pink-macaron);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-pink-macaron-hover);
|
|||
|
|
--active: var(--background-action-low-pink-macaron-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-tuile,
|
|||
|
|
button.fr-tag--pink-tuile,
|
|||
|
|
input[type=button].fr-tag--pink-tuile {
|
|||
|
|
color: var(--text-action-high-pink-tuile);
|
|||
|
|
background-color: var(--background-action-low-pink-tuile);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-pink-tuile-hover);
|
|||
|
|
--active: var(--background-action-low-pink-tuile-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-tournesol,
|
|||
|
|
button.fr-tag--yellow-tournesol,
|
|||
|
|
input[type=button].fr-tag--yellow-tournesol {
|
|||
|
|
color: var(--text-action-high-yellow-tournesol);
|
|||
|
|
background-color: var(--background-action-low-yellow-tournesol);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-yellow-tournesol-hover);
|
|||
|
|
--active: var(--background-action-low-yellow-tournesol-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-moutarde,
|
|||
|
|
button.fr-tag--yellow-moutarde,
|
|||
|
|
input[type=button].fr-tag--yellow-moutarde {
|
|||
|
|
color: var(--text-action-high-yellow-moutarde);
|
|||
|
|
background-color: var(--background-action-low-yellow-moutarde);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-yellow-moutarde-hover);
|
|||
|
|
--active: var(--background-action-low-yellow-moutarde-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--orange-terre-battue,
|
|||
|
|
button.fr-tag--orange-terre-battue,
|
|||
|
|
input[type=button].fr-tag--orange-terre-battue {
|
|||
|
|
color: var(--text-action-high-orange-terre-battue);
|
|||
|
|
background-color: var(--background-action-low-orange-terre-battue);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-orange-terre-battue-hover);
|
|||
|
|
--active: var(--background-action-low-orange-terre-battue-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-cafe-creme,
|
|||
|
|
button.fr-tag--brown-cafe-creme,
|
|||
|
|
input[type=button].fr-tag--brown-cafe-creme {
|
|||
|
|
color: var(--text-action-high-brown-cafe-creme);
|
|||
|
|
background-color: var(--background-action-low-brown-cafe-creme);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-brown-cafe-creme-hover);
|
|||
|
|
--active: var(--background-action-low-brown-cafe-creme-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-caramel,
|
|||
|
|
button.fr-tag--brown-caramel,
|
|||
|
|
input[type=button].fr-tag--brown-caramel {
|
|||
|
|
color: var(--text-action-high-brown-caramel);
|
|||
|
|
background-color: var(--background-action-low-brown-caramel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-brown-caramel-hover);
|
|||
|
|
--active: var(--background-action-low-brown-caramel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-opera,
|
|||
|
|
button.fr-tag--brown-opera,
|
|||
|
|
input[type=button].fr-tag--brown-opera {
|
|||
|
|
color: var(--text-action-high-brown-opera);
|
|||
|
|
background-color: var(--background-action-low-brown-opera);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-brown-opera-hover);
|
|||
|
|
--active: var(--background-action-low-brown-opera-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--beige-gris-galet,
|
|||
|
|
button.fr-tag--beige-gris-galet,
|
|||
|
|
input[type=button].fr-tag--beige-gris-galet {
|
|||
|
|
color: var(--text-action-high-beige-gris-galet);
|
|||
|
|
background-color: var(--background-action-low-beige-gris-galet);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-action-low-beige-gris-galet-hover);
|
|||
|
|
--active: var(--background-action-low-beige-gris-galet-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled),
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: var(--text-inverted-blue-france);
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, var(--background-active-blue-france) 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled):hover,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled):hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, var(--background-active-blue-france-hover) 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled):active,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled):active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, var(--background-active-blue-france-active) 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]::after {
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:disabled,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:disabled {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, var(--background-disabled-grey) 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:disabled::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:disabled::after {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-active-blue-france) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:hover,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-active-blue-france-hover) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:active,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-active-blue-france-active) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:disabled,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:disabled {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-disabled-grey) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag:disabled,
|
|||
|
|
input[type=button].fr-tag:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a:not([href]).fr-tag {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true],
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true] {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-active-blue-france) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:hover,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-active-blue-france-hover) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:active,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-active-blue-france-active) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:disabled,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:disabled {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, var(--background-disabled-grey) 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
Download
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-download__link {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
position: relative;
|
|||
|
|
padding-bottom: 1.5rem;
|
|||
|
|
margin: 0 0 1rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download .fr-download__link {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
font-weight: 400;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download .fr-download__link::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download__desc {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download__detail {
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
max-width: 100%;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
pointer-events: none;
|
|||
|
|
cursor: text;
|
|||
|
|
overflow: hidden;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download__detail abbr {
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card {
|
|||
|
|
padding: 1.5rem 1.5rem 4rem 1.5rem;
|
|||
|
|
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__link {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__link::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
position: absolute;
|
|||
|
|
right: 1.5rem;
|
|||
|
|
bottom: 1.5rem;
|
|||
|
|
margin: 0;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__desc {
|
|||
|
|
display: block;
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__detail {
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 1.5rem;
|
|||
|
|
left: 1.5rem;
|
|||
|
|
max-width: calc(100% - 6.25rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__detail[class^=fr-icon-]::before,
|
|||
|
|
.fr-download--card .fr-download__detail[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-download--card .fr-download__detail[class^=fr-fi-]::before,
|
|||
|
|
.fr-download--card .fr-download__detail[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
margin: var(--title-spacing);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group--bordered {
|
|||
|
|
padding: 1.5rem 1.5rem 0.5rem;
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group > ul {
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group > ul > li {
|
|||
|
|
padding-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group .fr-download {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group li::marker {
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
ALERT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-alert {
|
|||
|
|
position: relative;
|
|||
|
|
padding: 1rem 2.25rem 0.75rem 3.5rem;
|
|||
|
|
|
|||
|
|
--title-spacing: 0 0 0.25rem;
|
|||
|
|
--text-spacing: 0 0 0.25rem;
|
|||
|
|
background-size: 100% 1px, 1px 100%, 100% 1px, 2.5rem 100%;
|
|||
|
|
background-position: 0 0, 100% 0, 0 100%, 0 0, 100% 100%;
|
|||
|
|
background-repeat: no-repeat, no-repeat no-repeat, no-repeat;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-grey), var(--border-plain-grey)), linear-gradient(0deg, var(--border-plain-grey), var(--border-plain-grey)), linear-gradient(0deg, var(--border-plain-grey), var(--border-plain-grey)), linear-gradient(0deg, var(--border-plain-grey), var(--border-plain-grey)), linear-gradient(0deg, var(--background-flat-grey), var(--background-flat-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
margin: 1rem 0.5rem;
|
|||
|
|
color: var(--text-inverted-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert .fr-btn--close {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0.25rem;
|
|||
|
|
right: 0.25rem;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert .fr-btn--close::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert + .fr-alert {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--info::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--success::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--error::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--warning::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--warning-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--warning-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--info::before,
|
|||
|
|
.fr-alert--success::before,
|
|||
|
|
.fr-alert--error::before,
|
|||
|
|
.fr-alert--warning::before {
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--sm {
|
|||
|
|
padding: 0.5rem 2.25rem 0.25rem 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--sm::before {
|
|||
|
|
margin: 0.5rem 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert .fr-link--close {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0.25rem;
|
|||
|
|
right: 1.25rem;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert .fr-link--close::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--info {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-info), var(--border-plain-info)), linear-gradient(0deg, var(--border-plain-info), var(--border-plain-info)), linear-gradient(0deg, var(--border-plain-info), var(--border-plain-info)), linear-gradient(0deg, var(--border-plain-info), var(--border-plain-info)), linear-gradient(0deg, var(--background-flat-info), var(--background-flat-info));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--error {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error)), linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error)), linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error)), linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error)), linear-gradient(0deg, var(--background-flat-error), var(--background-flat-error));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--success {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success)), linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success)), linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success)), linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success)), linear-gradient(0deg, var(--background-flat-success), var(--background-flat-success));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--warning {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-warning), var(--border-plain-warning)), linear-gradient(0deg, var(--border-plain-warning), var(--border-plain-warning)), linear-gradient(0deg, var(--border-plain-warning), var(--border-plain-warning)), linear-gradient(0deg, var(--border-plain-warning), var(--border-plain-warning)), linear-gradient(0deg, var(--background-flat-warning), var(--background-flat-warning));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
ALERT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-notice {
|
|||
|
|
position: relative;
|
|||
|
|
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
padding-top: 1rem;
|
|||
|
|
padding-bottom: 1rem;
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice__body {
|
|||
|
|
position: relative;
|
|||
|
|
padding: 0 2.5rem 0 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice__body::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
position: absolute;
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice__title {
|
|||
|
|
position: relative;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice .fr-btn--close {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2rem;
|
|||
|
|
max-height: 2rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
position: absolute;
|
|||
|
|
top: -0.25rem;
|
|||
|
|
right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice .fr-btn--close::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
mask-image: url("../icons/system/close-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice--info .fr-notice__body::before {
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice--info {
|
|||
|
|
background-color: var(--background-contrast-info);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-info-hover);
|
|||
|
|
--active: var(--background-contrast-info-active);
|
|||
|
|
color: var(--text-default-info);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
RADIO
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-radio-group {
|
|||
|
|
position: relative;
|
|||
|
|
max-width: max-content;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio] {
|
|||
|
|
position: absolute;
|
|||
|
|
margin: 0;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
opacity: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio] + label {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
padding-left: 2rem;
|
|||
|
|
background-position: calc(-0.25rem + 1px) calc(-0.25rem + 1px), calc(-0.25rem + 1px) calc(-0.25rem + 1px);
|
|||
|
|
background-size: 1.875rem 1.875rem, 1.875rem 1.875rem;
|
|||
|
|
background-repeat: no-repeat, no-repeat;
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-action-high-blue-france) 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio] + label::before {
|
|||
|
|
content: "";
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
border-radius: 1.5rem;
|
|||
|
|
margin-left: -2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio] + label .fr-hint-text {
|
|||
|
|
margin: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio] {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
top: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
padding-left: 1.5rem;
|
|||
|
|
background-position: calc(-0.125rem + 1px) calc(0.25rem - 1px), calc(-0.125rem + 1px) calc(0.25rem - 1px);
|
|||
|
|
background-size: 1.125rem 1.125rem, 1.125rem 1.125rem;
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-action-high-blue-france) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio] + label::before {
|
|||
|
|
top: 0.25rem;
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
border-radius: 1rem;
|
|||
|
|
margin-left: -1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich {
|
|||
|
|
position: relative;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio] {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
left: 1.75rem;
|
|||
|
|
top: calc(50% - 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio] + label {
|
|||
|
|
padding-left: 3.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
align-self: stretch;
|
|||
|
|
min-height: 5rem;
|
|||
|
|
width: 100%;
|
|||
|
|
padding-top: 0.5rem;
|
|||
|
|
padding-bottom: 0.5rem;
|
|||
|
|
padding-right: 1.5rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: stretch;
|
|||
|
|
justify-content: center;
|
|||
|
|
background-size: 100% 1px, 1px 100%, 100% 1px, 1px 100%, 1.125rem 1.125rem, 1.125rem 1.125rem;
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
|
|||
|
|
background-position: 0 0, 100% 0, 0 100%, 0 0, 1.75rem 50%, 1.75rem 50%;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), radial-gradient(transparent 6px, var(--border-action-high-blue-france) 7px, transparent 8px);
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio] + label::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
margin-left: 0;
|
|||
|
|
border-radius: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio] + label .fr-hint-text {
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:not(:disabled) ~ label {
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
--active-tint: var(--active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:not(:disabled) ~ label:hover {
|
|||
|
|
background-color: var(--hover-tint);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:not(:disabled) ~ label:active {
|
|||
|
|
background-color: var(--active-tint);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:not(:disabled) ~ label:hover + .fr-radio-rich__pictogram {
|
|||
|
|
background-color: var(--hover);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:not(:disabled) ~ label:active + .fr-radio-rich__pictogram {
|
|||
|
|
background-color: var(--active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich__pictogram {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-left: -1px;
|
|||
|
|
padding: 0.25rem;
|
|||
|
|
width: 5.5rem;
|
|||
|
|
min-width: 5.5rem;
|
|||
|
|
align-self: stretch;
|
|||
|
|
pointer-events: none;
|
|||
|
|
background-size: 100% 1px, 100% 1px, 1px 100%, 1px calc(100% - 0.5rem);
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
|
|||
|
|
background-position: 0 0, 0 100%, 100% 0, 0 0.25rem;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich__pictogram img,
|
|||
|
|
.fr-radio-rich__pictogram svg {
|
|||
|
|
max-width: 3.5rem;
|
|||
|
|
max-height: 3.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-control > .fr-radio-rich.fr-radio-group {
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--background-disabled-grey) 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-active-blue-france) 11px, transparent 12px), radial-gradient(var(--background-active-blue-france) 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--background-disabled-grey) 11px, transparent 12px), radial-gradient(var(--background-disabled-grey) 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-plain-error) 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-plain-error) 11px, transparent 12px), radial-gradient(var(--background-active-blue-france) 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-plain-success) 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-plain-success) 11px, transparent 12px), radial-gradient(var(--background-active-blue-france) 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-plain-info) 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--border-plain-info) 11px, transparent 12px), radial-gradient(var(--background-active-blue-france) 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--background-disabled-grey) 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, var(--background-disabled-grey) 11px, transparent 12px), radial-gradient(var(--background-disabled-grey) 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-active-blue-france) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px), radial-gradient(var(--background-disabled-grey) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-plain-error) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-plain-error) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-plain-success) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-plain-success) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-plain-info) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--border-plain-info) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group--sm input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group--sm input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px), radial-gradient(var(--background-disabled-grey) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled ~ .fr-radio-rich__pictogram svg * {
|
|||
|
|
fill: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-active-blue-france), var(--border-active-blue-france)), linear-gradient(0deg, var(--border-active-blue-france), var(--border-active-blue-france)), linear-gradient(0deg, var(--border-active-blue-france), var(--border-active-blue-france)), linear-gradient(0deg, var(--border-active-blue-france), var(--border-active-blue-france)), radial-gradient(transparent 6px, var(--border-active-blue-france) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked ~ .fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--text-disabled-grey), var(--text-disabled-grey)), linear-gradient(0deg, var(--text-disabled-grey), var(--text-disabled-grey)), linear-gradient(0deg, var(--text-disabled-grey), var(--text-disabled-grey)), linear-gradient(0deg, var(--text-disabled-grey), var(--text-disabled-grey)), radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px), radial-gradient(var(--background-disabled-grey) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled ~ .fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, var(--background-disabled-grey), var(--background-disabled-grey)), linear-gradient(0deg, var(--background-disabled-grey), var(--background-disabled-grey)), linear-gradient(0deg, var(--background-disabled-grey), var(--background-disabled-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), radial-gradient(transparent 6px, var(--border-plain-error) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), radial-gradient(transparent 6px, var(--border-plain-error) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), radial-gradient(transparent 6px, var(--border-plain-success) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), radial-gradient(transparent 6px, var(--border-plain-success) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), radial-gradient(transparent 6px, var(--border-plain-info) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), radial-gradient(transparent 6px, var(--border-plain-info) 7px, transparent 8px), radial-gradient(var(--background-active-blue-france) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-rich input[type=radio]:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-rich input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), radial-gradient(transparent 6px, var(--background-disabled-grey) 7px, transparent 8px), radial-gradient(var(--background-disabled-grey) 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-fieldset__content .fr-radio-group:not(.fr-radio-rich) input[type=radio] + label {
|
|||
|
|
background-position: calc(-0.25rem + 1px) calc(0.5rem + 1px), calc(-0.25rem + 1px) calc(0.5rem + 1px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-fieldset__content .fr-radio-group--sm:not(.fr-radio-rich) input[type=radio] + label {
|
|||
|
|
background-position: calc(-0.125rem + 1px) calc(1rem - 1px), calc(-0.125rem + 1px) calc(1rem - 1px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-fieldset__content .fr-radio-rich {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-fieldset__content .fr-radio-rich:last-child {
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-fieldset__content .fr-radio-rich:first-child {
|
|||
|
|
margin-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-fieldset__content .fr-radio-rich:not(:last-child) {
|
|||
|
|
margin-right: 0.75rem;
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-fieldset__content .fr-radio-rich:first-child {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-fieldset__content .fr-radio-rich:first-child .fr-radio-rich__img {
|
|||
|
|
top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-fieldset__content .fr-radio-rich__img {
|
|||
|
|
top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--inline .fr-hint-text + .fr-fieldset__content .fr-radio-rich:first-child {
|
|||
|
|
margin-top: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich__img {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-left: -1px;
|
|||
|
|
padding: 0.25rem;
|
|||
|
|
width: 5.5rem;
|
|||
|
|
min-width: 5.5rem;
|
|||
|
|
align-self: stretch;
|
|||
|
|
pointer-events: none;
|
|||
|
|
background-size: 100% 1px, 100% 1px, 1px 100%, 1px calc(100% - 0.5rem);
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
|
|||
|
|
background-position: 0 0, 0 100%, 100% 0, 0 0.25rem;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich__img img,
|
|||
|
|
.fr-radio-rich__img svg {
|
|||
|
|
max-width: 3.5rem;
|
|||
|
|
max-height: 3.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:not(:disabled) ~ label:hover + .fr-radio-rich__img {
|
|||
|
|
background-color: var(--hover);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:not(:disabled) ~ label:active + .fr-radio-rich__img {
|
|||
|
|
background-color: var(--active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled ~ .fr-radio-rich__img svg * {
|
|||
|
|
fill: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked ~ .fr-radio-rich__img {
|
|||
|
|
background-image: linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--background-action-high-blue-france), var(--background-action-high-blue-france)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled ~ .fr-radio-rich__img {
|
|||
|
|
background-image: linear-gradient(0deg, var(--text-disabled-grey), var(--text-disabled-grey)), linear-gradient(0deg, var(--text-disabled-grey), var(--text-disabled-grey)), linear-gradient(0deg, var(--text-disabled-grey), var(--text-disabled-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
CARD
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-card {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
position: relative;
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link .fr-card__title a::after {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
position: absolute;
|
|||
|
|
right: 2rem;
|
|||
|
|
bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card:not(.fr-card--no-border):not(.fr-card--shadow) {
|
|||
|
|
background-size: 100% 1px, 1px 100%, 1px 100%, 100% 1px;
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
|
|||
|
|
background-position: 100% 100%, 0 0, 100% 0, 100% 0;
|
|||
|
|
padding: 1px;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-icon .fr-card__title a:not([target=_blank])::after,
|
|||
|
|
.fr-card:not(.fr-enlarge-link):not(.fr-card--download) .fr-card__title a:not([target=_blank])::after {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__body {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
height: 100%;
|
|||
|
|
flex: 1 1 auto;
|
|||
|
|
order: 2;
|
|||
|
|
padding: 0 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-grid-row .fr-card {
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__header {
|
|||
|
|
order: 1;
|
|||
|
|
position: relative;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__header .fr-badges-group {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
padding: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link:hover .fr-card__img,
|
|||
|
|
.fr-card.fr-enlarge-link:hover .fr-card__vid {
|
|||
|
|
--brightness: calc(100% + var(--brighten) * 10%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link:active .fr-card__img,
|
|||
|
|
.fr-card.fr-enlarge-link:active .fr-card__vid {
|
|||
|
|
--brightness: calc(100% + var(--brighten) * 20%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__img,
|
|||
|
|
.fr-card__vid {
|
|||
|
|
filter: brightness(var(--brightness));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__img img,
|
|||
|
|
.fr-card__img svg,
|
|||
|
|
.fr-card__vid iframe,
|
|||
|
|
.fr-card__vid video {
|
|||
|
|
aspect-ratio: 1.7777777778;
|
|||
|
|
object-fit: cover;
|
|||
|
|
object-position: 50% 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__img img {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__content {
|
|||
|
|
order: 1;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
padding: 2rem;
|
|||
|
|
height: 100%;
|
|||
|
|
margin: 0 -2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title {
|
|||
|
|
order: 2;
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title a::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-right-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-right-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title [target=_blank]::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/external-link-line.svg");
|
|||
|
|
mask-image: url("../icons/system/external-link-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__desc {
|
|||
|
|
order: 3;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__start {
|
|||
|
|
order: 1;
|
|||
|
|
margin-bottom: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__start .fr-badges-group,
|
|||
|
|
.fr-card__start .fr-tags-group {
|
|||
|
|
margin-bottom: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__start .fr-card__detail {
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__end {
|
|||
|
|
order: 4;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
padding-top: 0.5rem;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__detail {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__detail[class^=fr-icon-]::before,
|
|||
|
|
.fr-card__detail[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-card__detail[class^=fr-fi-]::before,
|
|||
|
|
.fr-card__detail[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__end {
|
|||
|
|
margin-bottom: -3rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding-right: 2rem;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__content {
|
|||
|
|
padding-bottom: 5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__footer {
|
|||
|
|
order: 2;
|
|||
|
|
padding: 0.5rem 2rem 2rem;
|
|||
|
|
margin: 0 -2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__footer .fr-btns-group,
|
|||
|
|
.fr-card__footer .fr-links-group {
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__header .fr-badge {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.125rem;
|
|||
|
|
padding: 0 0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__header .fr-badge::before,
|
|||
|
|
.fr-card--sm .fr-card__header .fr-badge::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__header .fr-tag {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.5rem;
|
|||
|
|
padding: 0.125rem 0.5rem;
|
|||
|
|
border-radius: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__header .fr-tag::before,
|
|||
|
|
.fr-card--sm .fr-card__header .fr-tag::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__content {
|
|||
|
|
padding: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__content .fr-badge {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.125rem;
|
|||
|
|
padding: 0 0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__content .fr-badge::before,
|
|||
|
|
.fr-card--sm .fr-card__content .fr-badge::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__content .fr-tag {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.5rem;
|
|||
|
|
padding: 0.125rem 0.5rem;
|
|||
|
|
border-radius: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__content .fr-tag::before,
|
|||
|
|
.fr-card--sm .fr-card__content .fr-tag::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__title a::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__desc {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__start .fr-badges-group,
|
|||
|
|
.fr-card--sm .fr-card__start .fr-tags-group {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__start .fr-card__detail {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__end {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
padding-top: 0.25rem;
|
|||
|
|
margin-top: 1.5rem;
|
|||
|
|
padding-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__end {
|
|||
|
|
margin-bottom: -2rem;
|
|||
|
|
min-height: 1.25rem;
|
|||
|
|
padding-right: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__content {
|
|||
|
|
padding-bottom: 3.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__title a::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
right: 1.5rem;
|
|||
|
|
bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__footer {
|
|||
|
|
padding: 0.5rem 1.5rem 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__content {
|
|||
|
|
padding: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__title a::after {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__desc {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__start {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__start .fr-badges-group,
|
|||
|
|
.fr-card--lg .fr-card__start .fr-tags-group {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__start .fr-card__detail {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__end {
|
|||
|
|
margin-bottom: -4rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding-right: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__content {
|
|||
|
|
padding-bottom: 6.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__title a::after {
|
|||
|
|
--icon-size: 2rem;
|
|||
|
|
right: 2.5rem;
|
|||
|
|
bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__footer {
|
|||
|
|
padding: 0.5rem 2.5rem 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header {
|
|||
|
|
aspect-ratio: 16/9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header .fr-card__img {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0.5rem;
|
|||
|
|
left: 0.5rem;
|
|||
|
|
width: calc(100% - 1rem);
|
|||
|
|
height: calc(100% - 1rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header .fr-card__img img {
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: 100%;
|
|||
|
|
object-fit: contain;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__title a::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__body > .fr-card__detail,
|
|||
|
|
.fr-card__body > .fr-card__title {
|
|||
|
|
margin-top: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__body > .fr-card__detail {
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__body > .fr-card__desc,
|
|||
|
|
.fr-card__body > .fr-card__title {
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__body > .fr-card__desc {
|
|||
|
|
margin-top: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link:not(.fr-card--no-arrow) .fr-card__body > .fr-card__desc,
|
|||
|
|
.fr-card.fr-enlarge-link:not(.fr-card--no-arrow) .fr-card__body > .fr-card__title {
|
|||
|
|
margin-bottom: 4.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link:not(.fr-card--no-arrow) .fr-card__body > .fr-card__desc {
|
|||
|
|
margin-top: -3.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--grey {
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--shadow {
|
|||
|
|
z-index: calc(var(--ground) + 500);
|
|||
|
|
background-color: var(--background-raised-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-raised-grey-hover);
|
|||
|
|
--active: var(--background-raised-grey-active);
|
|||
|
|
filter: drop-shadow(var(--raised-shadow));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--shadow.fr-card--grey {
|
|||
|
|
background-color: var(--background-contrast-raised-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-raised-grey-hover);
|
|||
|
|
--active: var(--background-contrast-raised-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-background {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download:not(.fr-card--no-background) .fr-card__header {
|
|||
|
|
background-color: var(--background-alt-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-grey-hover);
|
|||
|
|
--active: var(--background-alt-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title a[href] {
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title:disabled,
|
|||
|
|
a.fr-card__title:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
CHECKBOX
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-checkbox-group {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox] {
|
|||
|
|
position: absolute;
|
|||
|
|
margin: 0;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
opacity: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox] + label {
|
|||
|
|
position: relative;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin-left: 2rem;
|
|||
|
|
|
|||
|
|
--data-uri-svg: none;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* On ajoute l'icône check-line en taille sm via un pseudo element before
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox] + label .fr-hint-text {
|
|||
|
|
margin: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox] + label::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: -2rem;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
border-radius: 0.25rem;
|
|||
|
|
background-size: 0.25rem 0.25rem, calc(100% - 0.25rem) 1px, 0.25rem 0.25rem, 1px calc(100% - 0.5rem), 0.25rem 0.25rem, calc(100% - 0.5rem) 1px, 0.25rem 0.25rem, 1px calc(100% - 0.5rem), 1rem;
|
|||
|
|
background-position: 0 0, 0.25rem 0, 100% 0, 0 0.25rem, 100% 100%, calc(100% - 0.25rem) 100%, 0 100%, 100% 0.25rem, center;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--sm input[type=checkbox] {
|
|||
|
|
top: 0.25rem;
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--sm input[type=checkbox] + label {
|
|||
|
|
margin-left: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--sm input[type=checkbox] + label::before {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
margin-top: 0.25rem;
|
|||
|
|
left: -1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error::before {
|
|||
|
|
content: "";
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: -0.75rem;
|
|||
|
|
width: 2px;
|
|||
|
|
height: 100%;
|
|||
|
|
background-color: var(--border-plain-error);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--border-plain-error-hover);
|
|||
|
|
--active: var(--border-plain-error-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid::before {
|
|||
|
|
content: "";
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: -0.75rem;
|
|||
|
|
width: 2px;
|
|||
|
|
height: 100%;
|
|||
|
|
background-color: var(--border-plain-success);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--border-plain-success-hover);
|
|||
|
|
--active: var(--border-plain-success-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group .fr-message:first-child {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox]:checked + label::before {
|
|||
|
|
background-color: var(--background-active-blue-france);
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), var(--data-uri-svg);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23f5f5fe' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-checkbox-group input[type=checkbox]:checked + label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23000091' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox]:disabled + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox]:disabled:checked + label::before {
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23929292' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-checkbox-group input[type=checkbox]:disabled:checked + label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23666' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox] + label,
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox]:checked + label {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox] + label::before,
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox]:checked + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox] + label,
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox]:checked + label {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox] + label::before,
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox]:checked + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-checkbox-group input[type=checkbox] + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-checkbox-group input[type=checkbox] + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-fieldset__content .fr-checkbox-group--sm label::before {
|
|||
|
|
margin-top: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-fieldset__content .fr-checkbox-group input[type=checkbox] {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
SEGMENTED
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-segmented {
|
|||
|
|
position: relative;
|
|||
|
|
padding: 0;
|
|||
|
|
margin: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
align-items: center;
|
|||
|
|
border: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__legend {
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__legend .fr-hint-text {
|
|||
|
|
margin-top: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__legend--inline {
|
|||
|
|
float: left;
|
|||
|
|
display: contents;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__legend--inline + .fr-segmented__elements {
|
|||
|
|
margin-left: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__elements {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
border-radius: 0.25rem;
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented .fr-segmented__element input {
|
|||
|
|
opacity: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input {
|
|||
|
|
position: absolute;
|
|||
|
|
margin: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
z-index: -1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input + label {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
width: 100%;
|
|||
|
|
font-weight: 500;
|
|||
|
|
display: inline-flex;
|
|||
|
|
align-items: center;
|
|||
|
|
border-radius: 0.25rem;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input + label::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input:not([disabled]):not(:checked) + label {
|
|||
|
|
-webkit-mask-image: linear-gradient(0deg, #fff 0, #fff 100%), linear-gradient(0deg, #fff 0, #fff 100%), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>"), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>"), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>"), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>");
|
|||
|
|
mask-image: linear-gradient(0deg, #fff 0, #fff 100%), linear-gradient(0deg, #fff 0, #fff 100%), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>"), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>"), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>"), url("data:image/svg+xml;charset=uft8,<svg xmlns='http://www.w3.org/2000/svg' width='4px' height='4px' viewBox='0 0 4 4'><circle fill='%23fff' r='2' cx='2' cy='2' /></svg>");
|
|||
|
|
-webkit-mask-size: calc(100% - 0.5rem) calc(100% - 0.75rem), calc(100% - 0.75rem) calc(100% - 0.5rem), 0.25rem 0.25rem, 0.25rem 0.25rem, 0.25rem 0.25rem, 0.25rem 0.25rem;
|
|||
|
|
mask-size: calc(100% - 0.5rem) calc(100% - 0.75rem), calc(100% - 0.75rem) calc(100% - 0.5rem), 0.25rem 0.25rem, 0.25rem 0.25rem, 0.25rem 0.25rem, 0.25rem 0.25rem;
|
|||
|
|
-webkit-mask-position: 0.25rem 0.375rem, 0.375rem 0.25rem, 0.25rem 0.25rem, calc(100% - 0.25rem) 0.25rem, 0.25rem calc(100% - 0.25rem), calc(100% - 0.25rem) calc(100% - 0.25rem);
|
|||
|
|
mask-position: 0.25rem 0.375rem, 0.375rem 0.25rem, 0.25rem 0.25rem, calc(100% - 0.25rem) 0.25rem, 0.25rem calc(100% - 0.25rem), calc(100% - 0.25rem) calc(100% - 0.25rem);
|
|||
|
|
-webkit-mask-repeat: no-repeat;
|
|||
|
|
mask-repeat: no-repeat;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input:not([disabled]):not(:checked) + label:hover {
|
|||
|
|
background-color: var(--hover);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input:not([disabled]):not(:checked) + label:active {
|
|||
|
|
background-color: var(--active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--vertical .fr-segmented__elements {
|
|||
|
|
flex-direction: column;
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--vertical .fr-segmented__legend--inline {
|
|||
|
|
float: none;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--no-legend legend {
|
|||
|
|
position: absolute;
|
|||
|
|
width: 1px;
|
|||
|
|
height: 1px;
|
|||
|
|
padding: 0;
|
|||
|
|
margin: -1px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
clip: rect(0, 0, 0, 0);
|
|||
|
|
white-space: nowrap; /* added line */
|
|||
|
|
border: 0;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--no-legend legend + .fr-segmented__elements {
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element input:focus + label {
|
|||
|
|
outline-offset: 2px;
|
|||
|
|
outline-width: 2px;
|
|||
|
|
outline-color: #0a76f6;
|
|||
|
|
outline-style: solid;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element input:focus:not(:focus-visible) + label {
|
|||
|
|
outline-style: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element input:focus-visible + label {
|
|||
|
|
outline-style: solid;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--sm .fr-segmented__legend {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--sm input + label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--sm input + label::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element label {
|
|||
|
|
color: var(--text-action-high-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element input:checked + label {
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-active-blue-france);
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element input:checked:disabled + label {
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--text-disabled-grey);
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TOGGLE
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-toggle {
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
position: relative;
|
|||
|
|
padding: 1rem 0;
|
|||
|
|
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox] {
|
|||
|
|
width: 2.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
position: absolute;
|
|||
|
|
opacity: 0;
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label[data-fr-unchecked-label][data-fr-checked-label]::before {
|
|||
|
|
content: attr(data-fr-checked-label);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::after {
|
|||
|
|
transform: translateX(1rem);
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23000091' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label {
|
|||
|
|
--toggle-status-width: auto;
|
|||
|
|
display: inline-flex;
|
|||
|
|
width: calc(100% - 2rem);
|
|||
|
|
min-height: 1.5rem;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
color: var(--text-label-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label[data-fr-unchecked-label][data-fr-checked-label] {
|
|||
|
|
padding-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label[data-fr-unchecked-label][data-fr-checked-label]::before {
|
|||
|
|
content: attr(data-fr-unchecked-label);
|
|||
|
|
margin-right: calc(var(--toggle-status-width) - 0.5rem);
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label[data-fr-unchecked-label][data-fr-checked-label] + .fr-hint-text {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
height: calc(1.25rem + 1px);
|
|||
|
|
padding-top: 1.75rem;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
border-radius: 0.75rem;
|
|||
|
|
margin-right: 2rem;
|
|||
|
|
min-width: 2.5rem;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23000091' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label::after {
|
|||
|
|
content: "";
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 1rem;
|
|||
|
|
left: 0;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 1rem;
|
|||
|
|
background-position: center;
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-action-high-blue-france);
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle .fr-hint-text {
|
|||
|
|
display: block;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--label-left .fr-toggle__input {
|
|||
|
|
order: 1;
|
|||
|
|
margin: 0 0 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--label-left .fr-toggle__input + label[data-fr-checked-label]::before {
|
|||
|
|
margin-right: 0;
|
|||
|
|
margin-left: calc(var(--toggle-status-width) - 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--label-left .fr-toggle__label {
|
|||
|
|
justify-content: space-between;
|
|||
|
|
padding-left: 0;
|
|||
|
|
width: calc(100% - 2rem);
|
|||
|
|
flex: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--label-left .fr-toggle__label::before {
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
order: 1;
|
|||
|
|
margin-left: 1rem;
|
|||
|
|
margin-right: 0;
|
|||
|
|
text-align: right;
|
|||
|
|
direction: rtl;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--label-left .fr-toggle__label::after {
|
|||
|
|
left: auto;
|
|||
|
|
right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--label-left .fr-hint-text {
|
|||
|
|
order: 2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle__list {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-toggle__list li:first-child .fr-toggle {
|
|||
|
|
padding-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-toggle__list li:first-child .fr-toggle label::after {
|
|||
|
|
top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%238585f6' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked {
|
|||
|
|
background-color: var(--background-active-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-active-blue-france-hover);
|
|||
|
|
--active: var(--background-active-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23000091' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%238585f6' height='24' viewBox='0 0 40 24' fill='%238585f6' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::after {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%238585f6' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled {
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked {
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23e5e5e5' height='24' viewBox='0 0 40 24' fill='%23e5e5e5' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%232a2a2a' height='24' viewBox='0 0 40 24' fill='%232a2a2a' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::after {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23929292' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::after {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23666' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::before {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23e5e5e5' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%232a2a2a' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::after {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--border-bottom {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label,
|
|||
|
|
.fr-fieldset--error .fr-toggle label {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label::before,
|
|||
|
|
.fr-fieldset--error .fr-toggle label::before {
|
|||
|
|
color: var(--text-default-error);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23ce0500' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle--error label::before,
|
|||
|
|
:root[data-fr-theme=dark] .fr-fieldset--error .fr-toggle label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23ff5655' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label::after,
|
|||
|
|
.fr-fieldset--error .fr-toggle label::after {
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-plain-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
.fr-fieldset--error .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23ce0500' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle--error input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
:root[data-fr-theme=dark] .fr-fieldset--error .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%23ff5655' height='24' viewBox='0 0 40 24' fill='%238585f6' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label::before,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label::before {
|
|||
|
|
color: var(--text-default-success);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%2318753c' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle--valid label::before,
|
|||
|
|
:root[data-fr-theme=dark] .fr-fieldset--valid .fr-toggle label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%2327a658' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label::after,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label::after {
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-plain-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
.fr-fieldset--valid .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%2318753c' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-toggle--valid input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
:root[data-fr-theme=dark] .fr-fieldset--valid .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg width='40' stroke='%2327a658' height='24' viewBox='0 0 40 24' fill='%238585f6' xmlns='http://www.w3.org/2000/svg'><rect x='0.5' y='0.5' width='39' height='23' rx='11.5' /></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
SKIPLINK
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-skiplinks {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
padding: 1rem 0;
|
|||
|
|
transform: translateY(-100%);
|
|||
|
|
opacity: 0;
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks:focus-within {
|
|||
|
|
position: relative;
|
|||
|
|
transform: translateY(0);
|
|||
|
|
opacity: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list > li {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list > li::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list > li .fr-link {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list > li .fr-link::before,
|
|||
|
|
.fr-skiplinks__list > li .fr-link::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list > li:last-child {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list:focus-within {
|
|||
|
|
position: relative;
|
|||
|
|
transform: translateY(0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
SELECT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-select {
|
|||
|
|
display: block;
|
|||
|
|
-webkit-appearance: none;
|
|||
|
|
-moz-appearance: none;
|
|||
|
|
appearance: none;
|
|||
|
|
width: 100%;
|
|||
|
|
border-radius: 0.25rem 0.25rem 0 0;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0.5rem 2.5rem 0.5rem 1rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: calc(100% - 1rem) 50%;
|
|||
|
|
background-size: 1rem 1rem;
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-grey);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' ><path fill='%23161616' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Mixin pour gérer l'état disabled
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* On applique un style lorsque la valeur est automatiquement remplie par le navigateur
|
|||
|
|
* sur les navigateurs webkit.
|
|||
|
|
*/
|
|||
|
|
/**
|
|||
|
|
* 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-select-group {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group .fr-message:first-child {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--valid::before,
|
|||
|
|
.fr-select-group--error::before,
|
|||
|
|
.fr-select-group--info::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
pointer-events: none;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: -0.75rem;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: -0.75rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: 0 0;
|
|||
|
|
background-size: 0.125rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-select {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' ><path fill='%23fff' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-select,
|
|||
|
|
.fr-select-group--valid .fr-select {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-select,
|
|||
|
|
.fr-select-group--error .fr-select {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--info::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-info), var(--border-plain-info));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' ><path fill='%23929292' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-select:disabled {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' ><path fill='%23666' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select:-webkit-autofill,
|
|||
|
|
.fr-select:-webkit-autofill:hover,
|
|||
|
|
.fr-select:-webkit-autofill:focus {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-grey), inset 0 0 0 1000px var(--background-contrast-blue-france);
|
|||
|
|
-webkit-text-fill-color: var(--text-label-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
CALLOUT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-callout {
|
|||
|
|
position: relative;
|
|||
|
|
padding: 1.5rem;
|
|||
|
|
|
|||
|
|
--title-spacing: 0 0 0.5rem;
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
margin: 0 0 1.5rem;
|
|||
|
|
background-size: 0.25rem 100%;
|
|||
|
|
background-position: 0 0;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Inclusion de l'icône (optionnel)
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Ajout de marge quand on inclut un bouton (optionnel)
|
|||
|
|
*/
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-france), var(--border-default-blue-france));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout[class^=fr-icon-]::before,
|
|||
|
|
.fr-callout[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-callout[class^=fr-fi-]::before,
|
|||
|
|
.fr-callout[class*=" fr-fi-"]::before {
|
|||
|
|
display: block;
|
|||
|
|
margin: -0.5rem 0 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout__text {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout .fr-btn {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout::before {
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-tilleul-verveine {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-tilleul-verveine), var(--border-default-green-tilleul-verveine));
|
|||
|
|
background-color: var(--background-contrast-green-tilleul-verveine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-tilleul-verveine-hover);
|
|||
|
|
--active: var(--background-contrast-green-tilleul-verveine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-bourgeon {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-bourgeon), var(--border-default-green-bourgeon));
|
|||
|
|
background-color: var(--background-contrast-green-bourgeon);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-bourgeon-hover);
|
|||
|
|
--active: var(--background-contrast-green-bourgeon-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-emeraude {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-emeraude), var(--border-default-green-emeraude));
|
|||
|
|
background-color: var(--background-contrast-green-emeraude);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-emeraude-hover);
|
|||
|
|
--active: var(--background-contrast-green-emeraude-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-menthe {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-menthe), var(--border-default-green-menthe));
|
|||
|
|
background-color: var(--background-contrast-green-menthe);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-menthe-hover);
|
|||
|
|
--active: var(--background-contrast-green-menthe-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-archipel {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-green-archipel), var(--border-default-green-archipel));
|
|||
|
|
background-color: var(--background-contrast-green-archipel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-green-archipel-hover);
|
|||
|
|
--active: var(--background-contrast-green-archipel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--blue-ecume {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-ecume), var(--border-default-blue-ecume));
|
|||
|
|
background-color: var(--background-contrast-blue-ecume);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-ecume-hover);
|
|||
|
|
--active: var(--background-contrast-blue-ecume-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--blue-cumulus {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-blue-cumulus), var(--border-default-blue-cumulus));
|
|||
|
|
background-color: var(--background-contrast-blue-cumulus);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-blue-cumulus-hover);
|
|||
|
|
--active: var(--background-contrast-blue-cumulus-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--purple-glycine {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-purple-glycine), var(--border-default-purple-glycine));
|
|||
|
|
background-color: var(--background-contrast-purple-glycine);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-purple-glycine-hover);
|
|||
|
|
--active: var(--background-contrast-purple-glycine-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--pink-macaron {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-pink-macaron), var(--border-default-pink-macaron));
|
|||
|
|
background-color: var(--background-contrast-pink-macaron);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-macaron-hover);
|
|||
|
|
--active: var(--background-contrast-pink-macaron-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--pink-tuile {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-pink-tuile), var(--border-default-pink-tuile));
|
|||
|
|
background-color: var(--background-contrast-pink-tuile);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-pink-tuile-hover);
|
|||
|
|
--active: var(--background-contrast-pink-tuile-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--yellow-tournesol {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-yellow-tournesol), var(--border-default-yellow-tournesol));
|
|||
|
|
background-color: var(--background-contrast-yellow-tournesol);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-tournesol-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-tournesol-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--yellow-moutarde {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-yellow-moutarde), var(--border-default-yellow-moutarde));
|
|||
|
|
background-color: var(--background-contrast-yellow-moutarde);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-yellow-moutarde-hover);
|
|||
|
|
--active: var(--background-contrast-yellow-moutarde-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--orange-terre-battue {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-orange-terre-battue), var(--border-default-orange-terre-battue));
|
|||
|
|
background-color: var(--background-contrast-orange-terre-battue);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-orange-terre-battue-hover);
|
|||
|
|
--active: var(--background-contrast-orange-terre-battue-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-cafe-creme {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-cafe-creme), var(--border-default-brown-cafe-creme));
|
|||
|
|
background-color: var(--background-contrast-brown-cafe-creme);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-cafe-creme-hover);
|
|||
|
|
--active: var(--background-contrast-brown-cafe-creme-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-caramel {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-caramel), var(--border-default-brown-caramel));
|
|||
|
|
background-color: var(--background-contrast-brown-caramel);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-caramel-hover);
|
|||
|
|
--active: var(--background-contrast-brown-caramel-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-opera {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-brown-opera), var(--border-default-brown-opera));
|
|||
|
|
background-color: var(--background-contrast-brown-opera);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-brown-opera-hover);
|
|||
|
|
--active: var(--background-contrast-brown-opera-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--beige-gris-galet {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-beige-gris-galet), var(--border-default-beige-gris-galet));
|
|||
|
|
background-color: var(--background-contrast-beige-gris-galet);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-beige-gris-galet-hover);
|
|||
|
|
--active: var(--background-contrast-beige-gris-galet-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
MODAL
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-modal {
|
|||
|
|
border: none;
|
|||
|
|
color: inherit;
|
|||
|
|
visibility: hidden;
|
|||
|
|
opacity: 0;
|
|||
|
|
background-color: rgba(22, 22, 22, 0.64);
|
|||
|
|
|
|||
|
|
--ground: 2000;
|
|||
|
|
z-index: 1750;
|
|||
|
|
padding: 0;
|
|||
|
|
margin: 0;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: stretch;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
position: fixed;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
transition: opacity 0.3s, visibility 0.3s;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modifier pour fixer la modale en haut en mobile (par defaut en bas)
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal > .fr-container {
|
|||
|
|
pointer-events: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal:focus {
|
|||
|
|
outline: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
width: 0;
|
|||
|
|
height: 2rem;
|
|||
|
|
flex: 1 0 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal::after {
|
|||
|
|
content: none;
|
|||
|
|
display: block;
|
|||
|
|
width: 0;
|
|||
|
|
height: 2rem;
|
|||
|
|
flex: 1 0 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal--top::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal--top::after {
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal--opened {
|
|||
|
|
visibility: inherit;
|
|||
|
|
opacity: 1;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
transition: opacity 0.3s, visibility 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body {
|
|||
|
|
--modal-max-height: calc(100vh - 2rem);
|
|||
|
|
pointer-events: all;
|
|||
|
|
overflow-y: auto;
|
|||
|
|
flex: 1 1 auto;
|
|||
|
|
max-height: var(--modal-max-height);
|
|||
|
|
z-index: calc(var(--ground) + 2000);
|
|||
|
|
background-color: var(--background-lifted-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-lifted-grey-hover);
|
|||
|
|
--active: var(--background-lifted-grey-active);
|
|||
|
|
filter: drop-shadow(var(--lifted-shadow));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__header {
|
|||
|
|
flex: auto 0 0;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
padding: 1rem 1rem 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__content {
|
|||
|
|
padding-left: 1rem;
|
|||
|
|
padding-right: 1rem;
|
|||
|
|
margin-bottom: 3.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__footer {
|
|||
|
|
flex: auto 0 0;
|
|||
|
|
display: flex;
|
|||
|
|
padding: 1rem;
|
|||
|
|
margin-top: -2.5rem;
|
|||
|
|
position: sticky;
|
|||
|
|
bottom: 0;
|
|||
|
|
transition: box-shadow 0.3s;
|
|||
|
|
background-color: var(--background-lifted-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-lifted-grey-hover);
|
|||
|
|
--active: var(--background-lifted-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__footer .fr-btns-group {
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
width: calc(100% + 1rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__title {
|
|||
|
|
--title-spacing: 0 0 1rem 0;
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__title[class^=fr-icon-],
|
|||
|
|
.fr-modal__title[class*=" fr-icon-"],
|
|||
|
|
.fr-modal__title[class^=fr-fi-],
|
|||
|
|
.fr-modal__title[class*=" fr-fi-"] {
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body.fr-scroll-divider .fr-modal__footer {
|
|||
|
|
background-position: 0 0;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 100% 1px;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
NAVIGATION
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-nav {
|
|||
|
|
--underline-img: none;
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__list {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__list > .fr-nav__link,
|
|||
|
|
.fr-nav__list > .fr-nav__btn,
|
|||
|
|
.fr-nav__list > * > .fr-nav__link,
|
|||
|
|
.fr-nav__list > * > .fr-nav__btn {
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: stretch;
|
|||
|
|
flex: 0 1 auto;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: 0 -1px 0 0 var(--border-default-grey), inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item .fr-btn,
|
|||
|
|
.fr-nav__item .fr-link {
|
|||
|
|
min-height: 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link,
|
|||
|
|
.fr-nav__btn {
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
text-align: left;
|
|||
|
|
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
--active-tint: var(--active);
|
|||
|
|
color: var(--text-action-high-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link[aria-current]:not([aria-current=false]),
|
|||
|
|
.fr-nav__btn[aria-current]:not([aria-current=false]) {
|
|||
|
|
position: relative;
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-nav__btn[aria-current]:not([aria-current=false])::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 50%;
|
|||
|
|
left: 0;
|
|||
|
|
width: 2px;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
margin-top: -0.75rem;
|
|||
|
|
background-color: var(--background-active-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-active-blue-france-hover);
|
|||
|
|
--active: var(--background-active-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link:not([href])[aria-current]:not([aria-current=false]) {
|
|||
|
|
pointer-events: none;
|
|||
|
|
cursor: default;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__btn {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex-direction: row;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__btn::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0;
|
|||
|
|
transition: transform 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu {
|
|||
|
|
margin: -4px -1rem;
|
|||
|
|
padding: 4px 1rem;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu.fr-collapsing {
|
|||
|
|
margin-top: 0;
|
|||
|
|
padding-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu__list {
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 0 1rem 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu .fr-nav__link {
|
|||
|
|
padding-left: 1rem;
|
|||
|
|
padding-right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu .fr-nav__link::before {
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu:focus {
|
|||
|
|
outline: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu > .fr-container {
|
|||
|
|
padding: 0.5rem 1rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu .fr-btn--close {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu .fr-nav__link {
|
|||
|
|
padding-left: 1rem;
|
|||
|
|
padding-right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu .fr-nav__link::before {
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__leader {
|
|||
|
|
--underline-img: linear-gradient(0deg, currentColor, currentColor);
|
|||
|
|
padding-top: 0.5rem;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 0.5rem;
|
|||
|
|
--title-spacing: 0 0 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__leader .fr-link {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__leader .fr-link::before,
|
|||
|
|
.fr-mega-menu__leader .fr-link::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__leader p {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__category {
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__list {
|
|||
|
|
padding-bottom: 1rem;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__list::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__btn[aria-expanded=true]:not(:disabled) {
|
|||
|
|
background-color: var(--background-open-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-open-blue-france-hover);
|
|||
|
|
--active: var(--background-open-blue-france-active);
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item:first-child::before {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item:last-child::before {
|
|||
|
|
box-shadow: 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
SHARE
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-share {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 1rem;
|
|||
|
|
--title-spacing: 0 0 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__title {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
order: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__text {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
order: 3;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btns-group {
|
|||
|
|
width: auto;
|
|||
|
|
order: 2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btns-group .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btns-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--facebook::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/facebook-circle-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/facebook-circle-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--linkedin::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/linkedin-box-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/linkedin-box-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--mastodon::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/mastodon-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/mastodon-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--threads::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/threads-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/threads-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--twitter::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/twitter-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/twitter-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--twitter-x::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/twitter-x-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/twitter-x-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--mail::before {
|
|||
|
|
-webkit-mask-image: url("../icons/business/mail-line.svg");
|
|||
|
|
mask-image: url("../icons/business/mail-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--copy::before {
|
|||
|
|
-webkit-mask-image: url("../icons/business/links-fill.svg");
|
|||
|
|
mask-image: url("../icons/business/links-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
margin-left: -0.5rem;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
width: auto;
|
|||
|
|
order: 2;
|
|||
|
|
display: flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__group .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link {
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
display: inline-flex;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--facebook {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--facebook::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/facebook-circle-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/facebook-circle-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--twitter {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--twitter::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/twitter-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/twitter-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--linkedin {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--linkedin::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/linkedin-box-line.svg");
|
|||
|
|
mask-image: url("../icons/logo/linkedin-box-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--mail {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--mail::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/business/mail-line.svg");
|
|||
|
|
mask-image: url("../icons/business/mail-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--copy {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link--copy::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/business/links-fill.svg");
|
|||
|
|
mask-image: url("../icons/business/links-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled,
|
|||
|
|
.fr-share a.fr-btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link:disabled,
|
|||
|
|
a.fr-share__link:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
FOOTER
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-footer {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
width: 100%;
|
|||
|
|
padding-top: 2rem;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Conteneur du bloc marque, avec le logo principal et éventuellement
|
|||
|
|
* un logo opérateur
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Hauteur auto pour le logo opérateur
|
|||
|
|
*/
|
|||
|
|
/**
|
|||
|
|
* Contenu texte simple
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Liste des liens situés en dessous de la partie texte
|
|||
|
|
*/
|
|||
|
|
/**
|
|||
|
|
* Catégorie (optionnel)
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Style de la liste
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Style du lien
|
|||
|
|
*/
|
|||
|
|
/**
|
|||
|
|
* Liste de liens avec séparateur
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Style du lien de la liste
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Copyright
|
|||
|
|
*/
|
|||
|
|
/**
|
|||
|
|
* Container des logos partenaires (principaux et secondaires)
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Container des logos partenaires principaux
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Container des logos partenaires secondaires
|
|||
|
|
*/
|
|||
|
|
box-shadow: inset 0 2px 0 0 var(--border-plain-blue-france), inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__body {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__body + .fr-footer__bottom {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Si on ajoute un logo opérateur à côté du logo principal, on lui applique une marge à gauche
|
|||
|
|
* On prévoit que le logo soit encapsulé dans un <a>, ou bien directement en img ou en svg
|
|||
|
|
* (Eventuellement prévoir une classe pour pouvoir le mettre en background image)
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo {
|
|||
|
|
font-size: 1.05rem;
|
|||
|
|
padding: 1rem;
|
|||
|
|
margin: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo::before {
|
|||
|
|
width: 2.75rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
margin-bottom: 0.3333333333rem;
|
|||
|
|
background-size: 2.75rem 1.125rem, 2.75rem 1rem, 0;
|
|||
|
|
background-position: 0 -0.0625rem, 0 0, 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-mourning] .fr-footer__brand .fr-logo::before {
|
|||
|
|
background-size: 2.75rem 1.125rem, 0, 2.75rem 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo::after {
|
|||
|
|
min-width: 2.625rem;
|
|||
|
|
background-size: 5.25rem 3.75rem;
|
|||
|
|
background-position: 0 calc(100% + 1.875rem);
|
|||
|
|
padding-top: 2.2083333333rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
[data-fr-theme=dark] .fr-footer__brand .fr-logo::after {
|
|||
|
|
background-position: -2.625rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand-link {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
|
|||
|
|
--external-link-content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo + .fr-footer__brand-link {
|
|||
|
|
margin-left: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__logo {
|
|||
|
|
height: auto;
|
|||
|
|
max-height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* La partie "content" représente les informations sous forme de texte rajoutées dans le footer
|
|||
|
|
* ainsi que les éventuels liens simples
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
.fr-footer__content {
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
margin-top: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-desc {
|
|||
|
|
--underline-img: linear-gradient(0deg, currentColor, currentColor);
|
|||
|
|
--text-spacing: 0 0 0 0;
|
|||
|
|
width: 100%;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-list {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-self: center;
|
|||
|
|
margin-bottom: -0.5rem;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-list > li {
|
|||
|
|
margin-right: 1.25rem;
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-list > li::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-list > li:last-child {
|
|||
|
|
margin-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-link {
|
|||
|
|
font-weight: bold;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-link:not(:hover):not(:active) {
|
|||
|
|
--underline-idle-width: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* La partie "top" du footer est constituée de colonnes basées sur le système de grille du Design System
|
|||
|
|
* Ces colonnes sont constituées d’une catégorie (optionnel) et d'une liste verticale de liens
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
.fr-footer__top {
|
|||
|
|
display: flex;
|
|||
|
|
margin: -1.875rem 0 1.5rem;
|
|||
|
|
padding: 2rem 0 1.25rem;
|
|||
|
|
background-color: var(--background-alt-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-grey-hover);
|
|||
|
|
--active: var(--background-alt-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top-cat {
|
|||
|
|
margin: 0 0 0.75rem;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
display: block;
|
|||
|
|
font-weight: 700;
|
|||
|
|
text-align: left;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top-list {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top-list li {
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top-link {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top-link:not(:hover):not(:active) {
|
|||
|
|
--underline-idle-width: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* La partie "bottom" du footer est constituée d'une liste de liens simples (ferrée à gauche)
|
|||
|
|
* ainsi que du copyright (ferré à droite)
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
.fr-footer__bottom {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin-top: 2.5rem;
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom .fr-btn {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.25rem;
|
|||
|
|
padding: 0 0.5rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
display: inline;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom .fr-btn::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-list {
|
|||
|
|
padding: 0.5rem 0;
|
|||
|
|
width: 100%;
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0.5rem 0 0 0.25rem;
|
|||
|
|
display: inline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item::before {
|
|||
|
|
content: "";
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
position: relative;
|
|||
|
|
width: 1px;
|
|||
|
|
height: 1rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
margin-bottom: 0.625rem;
|
|||
|
|
margin-top: 0.625rem;
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item:first-child {
|
|||
|
|
margin: 0.5rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item:first-child::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-link {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-link:not(:hover):not(:active) {
|
|||
|
|
--underline-idle-width: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-copy {
|
|||
|
|
--text-spacing: 0 0 1rem 0;
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-copy * {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* La partie "partners" du footer est constituée de logos organisés
|
|||
|
|
* en partenaires principaux (ferré à gauche) et secondaires (ferrés à droite)
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
.fr-footer__partners {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
padding-top: 1rem;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* On surcharge le style du logo de base
|
|||
|
|
*/
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners a {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners .fr-footer__logo {
|
|||
|
|
width: auto;
|
|||
|
|
height: auto;
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners + .fr-footer__bottom {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-title {
|
|||
|
|
--title-spacing: 0 0 0.75rem 0;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
text-align: center;
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-link {
|
|||
|
|
--external-link-content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-logos {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin: 0 0 -0.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-main {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* On surcharge le style du lien pour les logos secondaires
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub,
|
|||
|
|
.fr-footer__partners-sub > ul {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub > li:first-child,
|
|||
|
|
.fr-footer__partners-sub > ul > li:first-child {
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub .fr-footer__partners-link {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners .fr-footer__partners-link,
|
|||
|
|
.fr-footer__partners .fr-footer__partners-link:hover,
|
|||
|
|
.fr-footer__partners .fr-footer__partners-link:active {
|
|||
|
|
background: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TILE
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-tile {
|
|||
|
|
position: relative;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0 0 0.25rem;
|
|||
|
|
background-size: 100% 1px, 1px 100%, 1px 100%, 100% 1px;
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
|
|||
|
|
background-position: 0 100%, 0 0, 100% 0, 100% 0;
|
|||
|
|
padding: 2rem 2rem 2.25rem;
|
|||
|
|
text-align: center;
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-grid-row .fr-tile {
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile.fr-enlarge-link:hover .fr-tile__pictogram {
|
|||
|
|
--brightness: calc(100% + var(--brighten) * 10%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile.fr-enlarge-link:active .fr-tile__pictogram {
|
|||
|
|
--brightness: calc(100% + var(--brighten) * 20%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__header {
|
|||
|
|
order: 1;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__pictogram {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
width: 5rem;
|
|||
|
|
height: 5rem;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__pictogram > svg {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__content {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__body {
|
|||
|
|
height: 100%;
|
|||
|
|
order: 2;
|
|||
|
|
flex: 1 1 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile.fr-enlarge-link .fr-tile__title a::before,
|
|||
|
|
.fr-tile.fr-enlarge-link .fr-tile__title a::after {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
position: absolute;
|
|||
|
|
right: 2rem;
|
|||
|
|
bottom: 2.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-icon .fr-tile__title a:not([target=_blank])::after,
|
|||
|
|
.fr-tile:not(.fr-enlarge-link):not(.fr-tile--download) .fr-tile__title a:not([target=_blank])::after {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
order: 2;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
z-index: 1;
|
|||
|
|
pointer-events: none;
|
|||
|
|
background-position: 0 100%;
|
|||
|
|
background-size: 100% 0.25rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-grey), var(--border-plain-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a::before {
|
|||
|
|
background-position: 0 100%;
|
|||
|
|
background-size: 100% 0.25rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-active-blue-france), var(--border-active-blue-france));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-right-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-right-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title [target=_blank]::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/external-link-line.svg");
|
|||
|
|
mask-image: url("../icons/system/external-link-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__desc {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
flex: 1 1 auto;
|
|||
|
|
order: 3;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__start {
|
|||
|
|
order: 1;
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__start .fr-badges-group,
|
|||
|
|
.fr-tile__start .fr-tags-group {
|
|||
|
|
margin-bottom: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__detail {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
order: 4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__detail[class^=fr-icon-]::before,
|
|||
|
|
.fr-tile__detail[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-tile__detail[class^=fr-fi-]::before,
|
|||
|
|
.fr-tile__detail[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile.fr-enlarge-link:not(.fr-tile--no-icon) .fr-tile__content {
|
|||
|
|
padding-bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm {
|
|||
|
|
padding: 1.5rem 1.5rem 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-badge {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.125rem;
|
|||
|
|
padding: 0 0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-badge::before,
|
|||
|
|
.fr-tile--sm .fr-badge::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tag {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
min-height: 1.5rem;
|
|||
|
|
padding: 0.125rem 0.5rem;
|
|||
|
|
border-radius: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tag::before,
|
|||
|
|
.fr-tile--sm .fr-tag::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tile__title {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
margin-bottom: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tile__title a::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tile__desc {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tile__start {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tile__pictogram {
|
|||
|
|
width: 3.5rem;
|
|||
|
|
height: 3.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm.fr-tile--horizontal .fr-tile__header {
|
|||
|
|
margin-right: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm.fr-tile--horizontal .fr-tile__pictogram {
|
|||
|
|
width: 2.5rem;
|
|||
|
|
height: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm.fr-enlarge-link:not(.fr-tile--no-icon) .fr-tile__title a::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
position: absolute;
|
|||
|
|
right: 1.5rem;
|
|||
|
|
bottom: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm.fr-enlarge-link:not(.fr-tile--no-icon) .fr-tile__content {
|
|||
|
|
padding-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal,
|
|||
|
|
.fr-tile--download {
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
justify-content: center;
|
|||
|
|
text-align: left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal .fr-tile__header,
|
|||
|
|
.fr-tile--download .fr-tile__header {
|
|||
|
|
margin-right: 2rem;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal .fr-tile__pictogram,
|
|||
|
|
.fr-tile--download .fr-tile__pictogram {
|
|||
|
|
width: 4rem;
|
|||
|
|
height: 4rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal .fr-tile__content,
|
|||
|
|
.fr-tile--download .fr-tile__content {
|
|||
|
|
align-items: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal:not(.fr-tile--no-icon) .fr-tile__detail,
|
|||
|
|
.fr-tile--download:not(.fr-tile--no-icon) .fr-tile__detail {
|
|||
|
|
padding-right: 2rem;
|
|||
|
|
margin-bottom: -2.5rem;
|
|||
|
|
margin-top: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal:not(.fr-tile--no-icon) .fr-tile__content,
|
|||
|
|
.fr-tile--download:not(.fr-tile--no-icon) .fr-tile__content {
|
|||
|
|
padding-bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal:not(.fr-tile--no-icon).fr-tile--sm .fr-tile__detail,
|
|||
|
|
.fr-tile--download:not(.fr-tile--no-icon).fr-tile--sm .fr-tile__detail {
|
|||
|
|
padding-right: 2rem;
|
|||
|
|
margin-bottom: -2rem;
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal:not(.fr-tile--no-icon).fr-tile--sm .fr-tile__content,
|
|||
|
|
.fr-tile--download:not(.fr-tile--no-icon).fr-tile--sm .fr-tile__content {
|
|||
|
|
padding-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile.fr-tile--download .fr-tile__title a::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
mask-image: url("../icons/system/download-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile:not(.fr-tile--no-border):not(.fr-tile--shadow) {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--grey {
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--shadow {
|
|||
|
|
z-index: calc(var(--ground) + 500);
|
|||
|
|
background-color: var(--background-raised-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-raised-grey-hover);
|
|||
|
|
--active: var(--background-raised-grey-active);
|
|||
|
|
filter: drop-shadow(var(--raised-shadow));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--shadow.fr-tile--grey {
|
|||
|
|
background-color: var(--background-contrast-raised-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-raised-grey-hover);
|
|||
|
|
--active: var(--background-contrast-raised-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-background {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title:disabled,
|
|||
|
|
a.fr-tile__title:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-disabled-grey-hover);
|
|||
|
|
--active: var(--background-disabled-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a {
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a:not([href])::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-disabled-grey), var(--border-disabled-grey));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__img {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
width: 5rem;
|
|||
|
|
height: 5rem;
|
|||
|
|
margin: 0 auto 1.5rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
filter: brightness(var(--brightness));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__img > svg {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__body > .fr-tile__desc {
|
|||
|
|
padding-bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal .fr-tile__img {
|
|||
|
|
width: 3rem;
|
|||
|
|
height: 3rem;
|
|||
|
|
margin: 0 1.5rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TRANSLATE
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-translate {
|
|||
|
|
--rows: 8;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
font-weight: 500;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/editor/translate-2.svg");
|
|||
|
|
mask-image: url("../icons/editor/translate-2.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn::after {
|
|||
|
|
transition: transform 0.3s;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-left: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__language {
|
|||
|
|
white-space: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__language[aria-current]:not([aria-current=false]) {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__menu {
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-nav__item::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-menu__list {
|
|||
|
|
width: auto;
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn[aria-expanded=true] {
|
|||
|
|
color: var(--text-active-blue-france);
|
|||
|
|
background-color: var(--background-open-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-open-blue-france-hover);
|
|||
|
|
--active: var(--background-open-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__menu .fr-translate__language {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
TRANSCRIPTION
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-transcription {
|
|||
|
|
position: relative;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
width: 100%;
|
|||
|
|
text-align: left;
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn::before,
|
|||
|
|
.fr-transcription__btn::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
margin-right: 0;
|
|||
|
|
margin-left: auto;
|
|||
|
|
transition: transform 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn::before {
|
|||
|
|
content: none;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/media/align-left.svg");
|
|||
|
|
mask-image: url("../icons/media/align-left.svg");
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
content: "";
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__content::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__footer {
|
|||
|
|
position: relative;
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__footer::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group > li,
|
|||
|
|
.fr-transcription__actions-group > div {
|
|||
|
|
width: 100%;
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group .fr-btn {
|
|||
|
|
width: calc(100% - 1rem);
|
|||
|
|
margin: 0 0.5rem 1rem;
|
|||
|
|
justify-content: center;
|
|||
|
|
width: auto;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
margin-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group .fr-btn::after {
|
|||
|
|
content: "";
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group .fr-btn::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group .fr-link {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group .fr-link::before,
|
|||
|
|
.fr-transcription__actions-group .fr-link::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__actions-group > *:not(:first-child) {
|
|||
|
|
margin-left: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-collapse {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column-reverse;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-collapse--expanded {
|
|||
|
|
margin: 0 0.0625rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) {
|
|||
|
|
visibility: inherit;
|
|||
|
|
opacity: inherit;
|
|||
|
|
background-color: inherit;
|
|||
|
|
position: relative;
|
|||
|
|
z-index: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened)::after {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened)::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
pointer-events: none;
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) > .fr-container {
|
|||
|
|
padding: 0.0625rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) > .fr-container > .fr-grid-row {
|
|||
|
|
display: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) > .fr-container > .fr-grid-row > [class^=fr-col-],
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) > .fr-container > .fr-grid-row > [class*=" fr-col-"],
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) > .fr-container > .fr-grid-row > .fr-col {
|
|||
|
|
flex: inherit;
|
|||
|
|
width: inherit;
|
|||
|
|
max-width: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) .fr-modal__body {
|
|||
|
|
filter: inherit;
|
|||
|
|
max-height: inherit;
|
|||
|
|
background-color: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) .fr-modal__header {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) .fr-modal__content {
|
|||
|
|
--transcription-max-height: 9.5rem;
|
|||
|
|
overflow-y: auto;
|
|||
|
|
max-height: var(--transcription-max-height);
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) .fr-modal__title {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal--opened .fr-transcription__footer {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn[aria-expanded=true] {
|
|||
|
|
background-color: var(--background-open-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-open-blue-france-hover);
|
|||
|
|
--active: var(--background-open-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
INPUT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-input {
|
|||
|
|
display: block;
|
|||
|
|
width: 100%;
|
|||
|
|
border-radius: 0.25rem 0.25rem 0 0;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input:not(textarea) {
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::placeholder {
|
|||
|
|
opacity: 1;
|
|||
|
|
font-style: italic;
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::-webkit-contacts-auto-fill-button {
|
|||
|
|
cursor: pointer;
|
|||
|
|
background-color: var(--text-label-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--text-label-grey-hover);
|
|||
|
|
--active: var(--text-label-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input[type=date] {
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
}
|
|||
|
|
@supports selector(::-webkit-calendar-picker-indicator) {
|
|||
|
|
.fr-input[type=date] {
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: calc(100% - 1rem) 50%;
|
|||
|
|
background-size: 1rem 1rem;
|
|||
|
|
padding-right: 3rem;
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24'><path fill='%23161616' d='M17 3h4c.55 0 1 .45 1 1v16c0 .55-.45 1-1 1H3c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h4V1h2v2h6V1h2v2zm-2 2H9v2H7V5H4v4h16V5h-3v2h-2V5zm5 6H4v8h16v-8z'/></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input[type=date]::-webkit-calendar-picker-indicator {
|
|||
|
|
display: block;
|
|||
|
|
padding: 1rem;
|
|||
|
|
margin-right: -2.5rem;
|
|||
|
|
opacity: 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap {
|
|||
|
|
position: relative;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap[class^=fr-icon-] .fr-input,
|
|||
|
|
.fr-input-wrap[class*=" fr-icon-"] .fr-input,
|
|||
|
|
.fr-input-wrap[class^=fr-fi-] .fr-input,
|
|||
|
|
.fr-input-wrap[class*=" fr-fi-"] .fr-input {
|
|||
|
|
padding-right: 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap[class^=fr-icon-]::before,
|
|||
|
|
.fr-input-wrap[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-input-wrap[class^=fr-fi-]::before,
|
|||
|
|
.fr-input-wrap[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0.75rem;
|
|||
|
|
right: 1rem;
|
|||
|
|
bottom: 0.75rem;
|
|||
|
|
margin: auto;
|
|||
|
|
pointer-events: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--addon,
|
|||
|
|
.fr-input-wrap--action {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--addon > *:first-child:not(:last-child) {
|
|||
|
|
border-radius: 0.25rem 0 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--addon > *:last-child:not(:first-child) {
|
|||
|
|
border-radius: 0 0.25rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--action .fr-btn {
|
|||
|
|
margin-left: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap + .fr-hint-text {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group .fr-message:first-child {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--valid::before,
|
|||
|
|
.fr-input-group--error::before,
|
|||
|
|
.fr-input-group--info::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
pointer-events: none;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: -0.75rem;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: -0.75rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: 0 0;
|
|||
|
|
background-size: 0.125rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
textarea.fr-input {
|
|||
|
|
min-height: 3.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input:autofill,
|
|||
|
|
.fr-input:autofill:hover,
|
|||
|
|
.fr-input:autofill:focus,
|
|||
|
|
.fr-input:-webkit-autofill,
|
|||
|
|
.fr-input:-webkit-autofill:hover,
|
|||
|
|
.fr-input:-webkit-autofill:focus {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-grey), inset 0 0 0 1000px var(--background-contrast-info);
|
|||
|
|
-webkit-text-fill-color: var(--text-label-grey);
|
|||
|
|
}
|
|||
|
|
@supports selector(::-webkit-calendar-picker-indicator) {
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-input[type=date] {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24'><path fill='%23fff' d='M17 3h4c.55 0 1 .45 1 1v16c0 .55-.45 1-1 1H3c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h4V1h2v2h6V1h2v2zm-2 2H9v2H7V5H4v4h16V5h-3v2h-2V5zm5 6H4v8h16v-8z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input[type=date]:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24'><path fill='%23929292' d='M17 3h4c.55 0 1 .45 1 1v16c0 .55-.45 1-1 1H3c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h4V1h2v2h6V1h2v2zm-2 2H9v2H7V5H4v4h16V5h-3v2h-2V5zm5 6H4v8h16v-8z'/></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-input[type=date]:disabled {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24'><path fill='%23666' d='M17 3h4c.55 0 1 .45 1 1v16c0 .55-.45 1-1 1H3c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h4V1h2v2h6V1h2v2zm-2 2H9v2H7V5H4v4h16V5h-3v2h-2V5zm5 6H4v8h16v-8z'/></svg>");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-input,
|
|||
|
|
.fr-fieldset--valid .fr-input-wrap--addon > .fr-input:not(:last-child),
|
|||
|
|
.fr-input-group--valid .fr-input,
|
|||
|
|
.fr-input-group--valid .fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-input,
|
|||
|
|
.fr-fieldset--error .fr-input-wrap--addon > .fr-input:not(:last-child),
|
|||
|
|
.fr-input-group--error .fr-input,
|
|||
|
|
.fr-input-group--error .fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-error), var(--border-plain-error));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-success), var(--border-plain-success));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--info::before {
|
|||
|
|
background-image: linear-gradient(0deg, var(--border-plain-info), var(--border-plain-info));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
SEARCH
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-search-bar {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-label {
|
|||
|
|
position: absolute;
|
|||
|
|
width: 1px;
|
|||
|
|
height: 1px;
|
|||
|
|
padding: 0;
|
|||
|
|
margin: -1px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
clip: rect(0, 0, 0, 0);
|
|||
|
|
white-space: nowrap; /* added line */
|
|||
|
|
border: 0;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input {
|
|||
|
|
margin: 0;
|
|||
|
|
border-radius: 0.25rem 0 0;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input::placeholder {
|
|||
|
|
font-style: italic;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input::-webkit-search-cancel-button {
|
|||
|
|
-webkit-appearance: none;
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 1rem 1rem;
|
|||
|
|
--data-uri-svg: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="%23161616" d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-11.414L9.172 7.757 7.757 9.172 10.586 12l-2.829 2.828 1.415 1.415L12 13.414l2.828 2.829 1.415-1.415L13.414 12l2.829-2.828-1.415-1.415L12 10.586z"/></svg>');
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-btn {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
flex: 1 0 auto;
|
|||
|
|
border-radius: 0 0.25rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-btn::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/search-line.svg");
|
|||
|
|
mask-image: url("../icons/system/search-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input--valid {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-success);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input--error {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-plain-error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-search-bar .fr-input::-webkit-search-cancel-button {
|
|||
|
|
--data-uri-svg: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="%23fff" d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-11.414L9.172 7.757 7.757 9.172 10.586 12l-2.829 2.828 1.415 1.415L12 13.414l2.828 2.829 1.415-1.415L13.414 12l2.829-2.828-1.415-1.415L12 10.586z"/></svg>');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
CONTENT
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-content-media {
|
|||
|
|
width: 100%;
|
|||
|
|
margin: 2.5rem 0;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__img {
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media [class^=fr-responsive-img],
|
|||
|
|
.fr-content-media [class*=" fr-responsive-img"],
|
|||
|
|
.fr-content-media [class^=fr-responsive-vid],
|
|||
|
|
.fr-content-media [class*=" fr-responsive-vid"] {
|
|||
|
|
aspect-ratio: 1.7777777778;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
width: 100%;
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption .fr-link {
|
|||
|
|
font-size: 0.75rem;
|
|||
|
|
line-height: 1.25rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
margin-right: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption .fr-link::before,
|
|||
|
|
.fr-content-media__caption .fr-link::after {
|
|||
|
|
--icon-size: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media .fr-transcription {
|
|||
|
|
margin-top: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media--sm .fr-content-media__img,
|
|||
|
|
.fr-content-media--sm .fr-responsive-vid {
|
|||
|
|
width: 83.3333333333%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media--lg .fr-content-media__img,
|
|||
|
|
.fr-content-media--lg .fr-responsive-vid {
|
|||
|
|
width: 116.6666666667%;
|
|||
|
|
max-width: 100vw;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/menu-2-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/menu-2-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption,
|
|||
|
|
.fr-content-media .fr-link {
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link:disabled,
|
|||
|
|
.fr-content-media__transcription a.fr-link:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
CONSENT MAIN
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-consent-placeholder {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
padding: 5rem 2rem;
|
|||
|
|
text-align: center;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 1.5rem;
|
|||
|
|
--title-spacing: 0 0 0.5rem;
|
|||
|
|
background-color: var(--background-contrast-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-contrast-grey-hover);
|
|||
|
|
--active: var(--background-contrast-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
max-height: calc(100% - 8rem);
|
|||
|
|
padding: 1rem;
|
|||
|
|
overflow: auto;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 1rem;
|
|||
|
|
--title-spacing: 0 0 1rem;
|
|||
|
|
z-index: calc(var(--ground) + 1500);
|
|||
|
|
background-color: var(--background-alt-overlap-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-overlap-grey-hover);
|
|||
|
|
--active: var(--background-alt-overlap-grey-active);
|
|||
|
|
filter: drop-shadow(var(--overlap-shadow));
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner__buttons {
|
|||
|
|
margin-top: 1.5rem;
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service > .fr-fieldset {
|
|||
|
|
padding: 0 0 1.25rem;
|
|||
|
|
margin: 0;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
width: 100%;
|
|||
|
|
position: initial;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service:last-child > .fr-fieldset {
|
|||
|
|
padding: 2rem 0 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service:last-child > .fr-fieldset .fr-consent-service > .fr-fieldset:last-child {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 2rem 0 0.75rem;
|
|||
|
|
margin: 0;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__desc {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
|
|||
|
|
--text-spacing: 0.75rem 0 0.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__collapse {
|
|||
|
|
margin-top: -0.25rem;
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__collapse .fr-consent-service__collapse-btn {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__collapse .fr-consent-service__collapse-btn::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-down-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__collapse .fr-consent-service__collapse-btn::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__radios {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-radio-group {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-radio-group:not(:last-child) {
|
|||
|
|
margin-right: 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-radio-group:not(:first-child)::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
width: 1px;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: calc(-1.5rem - 1px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
display: inline-flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
width: -moz-fit-content;
|
|||
|
|
width: fit-content;
|
|||
|
|
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
background: transparent;
|
|||
|
|
padding: 0 0.25rem 0 0;
|
|||
|
|
color: inherit;
|
|||
|
|
|
|||
|
|
--hover-tint: var(--idle);
|
|||
|
|
--active-tint: var(--idle);
|
|||
|
|
background-image: var(--underline-img), var(--underline-img);
|
|||
|
|
background-position: var(--underline-x) 100%, var(--underline-x) calc(100% - var(--underline-thickness));
|
|||
|
|
background-repeat: no-repeat, no-repeat;
|
|||
|
|
transition: background-size 0s;
|
|||
|
|
background-size: var(--underline-hover-width) calc(var(--underline-thickness) * 2), var(--underline-idle-width) var(--underline-thickness);
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn::before,
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn::after {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn:hover,
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn:active {
|
|||
|
|
--underline-hover-width: var(--underline-max-width);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn::after {
|
|||
|
|
margin-right: -1.25rem;
|
|||
|
|
transition: transform 0.3s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
margin-bottom: -0.5rem;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services .fr-consent-service > .fr-fieldset,
|
|||
|
|
.fr-consent-services .fr-consent-service:last-child > .fr-fieldset {
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services .fr-consent-service:last-child > .fr-fieldset {
|
|||
|
|
margin-bottom: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services .fr-consent-service__title {
|
|||
|
|
padding-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services .fr-consent-service__radios {
|
|||
|
|
top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services .fr-consent-service__desc {
|
|||
|
|
--text-spacing: 0.25rem 0 0.75rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header {
|
|||
|
|
padding-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header .fr-consent-service__title {
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 0 0 0.75rem 0;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
font-weight: 400;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header .fr-consent-service__radios {
|
|||
|
|
width: 100%;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
top: 0;
|
|||
|
|
position: initial;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__buttons {
|
|||
|
|
margin-bottom: -3rem;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header,
|
|||
|
|
.fr-consent-service {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
color: var(--text-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header .fr-radio-group + .fr-radio-group::before,
|
|||
|
|
.fr-consent-service .fr-radio-group + .fr-radio-group::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service:last-of-type,
|
|||
|
|
.fr-consent-service .fr-consent-service {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
FOLLOW
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Mixin d'ajout des icones des réseaux sociaux
|
|||
|
|
**/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Mixin d'ajout des icones des réseaux sociaux
|
|||
|
|
**/
|
|||
|
|
.fr-follow {
|
|||
|
|
padding: 1.5rem 0;
|
|||
|
|
|
|||
|
|
--title-spacing: 0 0 0.5rem;
|
|||
|
|
--text-spacing: 0 0 1rem;
|
|||
|
|
background-color: var(--background-alt-blue-france);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-alt-blue-france-hover);
|
|||
|
|
--active: var(--background-alt-blue-france-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-input-group {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-hint-text {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-label {
|
|||
|
|
position: absolute;
|
|||
|
|
width: 1px;
|
|||
|
|
height: 1px;
|
|||
|
|
padding: 0;
|
|||
|
|
margin: -1px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
clip: rect(0, 0, 0, 0);
|
|||
|
|
white-space: nowrap; /* added line */
|
|||
|
|
border: 0;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-input-wrap {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
max-width: 37.5rem;
|
|||
|
|
margin-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-input-wrap .fr-input {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
margin-top: 0;
|
|||
|
|
border-radius: 0.25rem 0.25rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-input-wrap .fr-btn {
|
|||
|
|
justify-content: center;
|
|||
|
|
width: 100%;
|
|||
|
|
border-radius: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-messages-group {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social {
|
|||
|
|
--text-spacing: 0 0 0.75rem;
|
|||
|
|
--title-spacing: 0 0 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btns-group {
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btns-group .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btns-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btns-group--lg .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 3rem;
|
|||
|
|
max-height: 3rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btns-group--lg .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
--icon-size: 2rem;
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:not(:first-child) {
|
|||
|
|
margin-top: 1.5rem;
|
|||
|
|
padding-top: 1.5rem;
|
|||
|
|
box-shadow: 0 -1px 0 0 var(--border-default-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--dailymotion::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/fr--dailymotion-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/fr--dailymotion-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--facebook::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/facebook-circle-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/facebook-circle-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--github::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/github-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/github-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--instagram::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/instagram-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/instagram-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--linkedin::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/linkedin-box-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/linkedin-box-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--mastodon::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/mastodon-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/mastodon-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--snapchat::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/snapchat-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/snapchat-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--telegram::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/telegram-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/telegram-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--threads::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/threads-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/threads-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--tiktok::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/fr--tiktok-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/fr--tiktok-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--twitch::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/twitch-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/twitch-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--twitter::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/twitter-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/twitter-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--twitter-x::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/twitter-x-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/twitter-x-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--vimeo::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/vimeo-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/vimeo-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--youtube::before {
|
|||
|
|
-webkit-mask-image: url("../icons/logo/youtube-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/youtube-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-links-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
margin: 0 -1rem -1rem -1rem;
|
|||
|
|
width: auto;
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-links-group .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-links-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-valid-text,
|
|||
|
|
.fr-follow .fr-error-text {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-hint-text {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link {
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
display: inline-flex;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-links-group--lg .fr-link {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
max-width: 3rem;
|
|||
|
|
max-height: 3rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-links-group--lg .fr-link::before {
|
|||
|
|
--icon-size: 2rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--facebook::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/facebook-circle-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/facebook-circle-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--twitter::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/twitter-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/twitter-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--instagram::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/instagram-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/instagram-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--linkedin::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/linkedin-box-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/linkedin-box-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--youtube::before {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/logo/youtube-fill.svg");
|
|||
|
|
mask-image: url("../icons/logo/youtube-fill.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-input {
|
|||
|
|
background-color: var(--background-default-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-default-grey-hover);
|
|||
|
|
--active: var(--background-default-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__title {
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter-legal {
|
|||
|
|
color: var(--text-mention-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link:disabled,
|
|||
|
|
.fr-follow__social a.fr-link:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
Password
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-password {
|
|||
|
|
position: relative;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
|
|||
|
|
--text-spacing: 0 0 0.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password [data-fr-capslock] .fr-password__input {
|
|||
|
|
padding-right: 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password [data-fr-capslock]::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0.75rem;
|
|||
|
|
right: 1rem;
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
pointer-events: none;
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23161616' d='M22.668 0C23.4023 0 24 .5977 24 1.332v21.336c0 .7343-.5977 1.332-1.332 1.332H1.332C.5977 24 0 23.4023 0 22.668V1.332C0 .5977.5977 0 1.332 0Zm-1.336 2.668H2.668v18.664h18.664Zm-4.664 12.664V18H7.332v-2.668ZM12 5.332 16.668 10H14v3.332h-4V10H7.332Zm0 0'/></svg>");
|
|||
|
|
background-image: var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__checkbox {
|
|||
|
|
order: -1;
|
|||
|
|
flex: 0;
|
|||
|
|
align-self: flex-end;
|
|||
|
|
margin-left: auto;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__checkbox .fr-label {
|
|||
|
|
text-wrap: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-input-wrap {
|
|||
|
|
flex: 1 0 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__input {
|
|||
|
|
margin-bottom: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__input::-webkit-caps-lock-indicator {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__input::-ms-reveal {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password > .fr-label {
|
|||
|
|
order: -1;
|
|||
|
|
flex: 1;
|
|||
|
|
min-width: 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-message:first-child {
|
|||
|
|
--comma: " ";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-message--valid[data-fr-valid] {
|
|||
|
|
--content: " - "attr(data-fr-valid) var(--comma);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-message--error[data-fr-error] {
|
|||
|
|
--content: " - "attr(data-fr-error) var(--comma);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled,
|
|||
|
|
a.fr-password__btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-password [data-fr-capslock]::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23fff' d='M22.668 0C23.4023 0 24 .5977 24 1.332v21.336c0 .7343-.5977 1.332-1.332 1.332H1.332C.5977 24 0 23.4023 0 22.668V1.332C0 .5977.5977 0 1.332 0Zm-1.336 2.668H2.668v18.664h18.664Zm-4.664 12.664V18H7.332v-2.668ZM12 5.332 16.668 10H14v3.332h-4V10H7.332Zm0 0'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-password__checkbox input[type=checkbox] + label {
|
|||
|
|
color: var(--text-label-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-password__checkbox input[type=checkbox] + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|||
|
|
HEADER
|
|||
|
|
\* ˍˍˍˍˍˍˍˍˍ */
|
|||
|
|
.fr-header {
|
|||
|
|
--underline-img: none;
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__body-row {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
margin: 0 -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
width: 100%;
|
|||
|
|
padding-left: 0.25rem;
|
|||
|
|
padding-right: 0.25rem;
|
|||
|
|
z-index: calc(var(--ground) + 750);
|
|||
|
|
background-color: var(--background-raised-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-raised-grey-hover);
|
|||
|
|
--active: var(--background-raised-grey-active);
|
|||
|
|
filter: drop-shadow(var(--raised-shadow));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand-top {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
width: 100%;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__logo {
|
|||
|
|
order: 1;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
padding: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__logo .fr-logo {
|
|||
|
|
font-size: 0.7875rem;
|
|||
|
|
padding: 0.75rem;
|
|||
|
|
margin: -0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__logo .fr-logo::before {
|
|||
|
|
width: 2.0625rem;
|
|||
|
|
height: 0.75rem;
|
|||
|
|
margin-bottom: 0.25rem;
|
|||
|
|
background-size: 2.0625rem 0.84375rem, 2.0625rem 0.75rem, 0;
|
|||
|
|
background-position: 0 -0.046875rem, 0 0, 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-mourning] .fr-header__logo .fr-logo::before {
|
|||
|
|
background-size: 2.0625rem 0.84375rem, 0, 2.0625rem 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__logo .fr-logo::after {
|
|||
|
|
min-width: 1.96875rem;
|
|||
|
|
background-size: 3.9375rem 2.8125rem;
|
|||
|
|
background-position: 0 calc(100% + 1.40625rem);
|
|||
|
|
padding-top: 1.65625rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
[data-fr-theme=dark] .fr-header__logo .fr-logo::after {
|
|||
|
|
background-position: -1.96875rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__operator {
|
|||
|
|
padding: 0.75rem;
|
|||
|
|
order: 2;
|
|||
|
|
flex: 0 1 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__operator img {
|
|||
|
|
display: block;
|
|||
|
|
min-width: 3.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service {
|
|||
|
|
padding-top: 0.75rem;
|
|||
|
|
padding-bottom: 0.75rem;
|
|||
|
|
margin-left: 0.75rem;
|
|||
|
|
margin-right: 0.75rem;
|
|||
|
|
width: 100%;
|
|||
|
|
|
|||
|
|
--external-link-content: none;
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service-title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service-title .fr-badge {
|
|||
|
|
vertical-align: middle;
|
|||
|
|
margin: -0.25rem 0 0 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service-tagline {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal {
|
|||
|
|
overflow: auto;
|
|||
|
|
justify-content: initial;
|
|||
|
|
background-color: var(--background-lifted-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-lifted-grey-hover);
|
|||
|
|
--active: var(--background-lifted-grey-active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal:not([role=dialog]) {
|
|||
|
|
transition: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal::after {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal > * > .fr-btn--close {
|
|||
|
|
margin-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal > .fr-container {
|
|||
|
|
pointer-events: all;
|
|||
|
|
padding-top: 1rem;
|
|||
|
|
padding-bottom: 4.5rem;
|
|||
|
|
height: 100%;
|
|||
|
|
overflow: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-end;
|
|||
|
|
padding: 0.25rem;
|
|||
|
|
margin-left: auto;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
margin-top: 0.25rem;
|
|||
|
|
order: 3;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
align-self: flex-start;
|
|||
|
|
z-index: calc(var(--ground) + 1000);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: hidden;
|
|||
|
|
max-width: 2.5rem;
|
|||
|
|
max-height: 2.5rem;
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu::before,
|
|||
|
|
.fr-header__navbar .fr-btn--menu::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/menu-fill.svg");
|
|||
|
|
mask-image: url("../icons/system/menu-fill.svg");
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu::before {
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--search::before,
|
|||
|
|
.fr-header__navbar .fr-btn--search::after {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/search-line.svg");
|
|||
|
|
mask-image: url("../icons/system/search-line.svg");
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--search::before {
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn {
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2.5rem;
|
|||
|
|
padding: 0.5rem 1rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-header__tools-links > .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-header__tools-links > .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-header__tools-links > .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-header__tools-links > .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-header__tools-links > .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-header__tools-links > .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links::after {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
margin: 0.75rem -1rem;
|
|||
|
|
width: calc(100% + 2rem);
|
|||
|
|
height: 1px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-translate {
|
|||
|
|
margin-left: -0.5rem;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-translate__btn {
|
|||
|
|
padding-left: 0.5rem;
|
|||
|
|
padding-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-header .fr-header__menu-links .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-header .fr-header__menu-links .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-header .fr-header__menu-links .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding-left: 0;
|
|||
|
|
padding-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding-left: 0;
|
|||
|
|
padding-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group {
|
|||
|
|
--ul-type: none;
|
|||
|
|
--ol-type: none;
|
|||
|
|
--ul-start: 0;
|
|||
|
|
--ol-start: 0;
|
|||
|
|
--xl-block: 0;
|
|||
|
|
--li-bottom: 0;
|
|||
|
|
--ol-content: none;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: stretch;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group > li,
|
|||
|
|
.fr-header .fr-links-group > div {
|
|||
|
|
width: 100%;
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group .fr-btn {
|
|||
|
|
width: calc(100% - 1rem);
|
|||
|
|
margin: 0 0.5rem 1rem;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group .fr-link {
|
|||
|
|
--underline-img: none;
|
|||
|
|
--hover-tint: var(--hover);
|
|||
|
|
--active-tint: var(--active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group .fr-link:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group .fr-link:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before,
|
|||
|
|
.fr-header .fr-links-group .fr-link:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group .fr-link[class^=fr-icon-],
|
|||
|
|
.fr-header .fr-links-group .fr-link[class*=" fr-icon-"],
|
|||
|
|
.fr-header .fr-links-group .fr-link[class^=fr-fi-],
|
|||
|
|
.fr-header .fr-links-group .fr-link[class*=" fr-fi-"] {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group .fr-link[class^=fr-icon-]::before,
|
|||
|
|
.fr-header .fr-links-group .fr-link[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-header .fr-links-group .fr-link[class^=fr-fi-]::before,
|
|||
|
|
.fr-header .fr-links-group .fr-link[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-links-group .fr-link {
|
|||
|
|
width: 100%;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal > * > .fr-link--close {
|
|||
|
|
margin-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links::after {
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-service__title {
|
|||
|
|
color: var(--text-title-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 0 0 1px var(--border-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
box-shadow: inset 0 -1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link:disabled,
|
|||
|
|
.fr-header__menu-links a.fr-link:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link {
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
color: var(--text-action-high-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link:disabled,
|
|||
|
|
.fr-header__tools-links a.fr-link:not([href]) {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
--hover: inherit;
|
|||
|
|
--active: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 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 */
|
|||
|
|
.fr-btns-group--inline-sm .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline-sm > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline-sm.fr-btns-group--right.fr-btns-group--inline-reverse {
|
|||
|
|
flex-direction: row-reverse;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! 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 */
|
|||
|
|
.fr-footer__content-list > li {
|
|||
|
|
margin-right: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-title {
|
|||
|
|
text-align: left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-logos {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
margin-right: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-main {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub,
|
|||
|
|
.fr-footer__partners-sub > ul {
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub > li,
|
|||
|
|
.fr-footer__partners-sub > ul > li {
|
|||
|
|
margin: 0 0.5rem 0 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub {
|
|||
|
|
order: 3;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
.fr-follow__newsletter .fr-input-group {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-input-wrap .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
border-radius: 0 0.25rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-input-wrap {
|
|||
|
|
flex-direction: row;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-input-wrap .fr-input {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
border-radius: 0.25rem 0 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter .fr-messages-group {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! 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 sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
|
|||
|
|
/*! media sm */
|
|||
|
|
}
|
|||
|
|
@media (min-width: 48em) {
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-accordion .fr-collapse {
|
|||
|
|
margin: 0 -0.25rem;
|
|||
|
|
padding-left: 1rem;
|
|||
|
|
padding-right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-btns-group--inline-md .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline-md > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline-md.fr-btns-group--right.fr-btns-group--inline-reverse {
|
|||
|
|
flex-direction: row-reverse;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-quote {
|
|||
|
|
padding: 0 0 0 2rem;
|
|||
|
|
background-size: 1px 100%;
|
|||
|
|
background-position: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column {
|
|||
|
|
margin-left: 13.5rem;
|
|||
|
|
min-height: 13rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column .fr-quote__author {
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column .fr-quote__source {
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote--column figcaption {
|
|||
|
|
min-height: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote__image {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 50%;
|
|||
|
|
left: -13.5rem;
|
|||
|
|
width: 11.5rem;
|
|||
|
|
height: 11.5rem;
|
|||
|
|
margin-top: -5.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-breadcrumb {
|
|||
|
|
margin-bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__button {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb .fr-collapse {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0;
|
|||
|
|
padding-left: 0;
|
|||
|
|
padding-right: 0;
|
|||
|
|
transform: none;
|
|||
|
|
visibility: inherit;
|
|||
|
|
overflow: visible;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb .fr-collapse::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__list {
|
|||
|
|
transform: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-fieldset__element--inline\@md {
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-stepper__title {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-links-group--download .fr-link,
|
|||
|
|
.fr-links-group .fr-link--download {
|
|||
|
|
margin-bottom: 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group__title {
|
|||
|
|
font-size: 1.5rem;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--bordered {
|
|||
|
|
padding: 2rem 2rem 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-sidemenu {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0;
|
|||
|
|
padding-right: 2rem;
|
|||
|
|
/**
|
|||
|
|
* Modificateur pour que le sidemenu s'adapte à un affichage à droite du contenu
|
|||
|
|
* La bordure se met sur la gauche
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modificateur pour que le sidemenu soit sticky
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Modificateur pour que le sidemenu soit à la fois sticky et prenne toute la hauteur de la page
|
|||
|
|
*/
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu .fr-collapse {
|
|||
|
|
margin-left: -0.25rem;
|
|||
|
|
margin-right: -0.25rem;
|
|||
|
|
padding-left: 0.25rem;
|
|||
|
|
padding-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__title {
|
|||
|
|
margin: 0 0 1.5rem;
|
|||
|
|
padding: 0;
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__list .fr-sidemenu__list {
|
|||
|
|
margin: 0 1rem 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__list {
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner {
|
|||
|
|
padding: 0 1.5rem 0 0;
|
|||
|
|
box-shadow: inset -1px 0 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner > .fr-collapse {
|
|||
|
|
padding: 0;
|
|||
|
|
margin: 0;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner > .fr-collapse::before {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner > .fr-collapse:not(.fr-collapse--expanded) {
|
|||
|
|
visibility: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--right {
|
|||
|
|
padding-left: 2rem;
|
|||
|
|
padding-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--right .fr-sidemenu__inner {
|
|||
|
|
padding: 0 1rem 0 2rem;
|
|||
|
|
border-right: 0;
|
|||
|
|
box-shadow: inset 1px 0 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--sticky {
|
|||
|
|
position: sticky;
|
|||
|
|
top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--sticky .fr-sidemenu__inner {
|
|||
|
|
padding-top: 0.5rem;
|
|||
|
|
overflow: auto;
|
|||
|
|
max-height: 100vh;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--sticky-full-height {
|
|||
|
|
position: sticky;
|
|||
|
|
top: 0;
|
|||
|
|
height: 100vh;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--sticky-full-height .fr-sidemenu__inner {
|
|||
|
|
padding-top: 0.5rem;
|
|||
|
|
overflow: auto;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link,
|
|||
|
|
.fr-sidemenu__btn {
|
|||
|
|
margin: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__btn[aria-expanded] {
|
|||
|
|
padding: 0.75rem 2.5rem 0.75rem 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__btn[aria-expanded]::after {
|
|||
|
|
margin-right: -1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner > .fr-sidemenu__btn {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-highlight {
|
|||
|
|
padding-left: 2.25rem;
|
|||
|
|
margin-left: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-tabs--viewport-width {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel {
|
|||
|
|
padding: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel:focus,
|
|||
|
|
.fr-tabs__panel:focus-visible {
|
|||
|
|
outline-offset: calc(-2rem + 2px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-summary {
|
|||
|
|
padding: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-table caption {
|
|||
|
|
font-size: 1.5rem;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table td,
|
|||
|
|
.fr-table th {
|
|||
|
|
padding: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table thead td,
|
|||
|
|
.fr-table thead th {
|
|||
|
|
padding-bottom: 1.125rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-download--card {
|
|||
|
|
padding: 2rem 2rem 5rem 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__link {
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__link::after {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
bottom: 2rem;
|
|||
|
|
right: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__desc {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-download--card .fr-download__detail {
|
|||
|
|
bottom: 2rem;
|
|||
|
|
left: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group__title {
|
|||
|
|
font-size: 1.5rem;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group--bordered {
|
|||
|
|
padding: 2rem 2rem 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-downloads-group .fr-download {
|
|||
|
|
margin-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-alert__title {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-card__title {
|
|||
|
|
font-size: 1.375rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__title {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__title {
|
|||
|
|
font-size: 1.5rem;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--horizontal,
|
|||
|
|
.fr-card--horizontal-half,
|
|||
|
|
.fr-card--horizontal-tier {
|
|||
|
|
flex-direction: row;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--horizontal .fr-card__img,
|
|||
|
|
.fr-card--horizontal-half .fr-card__img,
|
|||
|
|
.fr-card--horizontal-tier .fr-card__img {
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--horizontal .fr-card__img img,
|
|||
|
|
.fr-card--horizontal-half .fr-card__img img,
|
|||
|
|
.fr-card--horizontal-tier .fr-card__img img {
|
|||
|
|
height: 100%;
|
|||
|
|
object-fit: cover;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--horizontal .fr-card__header {
|
|||
|
|
width: 40%;
|
|||
|
|
flex: 0 0 40%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--horizontal-half .fr-card__header {
|
|||
|
|
width: 50%;
|
|||
|
|
flex: 0 0 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--horizontal-tier .fr-card__header {
|
|||
|
|
width: 33.3333333333%;
|
|||
|
|
flex: 0 0 33.3333333333%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download {
|
|||
|
|
flex-direction: row;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header {
|
|||
|
|
width: 40%;
|
|||
|
|
flex: 0 0 40%;
|
|||
|
|
aspect-ratio: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header .fr-card__img img {
|
|||
|
|
object-position: 50% 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__img {
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__img img {
|
|||
|
|
height: 100%;
|
|||
|
|
object-fit: cover;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-skiplinks {
|
|||
|
|
padding: 0.75rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list > li {
|
|||
|
|
margin: 0 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks__list {
|
|||
|
|
flex-direction: row;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
margin: 0 -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-callout {
|
|||
|
|
padding: 2rem 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout[class^=fr-icon-]::before,
|
|||
|
|
.fr-callout[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-callout[class^=fr-fi-]::before,
|
|||
|
|
.fr-callout[class*=" fr-fi-"]::before {
|
|||
|
|
margin: -1rem 0 1rem -2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout__title {
|
|||
|
|
font-size: 1.5rem;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-modal {
|
|||
|
|
padding-right: var(--scrollbar-width);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal--top::before {
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal::before {
|
|||
|
|
width: 0;
|
|||
|
|
height: 10vh;
|
|||
|
|
flex: 1 0 10vh;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal::after {
|
|||
|
|
content: "";
|
|||
|
|
width: 0;
|
|||
|
|
height: 10vh;
|
|||
|
|
flex: 1 0 10vh;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body {
|
|||
|
|
max-height: 80vh !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__header {
|
|||
|
|
padding: 1rem 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__content {
|
|||
|
|
padding-left: 2rem;
|
|||
|
|
padding-right: 2rem;
|
|||
|
|
margin-bottom: 4rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__footer {
|
|||
|
|
padding: 2rem;
|
|||
|
|
margin-top: -3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__title {
|
|||
|
|
font-size: 1.5rem;
|
|||
|
|
line-height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-share__text {
|
|||
|
|
max-width: 18rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-footer__body {
|
|||
|
|
margin-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo {
|
|||
|
|
font-size: 1.3125rem;
|
|||
|
|
padding: 1.25rem;
|
|||
|
|
margin: -1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo::before {
|
|||
|
|
width: 3.4375rem;
|
|||
|
|
height: 1.25rem;
|
|||
|
|
margin-bottom: 0.4166666667rem;
|
|||
|
|
background-size: 3.4375rem 1.40625rem, 3.4375rem 1.25rem, 0;
|
|||
|
|
background-position: 0 -0.078125rem, 0 0, 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-mourning] .fr-footer__brand .fr-logo::before {
|
|||
|
|
background-size: 3.4375rem 1.40625rem, 0, 3.4375rem 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo::after {
|
|||
|
|
min-width: 3.28125rem;
|
|||
|
|
background-size: 6.5625rem 4.6875rem;
|
|||
|
|
background-position: 0 calc(100% + 2.34375rem);
|
|||
|
|
padding-top: 2.7604166667rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
[data-fr-theme=dark] .fr-footer__brand .fr-logo::after {
|
|||
|
|
background-position: -3.28125rem 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand .fr-logo + .fr-footer__brand-link {
|
|||
|
|
margin-left: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand {
|
|||
|
|
flex-basis: auto;
|
|||
|
|
margin-right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__brand.fr-enlarge-link {
|
|||
|
|
margin: -1rem 0 -1rem -1rem;
|
|||
|
|
padding: 1rem;
|
|||
|
|
align-self: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content {
|
|||
|
|
margin-left: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-list {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top {
|
|||
|
|
margin: -1.875rem 0 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item {
|
|||
|
|
margin: 0.5rem 0 0 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item::before {
|
|||
|
|
margin-right: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-logos {
|
|||
|
|
margin-right: -1rem;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-main + .fr-footer__partners-sub {
|
|||
|
|
padding-left: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub,
|
|||
|
|
.fr-footer__partners-sub > ul {
|
|||
|
|
padding-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub > ul,
|
|||
|
|
.fr-footer__partners-sub > ul > ul {
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub > li,
|
|||
|
|
.fr-footer__partners-sub > ul > li {
|
|||
|
|
margin: 0 1rem 0 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-sub .fr-footer__partners-link {
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-tile__title {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@md {
|
|||
|
|
flex-direction: column;
|
|||
|
|
text-align: center;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@md .fr-tile__header {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
margin-right: 0 !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@md .fr-tile__pictogram {
|
|||
|
|
width: 5rem;
|
|||
|
|
height: 5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@md .fr-tile__content {
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@md .fr-tile__detail {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@md.fr-enlarge-link:not(.fr-tile--no-icon) .fr-tile__content {
|
|||
|
|
padding-bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@md.fr-enlarge-link:not(.fr-tile--no-icon) .fr-tile__detail {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
padding-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--horizontal .fr-tile__img {
|
|||
|
|
width: 5rem;
|
|||
|
|
height: 5rem;
|
|||
|
|
margin: 0 2rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-search-bar--lg .fr-btn {
|
|||
|
|
font-size: 1.125rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
min-height: 3rem;
|
|||
|
|
padding: 0.5rem 1.5rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar--lg .fr-btn::before {
|
|||
|
|
--icon-size: 1.5rem;
|
|||
|
|
margin-left: -0.1875rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar--lg .fr-input {
|
|||
|
|
max-height: 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-content-media--sm .fr-content-media__img,
|
|||
|
|
.fr-content-media--sm .fr-responsive-vid {
|
|||
|
|
width: 75%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media--lg .fr-content-media__img,
|
|||
|
|
.fr-content-media--lg .fr-responsive-vid {
|
|||
|
|
width: 125%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-consent-banner {
|
|||
|
|
padding: 2rem;
|
|||
|
|
bottom: 2.5rem;
|
|||
|
|
left: 2.5rem;
|
|||
|
|
max-width: 40rem;
|
|||
|
|
max-height: calc(100% - 5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner__title {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner__buttons {
|
|||
|
|
margin-top: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service > .fr-fieldset {
|
|||
|
|
padding: 0 0 1.25rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service:last-child > .fr-fieldset {
|
|||
|
|
padding: 1.25rem 0 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__title {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
width: 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__desc {
|
|||
|
|
--text-spacing: 0.25rem 1.5rem 0.5rem 0;
|
|||
|
|
width: 60%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__radios {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 1.25rem;
|
|||
|
|
right: 0;
|
|||
|
|
width: 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services .fr-consent-service + .fr-consent-service {
|
|||
|
|
margin-top: -0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-services .fr-consent-service__desc {
|
|||
|
|
--text-spacing: 0.25rem 0 0.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-follow {
|
|||
|
|
padding: 2rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > * > div {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
justify-content: center;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:not(:first-child) {
|
|||
|
|
padding-left: 8.3333333333%;
|
|||
|
|
padding-top: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
box-shadow: -1px 0 0 0 var(--border-default-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:not(:last-child) {
|
|||
|
|
padding-right: 8.3333333333%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:first-child:last-child > div {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:first-child:last-child > .fr-follow__newsletter {
|
|||
|
|
--text-spacing: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:first-child:last-child > .fr-follow__newsletter > * {
|
|||
|
|
max-width: 50%;
|
|||
|
|
padding-right: 0.75rem;
|
|||
|
|
padding-left: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:first-child:last-child > .fr-follow__newsletter > :first-child {
|
|||
|
|
padding-right: 0.75rem;
|
|||
|
|
padding-left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:first-child:last-child > .fr-follow__newsletter > :last-child {
|
|||
|
|
padding-right: 0;
|
|||
|
|
padding-left: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:first-child:last-child > .fr-follow__social {
|
|||
|
|
--title-spacing: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-hint-text {
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
|
|||
|
|
/*! media md */
|
|||
|
|
.fr-header__service-title {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
line-height: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! 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 md */
|
|||
|
|
}
|
|||
|
|
@media (min-width: 62em) {
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
.fr-btns-group--inline-lg .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline-lg > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group--inline-lg.fr-btns-group--right.fr-btns-group--inline-reverse {
|
|||
|
|
flex-direction: row-reverse;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
.fr-pagination__link--first.fr-pagination__link--lg-label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--first.fr-pagination__link--lg-label::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--arrow-left-s-first-line.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--arrow-left-s-first-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--prev.fr-pagination__link--lg-label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--prev.fr-pagination__link--lg-label::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-left-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-left-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next.fr-pagination__link--lg-label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next.fr-pagination__link--lg-label::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
mask-image: url("../icons/system/arrow-right-s-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--next.fr-pagination__link--lg-label::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last.fr-pagination__link--lg-label {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last.fr-pagination__link--lg-label::after {
|
|||
|
|
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-right: -0.125rem;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
flex: 0 0 auto;
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
|
|||
|
|
background-color: currentColor;
|
|||
|
|
width: var(--icon-size);
|
|||
|
|
height: var(--icon-size);
|
|||
|
|
-webkit-mask-size: 100% 100%;
|
|||
|
|
mask-size: 100% 100%;
|
|||
|
|
-webkit-mask-image: url("../icons/system/fr--arrow-right-s-last-line.svg");
|
|||
|
|
mask-image: url("../icons/system/fr--arrow-right-s-last-line.svg");
|
|||
|
|
content: "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link--last.fr-pagination__link--lg-label::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! 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-nav__list {
|
|||
|
|
flex-direction: row;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__list > *:first-child:nth-last-child(2) ~ *,
|
|||
|
|
.fr-nav__list > *:first-child:nth-last-child(3) ~ *,
|
|||
|
|
.fr-nav__list > *:first-child:nth-last-child(4) ~ * {
|
|||
|
|
margin-left: 1.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__list > .fr-nav__link,
|
|||
|
|
.fr-nav__list > .fr-nav__btn,
|
|||
|
|
.fr-nav__list > * > .fr-nav__link,
|
|||
|
|
.fr-nav__list > * > .fr-nav__btn {
|
|||
|
|
padding: 1rem;
|
|||
|
|
margin: 0;
|
|||
|
|
width: auto;
|
|||
|
|
height: 100%;
|
|||
|
|
min-height: 3.5rem;
|
|||
|
|
font-weight: normal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__list > .fr-nav__link[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-nav__list > .fr-nav__btn[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-nav__list > * > .fr-nav__link[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-nav__list > * > .fr-nav__btn[aria-current]:not([aria-current=false])::before {
|
|||
|
|
position: absolute;
|
|||
|
|
top: auto;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 2px;
|
|||
|
|
margin-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item .fr-btn,
|
|||
|
|
.fr-nav__item .fr-link {
|
|||
|
|
min-height: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item {
|
|||
|
|
position: initial;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item--align-right {
|
|||
|
|
align-items: flex-end;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link,
|
|||
|
|
.fr-nav__btn {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__btn {
|
|||
|
|
padding: 1rem 0.75rem 1rem 1rem;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu {
|
|||
|
|
pointer-events: none;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 100%;
|
|||
|
|
z-index: calc(var(--ground) + 1000);
|
|||
|
|
filter: drop-shadow(var(--overlap-shadow));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu__list {
|
|||
|
|
width: 20rem;
|
|||
|
|
pointer-events: auto;
|
|||
|
|
padding: 0;
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
background-color: var(--background-overlap-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-overlap-grey-hover);
|
|||
|
|
--active: var(--background-overlap-grey-active);
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-open-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu .fr-nav__link {
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
box-shadow: 0 calc(-1rem - 1px) 0 -1rem var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu .fr-nav__link::before {
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 100%;
|
|||
|
|
right: 0;
|
|||
|
|
left: 0;
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 0;
|
|||
|
|
z-index: calc(var(--ground) + 1000);
|
|||
|
|
background-color: var(--background-overlap-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-overlap-grey-hover);
|
|||
|
|
--active: var(--background-overlap-grey-active);
|
|||
|
|
filter: drop-shadow(var(--overlap-shadow));
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-open-blue-france);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu::after {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
padding-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu > .fr-container {
|
|||
|
|
padding: 0 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu > .fr-container::before {
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
padding-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu .fr-btn--close {
|
|||
|
|
display: flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu .fr-nav__link {
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__leader {
|
|||
|
|
margin-top: -1.25rem;
|
|||
|
|
padding-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__list::before {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu__list > *:first-child,
|
|||
|
|
.fr-menu__list > *:first-child > .fr-nav__link,
|
|||
|
|
.fr-menu__list > *:hover,
|
|||
|
|
.fr-menu__list > *:hover > .fr-nav__link,
|
|||
|
|
.fr-menu__list > *:hover + *,
|
|||
|
|
.fr-menu__list > *:hover + * > .fr-nav__link {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__category {
|
|||
|
|
box-shadow: 0 calc(1rem + 1px) 0 -1rem var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
.fr-footer__content {
|
|||
|
|
margin-top: 0;
|
|||
|
|
flex-basis: 50%;
|
|||
|
|
max-width: 36.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
.fr-tile--vertical\@lg {
|
|||
|
|
flex-direction: column;
|
|||
|
|
text-align: center;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@lg .fr-tile__header {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
margin-right: 0 !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@lg .fr-tile__pictogram {
|
|||
|
|
width: 5rem;
|
|||
|
|
height: 5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@lg .fr-tile__content {
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@lg .fr-tile__detail {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@lg.fr-enlarge-link:not(.fr-tile--no-icon) .fr-tile__content {
|
|||
|
|
padding-bottom: 2.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--vertical\@lg.fr-enlarge-link:not(.fr-tile--no-icon) .fr-tile__detail {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
padding-right: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
.fr-translate .fr-translate__btn {
|
|||
|
|
min-height: auto;
|
|||
|
|
width: auto;
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn::after {
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
margin-right: -0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__language[aria-current]:not([aria-current=false]) {
|
|||
|
|
display: inline-flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__menu {
|
|||
|
|
margin: -0.25rem -1rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-menu__list {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-rows: repeat(var(--rows), auto);
|
|||
|
|
grid-auto-flow: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btns-group .fr-translate__menu {
|
|||
|
|
margin: -1.25rem -0.75rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
.fr-consent-manager__header .fr-consent-service__title {
|
|||
|
|
width: 44%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header .fr-consent-service__radios {
|
|||
|
|
width: 56%;
|
|||
|
|
position: absolute;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
.fr-header__body-row {
|
|||
|
|
padding: 1.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand {
|
|||
|
|
margin-top: -1rem;
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
width: auto;
|
|||
|
|
padding-left: 0;
|
|||
|
|
padding-right: 0;
|
|||
|
|
z-index: auto;
|
|||
|
|
background: transparent;
|
|||
|
|
filter: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand-top {
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__logo,
|
|||
|
|
.fr-header__operator,
|
|||
|
|
.fr-header__service {
|
|||
|
|
padding: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0;
|
|||
|
|
width: auto;
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal {
|
|||
|
|
margin: 0;
|
|||
|
|
width: auto;
|
|||
|
|
height: auto;
|
|||
|
|
visibility: inherit;
|
|||
|
|
opacity: 1;
|
|||
|
|
position: initial;
|
|||
|
|
background-color: transparent;
|
|||
|
|
overflow: initial;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal > * > .fr-btn--close {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal > .fr-container {
|
|||
|
|
padding-top: 0;
|
|||
|
|
padding-bottom: 0;
|
|||
|
|
height: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools {
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-end;
|
|||
|
|
text-align: right;
|
|||
|
|
padding-left: 1rem;
|
|||
|
|
padding-right: 1rem;
|
|||
|
|
margin-left: auto;
|
|||
|
|
flex: 1 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links + .fr-header__search {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools .fr-header__search {
|
|||
|
|
max-width: 24rem;
|
|||
|
|
margin-left: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-],
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"],
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-],
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"] {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]) {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
min-height: 2rem;
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
overflow: initial;
|
|||
|
|
max-width: 100%;
|
|||
|
|
max-height: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
margin-left: -0.125rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
gap: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btns-group {
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
margin: 0 -0.25rem -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btns-group .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btns-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links .fr-translate {
|
|||
|
|
margin-left: 0;
|
|||
|
|
margin-right: 0;
|
|||
|
|
margin-bottom: -1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu-links {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-nav {
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-nav__list {
|
|||
|
|
margin: 0 -1rem;
|
|||
|
|
max-width: calc(100% + 1rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group {
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-links-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-links-group {
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
margin: 0 -0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-links-group .fr-btn {
|
|||
|
|
width: auto;
|
|||
|
|
max-width: 100%;
|
|||
|
|
margin-left: 0.5rem;
|
|||
|
|
margin-right: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-links-group > li {
|
|||
|
|
display: inline-flex;
|
|||
|
|
max-width: 100%;
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-links-group .fr-link {
|
|||
|
|
margin-left: 0.25rem;
|
|||
|
|
margin-right: 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal > * > .fr-link--close {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header {
|
|||
|
|
z-index: calc(var(--ground) + 750);
|
|||
|
|
background-color: var(--background-raised-grey);
|
|||
|
|
|
|||
|
|
--idle: transparent;
|
|||
|
|
--hover: var(--background-raised-grey-hover);
|
|||
|
|
--active: var(--background-raised-grey-active);
|
|||
|
|
filter: drop-shadow(var(--raised-shadow));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu {
|
|||
|
|
box-shadow: inset 0 1px 0 0 var(--border-default-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! 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 */
|
|||
|
|
|
|||
|
|
/*! media lg */
|
|||
|
|
|
|||
|
|
/*! 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 xl */
|
|||
|
|
.fr-consent-manager__header .fr-consent-service__title {
|
|||
|
|
width: 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header .fr-consent-service__radios {
|
|||
|
|
width: 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*! 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 xl */
|
|||
|
|
|
|||
|
|
/*! media xl */
|
|||
|
|
|
|||
|
|
/*! media xl */
|
|||
|
|
|
|||
|
|
/*! media xl */
|
|||
|
|
}
|
|||
|
|
@media (forced-colors: active), (prefers-contrast: more) {
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]) {
|
|||
|
|
justify-content: center;
|
|||
|
|
padding: calc(0.25rem - 1px) calc(0.75rem - 1px);
|
|||
|
|
border: 1px solid var(--border-active-blue-france);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media (hover: hover) and (pointer: fine) {
|
|||
|
|
.fr-card--download.fr-enlarge-link:hover .fr-card__header {
|
|||
|
|
background-color: var(--hover);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download.fr-enlarge-link:active .fr-card__header {
|
|||
|
|
background-color: var(--active);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand.fr-enlarge-link a[href]:hover {
|
|||
|
|
--a: 0.1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand.fr-enlarge-link a[href]:active {
|
|||
|
|
--a: 0.2;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
|
|||
|
|
.fr-range__output,
|
|||
|
|
.fr-range__min,
|
|||
|
|
.fr-range__max {
|
|||
|
|
min-width: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range input[type=range] {
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] {
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range]::after {
|
|||
|
|
content: none;
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] .fr-range__max {
|
|||
|
|
margin-left: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range] {
|
|||
|
|
margin-top: -0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]::-ms-track {
|
|||
|
|
height: 0.75rem;
|
|||
|
|
background: transparent;
|
|||
|
|
border-color: transparent;
|
|||
|
|
border-width: 0.625rem 0;
|
|||
|
|
color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]::-ms-fill-lower {
|
|||
|
|
height: 0.75rem;
|
|||
|
|
border-radius: 0.375rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]::-ms-thumb {
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
z-index: 500;
|
|||
|
|
background-color: #fff;
|
|||
|
|
border: 1px solid #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]:not(:only-of-type) {
|
|||
|
|
pointer-events: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range].fr-range--double {
|
|||
|
|
background-position-y: 1.625rem;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range].fr-range--double .fr-range__output {
|
|||
|
|
min-width: 3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range].fr-range--double input[type=range] {
|
|||
|
|
width: calc(100% - 1.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range].fr-range--double input[type=range]::-ms-fill-lower {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range].fr-range--double input[type=range]:nth-of-type(1) {
|
|||
|
|
margin-right: 1.5rem;
|
|||
|
|
z-index: 2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range].fr-range--double input[type=range]:nth-of-type(2) {
|
|||
|
|
left: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range] .fr-range__output,
|
|||
|
|
.fr-range--sm[data-fr-js-range] .fr-range__min,
|
|||
|
|
.fr-range--sm[data-fr-js-range] .fr-range__max {
|
|||
|
|
min-width: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range] input[type=range]::-ms-track {
|
|||
|
|
height: 0.5rem;
|
|||
|
|
border-width: 0.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range] input[type=range]::-ms-fill-lower {
|
|||
|
|
height: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range] input[type=range]::-ms-thumb {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range].fr-range--double {
|
|||
|
|
background-position-y: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range].fr-range--double .fr-range__output {
|
|||
|
|
min-width: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range].fr-range--double input[type=range] {
|
|||
|
|
width: calc(100% - 1rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range].fr-range--double input[type=range]:nth-of-type(1) {
|
|||
|
|
margin-right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--sm[data-fr-js-range].fr-range--double input[type=range]:nth-of-type(2) {
|
|||
|
|
left: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range]::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]:disabled::-ms-thumb {
|
|||
|
|
border: 1px solid #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range__output {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range__min,
|
|||
|
|
.fr-range__max {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step[data-fr-js-range]::before {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, #000091 0, #000091 1px, transparent 1px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step[data-fr-js-range]::after {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, #e3e3fd 0, #e3e3fd 2px, transparent 2px);
|
|||
|
|
box-shadow: inset 10px 0 0 0 #000091, inset -10px 0 0 0 #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range--step.fr-range--sm[data-fr-js-range]::after {
|
|||
|
|
box-shadow: inset 6px 0 0 0 #000091, inset -6px 0 0 0 #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, #ce0500, #ce0500);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, #18753c, #18753c);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range[data-fr-js-range]::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range[data-fr-js-range]::after {
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range--step[data-fr-js-range]::before {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, #e5e5e5 0, #e5e5e5 1px, transparent 1px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range--step[data-fr-js-range]::after {
|
|||
|
|
background-image: radial-gradient(circle at 2px 50%, #fff 0, #fff 2px, transparent 2px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range-group--disabled .fr-range__output,
|
|||
|
|
.fr-range-group--disabled .fr-range__min,
|
|||
|
|
.fr-range-group--disabled .fr-range__max {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 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;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul {
|
|||
|
|
list-style-type: disc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ol {
|
|||
|
|
list-style-type: decimal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul,
|
|||
|
|
ol {
|
|||
|
|
padding-left: 1rem;
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
margin-bottom: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn::before,
|
|||
|
|
.fr-accordion__btn::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-accordion__btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd, 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn[aria-expanded=true] {
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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: #000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn::before,
|
|||
|
|
.fr-btn::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn[href] {
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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--tooltip::before,
|
|||
|
|
.fr-btn--tooltip::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/question-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;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--briefcase::before,
|
|||
|
|
.fr-btn--briefcase::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/business/briefcase-fill.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--account::before,
|
|||
|
|
.fr-btn--account::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/user/account-circle-fill.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--team::before,
|
|||
|
|
.fr-btn--team::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/user/team-line.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,
|
|||
|
|
.fr-btn--account {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:hover,
|
|||
|
|
.fr-btn--account:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:active,
|
|||
|
|
.fr-btn--account:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:disabled,
|
|||
|
|
a.fr-btn--tertiary:not([href]),
|
|||
|
|
a.fr-btn--account:not([href]),
|
|||
|
|
.fr-btn--account:disabled {
|
|||
|
|
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,
|
|||
|
|
a.fr-btn--account:not([href]):hover,
|
|||
|
|
.fr-btn--account:disabled:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:disabled:active,
|
|||
|
|
a.fr-btn--tertiary:not([href]):active,
|
|||
|
|
a.fr-btn--account:not([href]):active,
|
|||
|
|
.fr-btn--account:disabled:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary-no-outline,
|
|||
|
|
.fr-btn--close,
|
|||
|
|
.fr-btn--display,
|
|||
|
|
.fr-btn--fullscreen,
|
|||
|
|
.fr-btn--tooltip,
|
|||
|
|
.fr-btn--briefcase,
|
|||
|
|
.fr-btn--team {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary-no-outline:hover,
|
|||
|
|
.fr-btn--close:hover,
|
|||
|
|
.fr-btn--display:hover,
|
|||
|
|
.fr-btn--fullscreen:hover,
|
|||
|
|
.fr-btn--tooltip:hover,
|
|||
|
|
.fr-btn--briefcase:hover,
|
|||
|
|
.fr-btn--team: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,
|
|||
|
|
.fr-btn--tooltip:active,
|
|||
|
|
.fr-btn--briefcase:active,
|
|||
|
|
.fr-btn--team: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]),
|
|||
|
|
a.fr-btn--tooltip:not([href]),
|
|||
|
|
a.fr-btn--briefcase:not([href]),
|
|||
|
|
a.fr-btn--team:not([href]),
|
|||
|
|
.fr-btn--close:disabled,
|
|||
|
|
.fr-btn--display:disabled,
|
|||
|
|
.fr-btn--fullscreen:disabled,
|
|||
|
|
.fr-btn--tooltip:disabled,
|
|||
|
|
.fr-btn--briefcase:disabled,
|
|||
|
|
.fr-btn--team: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,
|
|||
|
|
a.fr-btn--tooltip:not([href]):hover,
|
|||
|
|
a.fr-btn--briefcase:not([href]):hover,
|
|||
|
|
a.fr-btn--team:not([href]):hover,
|
|||
|
|
.fr-btn--close:disabled:hover,
|
|||
|
|
.fr-btn--display:disabled:hover,
|
|||
|
|
.fr-btn--fullscreen:disabled:hover,
|
|||
|
|
.fr-btn--tooltip:disabled:hover,
|
|||
|
|
.fr-btn--briefcase:disabled:hover,
|
|||
|
|
.fr-btn--team: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,
|
|||
|
|
a.fr-btn--tooltip:not([href]):active,
|
|||
|
|
a.fr-btn--briefcase:not([href]):active,
|
|||
|
|
a.fr-btn--team:not([href]):active,
|
|||
|
|
.fr-btn--close:disabled:active,
|
|||
|
|
.fr-btn--display:disabled:active,
|
|||
|
|
.fr-btn--fullscreen:disabled:active,
|
|||
|
|
.fr-btn--tooltip:disabled:active,
|
|||
|
|
.fr-btn--briefcase:disabled:active,
|
|||
|
|
.fr-btn--team:disabled:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect {
|
|||
|
|
background-color: #000091;
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect:disabled,
|
|||
|
|
a.fr-connect:not([href]) {
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
color: #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;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul.fr-quote__source {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ol.fr-quote__source {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul.fr-quote__source,
|
|||
|
|
ol.fr-quote__source {
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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,
|
|||
|
|
.fr-breadcrumb__link[aria-current=false]::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]:not([aria-current=false]) {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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/fr--info-fill.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--valid label,
|
|||
|
|
.fr-input-group--valid label,
|
|||
|
|
.fr-range-group--valid label,
|
|||
|
|
.fr-upload-group--valid label {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--error label,
|
|||
|
|
.fr-input-group--error label,
|
|||
|
|
.fr-range-group--error label,
|
|||
|
|
.fr-upload-group--error label {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--info label,
|
|||
|
|
.fr-input-group--info label,
|
|||
|
|
.fr-range-group--info label,
|
|||
|
|
.fr-upload-group--info label {
|
|||
|
|
color: #0063cb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--disabled label,
|
|||
|
|
.fr-select-group--disabled .fr-hint-text,
|
|||
|
|
.fr-input-group--disabled label,
|
|||
|
|
.fr-input-group--disabled .fr-hint-text,
|
|||
|
|
.fr-range-group--disabled label,
|
|||
|
|
.fr-range-group--disabled .fr-hint-text,
|
|||
|
|
.fr-upload-group--disabled label,
|
|||
|
|
.fr-upload-group--disabled .fr-hint-text {
|
|||
|
|
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-hint-text,
|
|||
|
|
.fr-fieldset:disabled .fr-fieldset__legend {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset input:disabled + label,
|
|||
|
|
.fr-fieldset input:disabled + label .fr-hint-text,
|
|||
|
|
.fr-fieldset input:disabled + label + .fr-hint-text {
|
|||
|
|
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-tooltip {
|
|||
|
|
position: relative;
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip__btn::before {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/media/align-left.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip__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-tooltip__btn[aria-expanded=true]::before,
|
|||
|
|
.fr-tooltip__btn[aria-expanded=true]::after {
|
|||
|
|
background-image: url("../icons/system/subtract-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul.fr-tooltip__actions-group {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ol.fr-tooltip__actions-group {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul.fr-tooltip__actions-group,
|
|||
|
|
ol.fr-tooltip__actions-group {
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip .fr-modal:not(.fr-modal--opened) .fr-modal__content {
|
|||
|
|
max-height: 9.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip.fr-placement {
|
|||
|
|
z-index: 1000;
|
|||
|
|
background-image: linear-gradient(90deg, #fff, #fff);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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__detail {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group li::marker {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--bordered {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 .fr-sidemenu__link,
|
|||
|
|
.fr-sidemenu__item .fr-sidemenu__btn {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link[aria-current]:not([aria-current=false]),
|
|||
|
|
.fr-sidemenu__btn[aria-current]:not([aria-current=false]) {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-sidemenu__btn[aria-current]:not([aria-current=false])::before {
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__btn[aria-expanded=true] {
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight {
|
|||
|
|
background-image: linear-gradient(0deg, #6a6af4, #6a6af4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-tilleul-verveine {
|
|||
|
|
background-image: linear-gradient(0deg, #b7a73f, #b7a73f);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-bourgeon {
|
|||
|
|
background-image: linear-gradient(0deg, #68a532, #68a532);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-emeraude {
|
|||
|
|
background-image: linear-gradient(0deg, #00a95f, #00a95f);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-menthe {
|
|||
|
|
background-image: linear-gradient(0deg, #009081, #009081);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-archipel {
|
|||
|
|
background-image: linear-gradient(0deg, #009099, #009099);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--blue-ecume {
|
|||
|
|
background-image: linear-gradient(0deg, #465f9d, #465f9d);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--blue-cumulus {
|
|||
|
|
background-image: linear-gradient(0deg, #417dc4, #417dc4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--purple-glycine {
|
|||
|
|
background-image: linear-gradient(0deg, #a558a0, #a558a0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--pink-macaron {
|
|||
|
|
background-image: linear-gradient(0deg, #e18b76, #e18b76);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--pink-tuile {
|
|||
|
|
background-image: linear-gradient(0deg, #ce614a, #ce614a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--yellow-tournesol {
|
|||
|
|
background-image: linear-gradient(0deg, #c8aa39, #c8aa39);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--yellow-moutarde {
|
|||
|
|
background-image: linear-gradient(0deg, #c3992a, #c3992a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--orange-terre-battue {
|
|||
|
|
background-image: linear-gradient(0deg, #e4794a, #e4794a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-cafe-creme {
|
|||
|
|
background-image: linear-gradient(0deg, #d1b781, #d1b781);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-caramel {
|
|||
|
|
background-image: linear-gradient(0deg, #c08c65, #c08c65);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-opera {
|
|||
|
|
background-image: linear-gradient(0deg, #bd987a, #bd987a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--beige-gris-galet {
|
|||
|
|
background-image: linear-gradient(0deg, #aea397, #aea397);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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::before {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 3rem;
|
|||
|
|
right: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd, inset 1px 0 0 0 #ddd, inset -1px 0 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs .fr-tabs__list {
|
|||
|
|
padding: 0.25rem 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab::before,
|
|||
|
|
.fr-tabs__tab::after {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel {
|
|||
|
|
padding: 0 0.1px;
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel [href] {
|
|||
|
|
text-decoration: underline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel > * {
|
|||
|
|
margin-left: 1rem;
|
|||
|
|
margin-right: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel > *:first-child {
|
|||
|
|
margin-top: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel > *:last-child {
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), 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]:not(:disabled) {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
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 .fr-pagination__link--first::before,
|
|||
|
|
.fr-pagination .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 .fr-pagination__link--prev::before,
|
|||
|
|
.fr-pagination .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 .fr-pagination__link--next::before,
|
|||
|
|
.fr-pagination .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 .fr-pagination__link--last::before,
|
|||
|
|
.fr-pagination .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]:not([aria-current=false]) {
|
|||
|
|
background-color: #000091;
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]):hover {
|
|||
|
|
background-color: #1212ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]):active {
|
|||
|
|
background-color: #2323ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link:not([aria-current]):disabled,
|
|||
|
|
a.fr-pagination__link:not([aria-current]):not([href]),
|
|||
|
|
a.fr-pagination__link[aria-current=false]:not([href]),
|
|||
|
|
.fr-pagination__link[aria-current=false]:disabled {
|
|||
|
|
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 {
|
|||
|
|
text-decoration: none;
|
|||
|
|
color: #161616;
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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-group {
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group--sm::before,
|
|||
|
|
.fr-tags-group--sm::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group--sm a .fr-tag .fr-tag--dismiss::after,
|
|||
|
|
.fr-tags-group--sm button .fr-tag .fr-tag--dismiss::after,
|
|||
|
|
.fr-tags-group--sm input[type=button] .fr-tag .fr-tag--dismiss::after,
|
|||
|
|
.fr-tags-group--sm input[type=image] .fr-tag .fr-tag--dismiss::after,
|
|||
|
|
.fr-tags-group--sm input[type=reset] .fr-tag .fr-tag--dismiss::after,
|
|||
|
|
.fr-tags-group--sm input[type=submit] .fr-tag .fr-tag--dismiss::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 0.75rem;
|
|||
|
|
height: 0.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group--sm a .fr-tag[aria-pressed=true]::after,
|
|||
|
|
.fr-tags-group--sm button .fr-tag[aria-pressed=true]::after,
|
|||
|
|
.fr-tags-group--sm input[type=button] .fr-tag[aria-pressed=true]::after,
|
|||
|
|
.fr-tags-group--sm input[type=image] .fr-tag[aria-pressed=true]::after,
|
|||
|
|
.fr-tags-group--sm input[type=reset] .fr-tag[aria-pressed=true]::after,
|
|||
|
|
.fr-tags-group--sm input[type=submit] .fr-tag[aria-pressed=true]::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 0.75rem;
|
|||
|
|
height: 0.75rem;
|
|||
|
|
background-color: transparent !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[aria-pressed=false] {
|
|||
|
|
color: #000091;
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[aria-pressed=false]:hover {
|
|||
|
|
background-color: #c1c1fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[aria-pressed=false]:active {
|
|||
|
|
background-color: #adadf9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag.fr-tag--dismiss {
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag.fr-tag--dismiss:hover {
|
|||
|
|
background-color: #1212ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag.fr-tag--dismiss:active {
|
|||
|
|
background-color: #2323ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag,
|
|||
|
|
button.fr-tag,
|
|||
|
|
input[type=button].fr-tag {
|
|||
|
|
color: #000091;
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag:hover,
|
|||
|
|
button.fr-tag:hover,
|
|||
|
|
input[type=button].fr-tag:hover {
|
|||
|
|
background-color: #c1c1fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag:active,
|
|||
|
|
button.fr-tag:active,
|
|||
|
|
input[type=button].fr-tag:active {
|
|||
|
|
background-color: #adadf9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-tilleul-verveine,
|
|||
|
|
button.fr-tag--green-tilleul-verveine,
|
|||
|
|
input[type=button].fr-tag--green-tilleul-verveine {
|
|||
|
|
color: #66673d;
|
|||
|
|
background-color: #fbe769;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-tilleul-verveine:hover,
|
|||
|
|
button.fr-tag--green-tilleul-verveine:hover,
|
|||
|
|
input[type=button].fr-tag--green-tilleul-verveine:hover {
|
|||
|
|
background-color: #d7c655;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-tilleul-verveine:active,
|
|||
|
|
button.fr-tag--green-tilleul-verveine:active,
|
|||
|
|
input[type=button].fr-tag--green-tilleul-verveine:active {
|
|||
|
|
background-color: #c2b24c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-bourgeon,
|
|||
|
|
button.fr-tag--green-bourgeon,
|
|||
|
|
input[type=button].fr-tag--green-bourgeon {
|
|||
|
|
color: #447049;
|
|||
|
|
background-color: #a9fb68;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-bourgeon:hover,
|
|||
|
|
button.fr-tag--green-bourgeon:hover,
|
|||
|
|
input[type=button].fr-tag--green-bourgeon:hover {
|
|||
|
|
background-color: #8ed654;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-bourgeon:active,
|
|||
|
|
button.fr-tag--green-bourgeon:active,
|
|||
|
|
input[type=button].fr-tag--green-bourgeon:active {
|
|||
|
|
background-color: #7fc04b;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-emeraude,
|
|||
|
|
button.fr-tag--green-emeraude,
|
|||
|
|
input[type=button].fr-tag--green-emeraude {
|
|||
|
|
color: #297254;
|
|||
|
|
background-color: #9ef9be;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-emeraude:hover,
|
|||
|
|
button.fr-tag--green-emeraude:hover,
|
|||
|
|
input[type=button].fr-tag--green-emeraude:hover {
|
|||
|
|
background-color: #69df97;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-emeraude:active,
|
|||
|
|
button.fr-tag--green-emeraude:active,
|
|||
|
|
input[type=button].fr-tag--green-emeraude:active {
|
|||
|
|
background-color: #5ec988;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-menthe,
|
|||
|
|
button.fr-tag--green-menthe,
|
|||
|
|
input[type=button].fr-tag--green-menthe {
|
|||
|
|
color: #37635f;
|
|||
|
|
background-color: #8bf8e7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-menthe:hover,
|
|||
|
|
button.fr-tag--green-menthe:hover,
|
|||
|
|
input[type=button].fr-tag--green-menthe:hover {
|
|||
|
|
background-color: #6ed5c5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-menthe:active,
|
|||
|
|
button.fr-tag--green-menthe:active,
|
|||
|
|
input[type=button].fr-tag--green-menthe:active {
|
|||
|
|
background-color: #62bfb1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-archipel,
|
|||
|
|
button.fr-tag--green-archipel,
|
|||
|
|
input[type=button].fr-tag--green-archipel {
|
|||
|
|
color: #006a6f;
|
|||
|
|
background-color: #a6f2fa;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-archipel:hover,
|
|||
|
|
button.fr-tag--green-archipel:hover,
|
|||
|
|
input[type=button].fr-tag--green-archipel:hover {
|
|||
|
|
background-color: #62dbe5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-archipel:active,
|
|||
|
|
button.fr-tag--green-archipel:active,
|
|||
|
|
input[type=button].fr-tag--green-archipel:active {
|
|||
|
|
background-color: #58c5cf;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-ecume,
|
|||
|
|
button.fr-tag--blue-ecume,
|
|||
|
|
input[type=button].fr-tag--blue-ecume {
|
|||
|
|
color: #2f4077;
|
|||
|
|
background-color: #dee5fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-ecume:hover,
|
|||
|
|
button.fr-tag--blue-ecume:hover,
|
|||
|
|
input[type=button].fr-tag--blue-ecume:hover {
|
|||
|
|
background-color: #b4c5fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-ecume:active,
|
|||
|
|
button.fr-tag--blue-ecume:active,
|
|||
|
|
input[type=button].fr-tag--blue-ecume:active {
|
|||
|
|
background-color: #99b3f9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-cumulus,
|
|||
|
|
button.fr-tag--blue-cumulus,
|
|||
|
|
input[type=button].fr-tag--blue-cumulus {
|
|||
|
|
color: #3558a2;
|
|||
|
|
background-color: #dae6fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-cumulus:hover,
|
|||
|
|
button.fr-tag--blue-cumulus:hover,
|
|||
|
|
input[type=button].fr-tag--blue-cumulus:hover {
|
|||
|
|
background-color: #a9c8fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-cumulus:active,
|
|||
|
|
button.fr-tag--blue-cumulus:active,
|
|||
|
|
input[type=button].fr-tag--blue-cumulus:active {
|
|||
|
|
background-color: #8ab8f9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--purple-glycine,
|
|||
|
|
button.fr-tag--purple-glycine,
|
|||
|
|
input[type=button].fr-tag--purple-glycine {
|
|||
|
|
color: #6e445a;
|
|||
|
|
background-color: #fddbfa;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--purple-glycine:hover,
|
|||
|
|
button.fr-tag--purple-glycine:hover,
|
|||
|
|
input[type=button].fr-tag--purple-glycine:hover {
|
|||
|
|
background-color: #fbaff5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--purple-glycine:active,
|
|||
|
|
button.fr-tag--purple-glycine:active,
|
|||
|
|
input[type=button].fr-tag--purple-glycine:active {
|
|||
|
|
background-color: #fa96f2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-macaron,
|
|||
|
|
button.fr-tag--pink-macaron,
|
|||
|
|
input[type=button].fr-tag--pink-macaron {
|
|||
|
|
color: #8d533e;
|
|||
|
|
background-color: #fddfda;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-macaron:hover,
|
|||
|
|
button.fr-tag--pink-macaron:hover,
|
|||
|
|
input[type=button].fr-tag--pink-macaron:hover {
|
|||
|
|
background-color: #fbb8ab;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-macaron:active,
|
|||
|
|
button.fr-tag--pink-macaron:active,
|
|||
|
|
input[type=button].fr-tag--pink-macaron:active {
|
|||
|
|
background-color: #faa18d;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-tuile,
|
|||
|
|
button.fr-tag--pink-tuile,
|
|||
|
|
input[type=button].fr-tag--pink-tuile {
|
|||
|
|
color: #a94645;
|
|||
|
|
background-color: #fddfdb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-tuile:hover,
|
|||
|
|
button.fr-tag--pink-tuile:hover,
|
|||
|
|
input[type=button].fr-tag--pink-tuile:hover {
|
|||
|
|
background-color: #fbb8ad;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-tuile:active,
|
|||
|
|
button.fr-tag--pink-tuile:active,
|
|||
|
|
input[type=button].fr-tag--pink-tuile:active {
|
|||
|
|
background-color: #faa191;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-tournesol,
|
|||
|
|
button.fr-tag--yellow-tournesol,
|
|||
|
|
input[type=button].fr-tag--yellow-tournesol {
|
|||
|
|
color: #716043;
|
|||
|
|
background-color: #fde39c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-tournesol:hover,
|
|||
|
|
button.fr-tag--yellow-tournesol:hover,
|
|||
|
|
input[type=button].fr-tag--yellow-tournesol:hover {
|
|||
|
|
background-color: #e9c53b;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-tournesol:active,
|
|||
|
|
button.fr-tag--yellow-tournesol:active,
|
|||
|
|
input[type=button].fr-tag--yellow-tournesol:active {
|
|||
|
|
background-color: #d3b235;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-moutarde,
|
|||
|
|
button.fr-tag--yellow-moutarde,
|
|||
|
|
input[type=button].fr-tag--yellow-moutarde {
|
|||
|
|
color: #695240;
|
|||
|
|
background-color: #fde2b5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-moutarde:hover,
|
|||
|
|
button.fr-tag--yellow-moutarde:hover,
|
|||
|
|
input[type=button].fr-tag--yellow-moutarde:hover {
|
|||
|
|
background-color: #f6c43c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-moutarde:active,
|
|||
|
|
button.fr-tag--yellow-moutarde:active,
|
|||
|
|
input[type=button].fr-tag--yellow-moutarde:active {
|
|||
|
|
background-color: #dfb135;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--orange-terre-battue,
|
|||
|
|
button.fr-tag--orange-terre-battue,
|
|||
|
|
input[type=button].fr-tag--orange-terre-battue {
|
|||
|
|
color: #755348;
|
|||
|
|
background-color: #fddfd8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--orange-terre-battue:hover,
|
|||
|
|
button.fr-tag--orange-terre-battue:hover,
|
|||
|
|
input[type=button].fr-tag--orange-terre-battue:hover {
|
|||
|
|
background-color: #fbb8a5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--orange-terre-battue:active,
|
|||
|
|
button.fr-tag--orange-terre-battue:active,
|
|||
|
|
input[type=button].fr-tag--orange-terre-battue:active {
|
|||
|
|
background-color: #faa184;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-cafe-creme,
|
|||
|
|
button.fr-tag--brown-cafe-creme,
|
|||
|
|
input[type=button].fr-tag--brown-cafe-creme {
|
|||
|
|
color: #685c48;
|
|||
|
|
background-color: #f4e3c7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-cafe-creme:hover,
|
|||
|
|
button.fr-tag--brown-cafe-creme:hover,
|
|||
|
|
input[type=button].fr-tag--brown-cafe-creme:hover {
|
|||
|
|
background-color: #e1c386;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-cafe-creme:active,
|
|||
|
|
button.fr-tag--brown-cafe-creme:active,
|
|||
|
|
input[type=button].fr-tag--brown-cafe-creme:active {
|
|||
|
|
background-color: #ccb078;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-caramel,
|
|||
|
|
button.fr-tag--brown-caramel,
|
|||
|
|
input[type=button].fr-tag--brown-caramel {
|
|||
|
|
color: #845d48;
|
|||
|
|
background-color: #f3e2d9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-caramel:hover,
|
|||
|
|
button.fr-tag--brown-caramel:hover,
|
|||
|
|
input[type=button].fr-tag--brown-caramel:hover {
|
|||
|
|
background-color: #e7bea6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-caramel:active,
|
|||
|
|
button.fr-tag--brown-caramel:active,
|
|||
|
|
input[type=button].fr-tag--brown-caramel:active {
|
|||
|
|
background-color: #e1a982;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-opera,
|
|||
|
|
button.fr-tag--brown-opera,
|
|||
|
|
input[type=button].fr-tag--brown-opera {
|
|||
|
|
color: #745b47;
|
|||
|
|
background-color: #f3e2d7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-opera:hover,
|
|||
|
|
button.fr-tag--brown-opera:hover,
|
|||
|
|
input[type=button].fr-tag--brown-opera:hover {
|
|||
|
|
background-color: #e7bfa0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-opera:active,
|
|||
|
|
button.fr-tag--brown-opera:active,
|
|||
|
|
input[type=button].fr-tag--brown-opera:active {
|
|||
|
|
background-color: #deaa7e;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--beige-gris-galet,
|
|||
|
|
button.fr-tag--beige-gris-galet,
|
|||
|
|
input[type=button].fr-tag--beige-gris-galet {
|
|||
|
|
color: #6a6156;
|
|||
|
|
background-color: #eee4d9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--beige-gris-galet:hover,
|
|||
|
|
button.fr-tag--beige-gris-galet:hover,
|
|||
|
|
input[type=button].fr-tag--beige-gris-galet:hover {
|
|||
|
|
background-color: #dbc3a4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--beige-gris-galet:active,
|
|||
|
|
button.fr-tag--beige-gris-galet:active,
|
|||
|
|
input[type=button].fr-tag--beige-gris-galet:active {
|
|||
|
|
background-color: #c6b094;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled),
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #000091 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled):hover,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled):hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #1212ff 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled):active,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled):active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #2323ff 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]::after {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:disabled,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:disabled {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #e5e5e5 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:disabled::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:disabled::after {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #000091 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:hover,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #1212ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:active,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #2323ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:disabled,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:disabled {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #e5e5e5 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag:disabled,
|
|||
|
|
input[type=button].fr-tag:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a:not([href]).fr-tag {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true],
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true] {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #000091 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:hover,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #1212ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:active,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #2323ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:disabled,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:disabled {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #e5e5e5 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* reset des marges dans l'alerte
|
|||
|
|
*/
|
|||
|
|
.fr-alert::before,
|
|||
|
|
.fr-alert::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert__title,
|
|||
|
|
.fr-alert p {
|
|||
|
|
margin: 0 0 0.25rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--info::before {
|
|||
|
|
background-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--success::before {
|
|||
|
|
background-image: url("../icons/system/fr--success-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--error::before {
|
|||
|
|
background-image: url("../icons/system/fr--error-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--warning::before {
|
|||
|
|
background-image: url("../icons/system/fr--warning-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert .fr-btn--close::before,
|
|||
|
|
.fr-alert .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;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* reset des marges dans l'alerte
|
|||
|
|
*/
|
|||
|
|
.fr-alert .fr-link--close::before,
|
|||
|
|
.fr-alert .fr-link--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-alert {
|
|||
|
|
background-image: linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert::before {
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--info {
|
|||
|
|
background-image: linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--error {
|
|||
|
|
background-image: linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--success {
|
|||
|
|
background-image: linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--warning {
|
|||
|
|
background-image: linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* reset des marges dans le bandeau
|
|||
|
|
*/
|
|||
|
|
.fr-notice__title,
|
|||
|
|
.fr-notice p {
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice--info .fr-notice__body::before {
|
|||
|
|
background-image: url("../icons/system/fr--info-fill.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice .fr-btn--close::before,
|
|||
|
|
.fr-notice .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-notice {
|
|||
|
|
background-color: #eee;
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice--info {
|
|||
|
|
background-color: #e8edff;
|
|||
|
|
color: #0063cb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #000091 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #000091 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px), radial-gradient(#e5e5e5 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #ce0500 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #ce0500 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #18753c 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #18753c 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #0063cb 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #0063cb 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px), radial-gradient(#e5e5e5 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #000091 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #000091 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #ce0500 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #ce0500 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #18753c 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #18753c 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #0063cb 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #0063cb 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group--sm input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group--sm input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #000091 7px, transparent 8px);
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled ~ .fr-radio-rich__pictogram svg * {
|
|||
|
|
fill: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #000091 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked ~ .fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled ~ .fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, #e5e5e5, #e5e5e5), linear-gradient(0deg, #e5e5e5, #e5e5e5), linear-gradient(0deg, #e5e5e5, #e5e5e5), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #ce0500 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #ce0500 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #18753c 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #18753c 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #0063cb 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #0063cb 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-rich input[type=radio]:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-rich input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich__img {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled ~ .fr-radio-rich__img svg * {
|
|||
|
|
fill: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked ~ .fr-radio-rich__img {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled ~ .fr-radio-rich__img {
|
|||
|
|
background-image: linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-icon::after {
|
|||
|
|
content: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title,
|
|||
|
|
.fr-card__desc {
|
|||
|
|
flex: 1 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title a::after {
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/arrow-right-line.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title [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-card__detail::before {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-tile__title a::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/download-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header {
|
|||
|
|
padding-top: 56.25%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header .fr-card__img img {
|
|||
|
|
height: auto !important;
|
|||
|
|
width: auto;
|
|||
|
|
margin: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link .fr-card__title a {
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card.fr-enlarge-link .fr-card__title a::after {
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm.fr-enlarge-link .fr-card__title a::after {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--sm .fr-card__title a::after {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg.fr-enlarge-link .fr-card__title a::after {
|
|||
|
|
width: 2rem;
|
|||
|
|
height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--lg .fr-card__title a::after {
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card > .fr-card__img {
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card:not(.fr-card--no-border):not(.fr-card--shadow) {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--shadow {
|
|||
|
|
z-index: 500;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--shadow.fr-card--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-background {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-background:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-background:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download:not(.fr-card--no-background) .fr-card__header {
|
|||
|
|
background-color: #f6f6f6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__detail {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title a[href] {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title:disabled,
|
|||
|
|
a.fr-card__title:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox] {
|
|||
|
|
opacity: 1;
|
|||
|
|
margin-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__content .fr-checkbox-group input[type=checkbox] {
|
|||
|
|
margin-top: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__content + .fr-valid-text,
|
|||
|
|
.fr-fieldset__content + .fr-error-text {
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox] + label,
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox]:checked + label {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error::before {
|
|||
|
|
background-color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox] + label,
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox]:checked + label {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid::before {
|
|||
|
|
background-color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented--sm .fr-segmented__legend--inline {
|
|||
|
|
margin: 0.25rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__legend--inline {
|
|||
|
|
margin: 0.5rem 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__elements {
|
|||
|
|
display: inline-flex;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input + label::before {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
vertical-align: -2px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented input:focus + label::before {
|
|||
|
|
outline: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element label {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element input:checked + label {
|
|||
|
|
box-shadow: inset 0 0 0 1px #000091;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-segmented__element input:checked:disabled + label {
|
|||
|
|
box-shadow: inset 0 0 0 1px #929292;
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]::-ms-check {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked::before,
|
|||
|
|
.fr-toggle input[type=checkbox]:checked::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/check-line.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle__list {
|
|||
|
|
list-style: none;
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label::before {
|
|||
|
|
color: #000091;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23000091' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label::after {
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #000091;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox] {
|
|||
|
|
box-shadow: inset 0 0 0 1px #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked {
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23000091' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::after {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000091' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled {
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked {
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23e5e5e5' height='24' viewBox='0 0 40 24' fill='%23e5e5e5' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::after {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23929292' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::before {
|
|||
|
|
color: #929292;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23e5e5e5' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::after {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle .fr-hint-text {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--border-bottom {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label,
|
|||
|
|
.fr-fieldset--error .fr-toggle label {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label::before,
|
|||
|
|
.fr-fieldset--error .fr-toggle label::before {
|
|||
|
|
color: #ce0500;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23ce0500' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label::after,
|
|||
|
|
.fr-fieldset--error .fr-toggle label::after {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
.fr-fieldset--error .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23ce0500' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label::before,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label::before {
|
|||
|
|
color: #18753c;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%2318753c' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label::after,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label::after {
|
|||
|
|
box-shadow: inset 0 0 0 1px #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
.fr-fieldset--valid .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%2318753c' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Correctif
|
|||
|
|
*/
|
|||
|
|
.fr-skiplinks.focus-within {
|
|||
|
|
position: relative;
|
|||
|
|
transform: translateY(0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Cache l'icone native du select sur IE
|
|||
|
|
*/
|
|||
|
|
.fr-select::-ms-expand {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
background-color: #eee;
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' %3E%3Cpath fill='%23161616' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-select,
|
|||
|
|
.fr-select-group--valid .fr-select {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-select,
|
|||
|
|
.fr-select-group--error .fr-select {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, #ce0500, #ce0500);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, #18753c, #18753c);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--info::before {
|
|||
|
|
background-image: linear-gradient(0deg, #0063cb, #0063cb);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #e5e5e5;
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' %3E%3Cpath fill='%23929292' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select:-webkit-autofill,
|
|||
|
|
.fr-select:-webkit-autofill:hover,
|
|||
|
|
.fr-select:-webkit-autofill:focus {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a, inset 0 0 0 1000px #ececfe;
|
|||
|
|
-webkit-text-fill-color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Marge des titres et textes
|
|||
|
|
*/
|
|||
|
|
.fr-callout__title {
|
|||
|
|
margin: 0 0 0.5rem;
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout__text {
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout {
|
|||
|
|
background-color: #eee;
|
|||
|
|
background-image: linear-gradient(0deg, #6a6af4, #6a6af4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout::before {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-tilleul-verveine {
|
|||
|
|
background-image: linear-gradient(0deg, #b7a73f, #b7a73f);
|
|||
|
|
background-color: #fceeac;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-bourgeon {
|
|||
|
|
background-image: linear-gradient(0deg, #68a532, #68a532);
|
|||
|
|
background-color: #c9fcac;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-emeraude {
|
|||
|
|
background-image: linear-gradient(0deg, #00a95f, #00a95f);
|
|||
|
|
background-color: #c3fad5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-menthe {
|
|||
|
|
background-image: linear-gradient(0deg, #009081, #009081);
|
|||
|
|
background-color: #bafaee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-archipel {
|
|||
|
|
background-image: linear-gradient(0deg, #009099, #009099);
|
|||
|
|
background-color: #c7f6fc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--blue-ecume {
|
|||
|
|
background-image: linear-gradient(0deg, #465f9d, #465f9d);
|
|||
|
|
background-color: #e9edfe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--blue-cumulus {
|
|||
|
|
background-image: linear-gradient(0deg, #417dc4, #417dc4);
|
|||
|
|
background-color: #e6eefe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--purple-glycine {
|
|||
|
|
background-image: linear-gradient(0deg, #a558a0, #a558a0);
|
|||
|
|
background-color: #fee7fc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--pink-macaron {
|
|||
|
|
background-image: linear-gradient(0deg, #e18b76, #e18b76);
|
|||
|
|
background-color: #fee9e6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--pink-tuile {
|
|||
|
|
background-image: linear-gradient(0deg, #ce614a, #ce614a);
|
|||
|
|
background-color: #fee9e7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--yellow-tournesol {
|
|||
|
|
background-image: linear-gradient(0deg, #c8aa39, #c8aa39);
|
|||
|
|
background-color: #feecc2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--yellow-moutarde {
|
|||
|
|
background-image: linear-gradient(0deg, #c3992a, #c3992a);
|
|||
|
|
background-color: #feebd0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--orange-terre-battue {
|
|||
|
|
background-image: linear-gradient(0deg, #e4794a, #e4794a);
|
|||
|
|
background-color: #fee9e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-cafe-creme {
|
|||
|
|
background-image: linear-gradient(0deg, #d1b781, #d1b781);
|
|||
|
|
background-color: #f7ecdb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-caramel {
|
|||
|
|
background-image: linear-gradient(0deg, #c08c65, #c08c65);
|
|||
|
|
background-color: #f7ebe5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-opera {
|
|||
|
|
background-image: linear-gradient(0deg, #bd987a, #bd987a);
|
|||
|
|
background-color: #f7ece4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--beige-gris-galet {
|
|||
|
|
background-image: linear-gradient(0deg, #aea397, #aea397);
|
|||
|
|
background-color: #f3ede5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body {
|
|||
|
|
z-index: 2000;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__footer {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body.fr-scroll-divider .fr-modal__footer {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* reset liste à puce
|
|||
|
|
*/
|
|||
|
|
.fr-nav [href] {
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav ul {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav ol {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav ul,
|
|||
|
|
.fr-nav ol {
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* reset margin
|
|||
|
|
*/
|
|||
|
|
.fr-nav__btn::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-mega-menu__category {
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link,
|
|||
|
|
.fr-nav__btn {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link[aria-current]:not([aria-current=false]),
|
|||
|
|
.fr-nav__btn[aria-current]:not([aria-current=false]) {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__link[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-nav__btn[aria-current]:not([aria-current=false])::before {
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__btn[aria-expanded=true]:not(:disabled) {
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item::before {
|
|||
|
|
box-shadow: 0 -1px 0 0 #ddd, inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item:first-child::before {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item:last-child::before {
|
|||
|
|
box-shadow: 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__list::before {
|
|||
|
|
box-shadow: 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__group > li {
|
|||
|
|
list-style: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before,
|
|||
|
|
.fr-share .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--facebook::before {
|
|||
|
|
background-image: url("../icons/logo/facebook-circle-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--linkedin::before {
|
|||
|
|
background-image: url("../icons/logo/linkedin-box-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--mastodon::before {
|
|||
|
|
background-image: url("../icons/logo/mastodon-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--threads::before {
|
|||
|
|
background-image: url("../icons/logo/threads-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--twitter::before {
|
|||
|
|
background-image: url("../icons/logo/twitter-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--twitter-x::before {
|
|||
|
|
background-image: url("../icons/logo/twitter-x-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--mail::before {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/business/mail-line.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn--copy::before {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/business/links-fill.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled,
|
|||
|
|
.fr-share a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled:hover,
|
|||
|
|
.fr-share a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled:active,
|
|||
|
|
.fr-share a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__text {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link:disabled,
|
|||
|
|
a.fr-share__link:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link:disabled:hover,
|
|||
|
|
a.fr-share__link:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__link:disabled:active,
|
|||
|
|
a.fr-share__link:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Reset liste à puce
|
|||
|
|
*/
|
|||
|
|
.fr-footer ul {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer ol {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer ul,
|
|||
|
|
.fr-footer ol {
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-desc [href] {
|
|||
|
|
text-decoration: underline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer {
|
|||
|
|
box-shadow: inset 0 2px 0 0 #000091, inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-link {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top-cat {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top {
|
|||
|
|
background-color: #f6f6f6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom .fr-btn {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-link {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-copy {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-title {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners .fr-footer__logo {
|
|||
|
|
background-color: #fff;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Correctif de la largeur du texte dans la tuile
|
|||
|
|
*/
|
|||
|
|
.fr-tile--download .fr-tile__body,
|
|||
|
|
.fr-tile--horizontal .fr-tile__body {
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__body,
|
|||
|
|
.fr-tile__body > * {
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title {
|
|||
|
|
margin: 0 0 0.5rem;
|
|||
|
|
max-width: 100%;
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/arrow-right-line.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title [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-tile__desc {
|
|||
|
|
margin: 0;
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__start,
|
|||
|
|
.fr-tile__detail {
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--download .fr-tile__title a::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/download-line.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile.fr-enlarge-link .fr-tile__title a {
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile.fr-enlarge-link .fr-tile__title a::after {
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--sm .fr-tile__title a::after {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile:not(.fr-tile--no-border):not(.fr-tile--shadow) {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--shadow {
|
|||
|
|
z-index: 500;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--shadow.fr-tile--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-background {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-background:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-background:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title:disabled,
|
|||
|
|
a.fr-tile__title:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title::before {
|
|||
|
|
background-image: linear-gradient(0deg, #3a3a3a, #3a3a3a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a::before {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a:not([href])::before {
|
|||
|
|
background-image: linear-gradient(0deg, #e5e5e5, #e5e5e5);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn::before {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/editor/translate-2.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn::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-translate .fr-translate__btn[aria-expanded=true] {
|
|||
|
|
color: #000091;
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__menu .fr-translate__language {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn::before {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/media/align-left.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn::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-transcription__btn[aria-expanded=true]::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul.fr-transcription__actions-group {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ol.fr-transcription__actions-group {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul.fr-transcription__actions-group,
|
|||
|
|
ol.fr-transcription__actions-group {
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened) .fr-modal__content {
|
|||
|
|
max-height: 9.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn[aria-expanded=true] {
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__content::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__footer::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened)::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--addon .fr-btn {
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
background-color: #eee;
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::placeholder {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::-webkit-contacts-auto-fill-button {
|
|||
|
|
background-color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::-webkit-contacts-auto-fill-button:hover {
|
|||
|
|
background-color: #343434;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::-webkit-contacts-auto-fill-button:active {
|
|||
|
|
background-color: #474747;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input:autofill,
|
|||
|
|
.fr-input:autofill:hover,
|
|||
|
|
.fr-input:autofill:focus,
|
|||
|
|
.fr-input:-webkit-autofill,
|
|||
|
|
.fr-input:-webkit-autofill:hover,
|
|||
|
|
.fr-input:-webkit-autofill:focus {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a, inset 0 0 0 1000px #e8edff;
|
|||
|
|
-webkit-text-fill-color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-input,
|
|||
|
|
.fr-fieldset--valid .fr-input-wrap--addon > .fr-input:not(:last-child),
|
|||
|
|
.fr-input-group--valid .fr-input,
|
|||
|
|
.fr-input-group--valid .fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-input,
|
|||
|
|
.fr-fieldset--error .fr-input-wrap--addon > .fr-input:not(:last-child),
|
|||
|
|
.fr-input-group--error .fr-input,
|
|||
|
|
.fr-input-group--error .fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, #ce0500, #ce0500);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, #18753c, #18753c);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--info::before {
|
|||
|
|
background-image: linear-gradient(0deg, #0063cb, #0063cb);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-btn::before,
|
|||
|
|
.fr-search-bar .fr-btn::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/search-line.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input--valid {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input--error {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input::-webkit-search-cancel-button {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='%23161616' d='M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-11.414L9.172 7.757 7.757 9.172 10.586 12l-2.829 2.828 1.415 1.415L12 13.414l2.828 2.829 1.415-1.415L13.414 12l2.829-2.828-1.415-1.415L12 10.586z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption,
|
|||
|
|
.fr-content-media .fr-link {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link:disabled,
|
|||
|
|
.fr-content-media__transcription a.fr-link:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link:disabled:hover,
|
|||
|
|
.fr-content-media__transcription a.fr-link:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__transcription .fr-link:disabled:active,
|
|||
|
|
.fr-content-media__transcription a.fr-link:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__collapse .fr-consent-service__collapse-btn {
|
|||
|
|
text-decoration: underline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__collapse .fr-consent-service__collapse-btn::before,
|
|||
|
|
.fr-consent-service__collapse .fr-consent-service__collapse-btn::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-consent-service__collapse .fr-consent-service__collapse-btn[aria-expanded=true]::before,
|
|||
|
|
.fr-consent-service__collapse .fr-consent-service__collapse-btn[aria-expanded=true]::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/system/arrow-up-s-line.svg");
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-placeholder {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner {
|
|||
|
|
z-index: 1500;
|
|||
|
|
background-color: #f6f6f6;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header,
|
|||
|
|
.fr-consent-service {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header .fr-radio-group + .fr-radio-group::before,
|
|||
|
|
.fr-consent-service .fr-radio-group + .fr-radio-group::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service:last-of-type,
|
|||
|
|
.fr-consent-service .fr-consent-service {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Correctif de la largeur max des textes
|
|||
|
|
*/
|
|||
|
|
.fr-follow__newsletter > * {
|
|||
|
|
max-width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--dailymotion::before {
|
|||
|
|
background-image: url("../icons/logo/fr--dailymotion-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--facebook::before {
|
|||
|
|
background-image: url("../icons/logo/facebook-circle-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--github::before {
|
|||
|
|
background-image: url("../icons/logo/github-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--instagram::before {
|
|||
|
|
background-image: url("../icons/logo/instagram-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--linkedin::before {
|
|||
|
|
background-image: url("../icons/logo/linkedin-box-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--mastodon::before {
|
|||
|
|
background-image: url("../icons/logo/mastodon-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--snapchat::before {
|
|||
|
|
background-image: url("../icons/logo/snapchat-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--telegram::before {
|
|||
|
|
background-image: url("../icons/logo/telegram-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--threads::before {
|
|||
|
|
background-image: url("../icons/logo/threads-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--tiktok::before {
|
|||
|
|
background-image: url("../icons/logo/fr--tiktok-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--twitch::before {
|
|||
|
|
background-image: url("../icons/logo/twitch-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--twitter::before {
|
|||
|
|
background-image: url("../icons/logo/twitter-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--twitter-x::before {
|
|||
|
|
background-image: url("../icons/logo/twitter-x-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--vimeo::before {
|
|||
|
|
background-image: url("../icons/logo/vimeo-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btn--youtube::before {
|
|||
|
|
background-image: url("../icons/logo/youtube-fill.svg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before,
|
|||
|
|
.fr-follow .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-btns-group--lg .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before,
|
|||
|
|
.fr-follow .fr-btns-group--lg .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 2rem;
|
|||
|
|
height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--facebook::before,
|
|||
|
|
.fr-follow .fr-link--facebook::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/logo/facebook-circle-fill.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--twitter::before,
|
|||
|
|
.fr-follow .fr-link--twitter::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/logo/twitter-fill.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--instagram::before,
|
|||
|
|
.fr-follow .fr-link--instagram::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/logo/instagram-fill.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--linkedin::before,
|
|||
|
|
.fr-follow .fr-link--linkedin::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/logo/linkedin-box-fill.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-link--youtube::before,
|
|||
|
|
.fr-follow .fr-link--youtube::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-image: url("../icons/logo/youtube-fill.svg");
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-links-group:not(.fr-links-group--sm):not(.fr-links-group--lg) .fr-link:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before,
|
|||
|
|
.fr-follow .fr-links-group:not(.fr-links-group--sm):not(.fr-links-group--lg) .fr-link:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 1.5rem;
|
|||
|
|
height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-links-group--lg .fr-link:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::before,
|
|||
|
|
.fr-follow .fr-links-group--lg .fr-link:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"])::after {
|
|||
|
|
background-color: transparent;
|
|||
|
|
background-size: 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 2rem;
|
|||
|
|
height: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow {
|
|||
|
|
background-color: #f5f5fe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-input {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter-legal {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled:hover,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled:active,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:not(:first-child) {
|
|||
|
|
box-shadow: 0 -1px 0 0 #6a6af4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link:disabled,
|
|||
|
|
.fr-follow__social a.fr-link:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link:disabled:hover,
|
|||
|
|
.fr-follow__social a.fr-link:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-link:disabled:active,
|
|||
|
|
.fr-follow__social a.fr-link:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__checkbox {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__checkbox input[type=checkbox] {
|
|||
|
|
top: -0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled,
|
|||
|
|
a.fr-password__btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled:hover,
|
|||
|
|
a.fr-password__btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled:active,
|
|||
|
|
a.fr-password__btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password [data-fr-capslock]::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23161616' d='M22.668 0C23.4023 0 24 .5977 24 1.332v21.336c0 .7343-.5977 1.332-1.332 1.332H1.332C.5977 24 0 23.4023 0 22.668V1.332C0 .5977.5977 0 1.332 0Zm-1.336 2.668H2.668v18.664h18.664Zm-4.664 12.664V18H7.332v-2.668ZM12 5.332 16.668 10H14v3.332h-4V10H7.332Zm0 0'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-password__checkbox input[type=checkbox] + label {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header ul {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header ol {
|
|||
|
|
list-style-type: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header ul,
|
|||
|
|
.fr-header ol {
|
|||
|
|
padding-left: 0;
|
|||
|
|
margin-top: 0;
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header [href] {
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn:not([class^=fr-icon-]):not([class*=" fr-icon-"]):not([class^=fr-fi-]):not([class*=" fr-fi-"]):not(.fr-btn--display)::before {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-icon-]::before,
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-icon-"]::before,
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class^=fr-fi-]::before,
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn[class*=" fr-fi-"]::before {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-btns-group:not(.fr-btns-group--sm):not(.fr-btns-group--lg):not([class^=fr-btns-group--icon-]):not([class*=" fr-btns-group--icon-"]) .fr-btn.fr-btn--display::before {
|
|||
|
|
width: 1rem;
|
|||
|
|
height: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link {
|
|||
|
|
overflow: visible;
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__operator img {
|
|||
|
|
height: auto !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand {
|
|||
|
|
z-index: 750;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service {
|
|||
|
|
color: #161616;
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links::after {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled:active,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled:active,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled:active,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-service__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled:active,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled:hover,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled:active,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link {
|
|||
|
|
background-color: transparent;
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link:disabled,
|
|||
|
|
.fr-header__menu-links a.fr-link:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link:disabled:hover,
|
|||
|
|
.fr-header__menu-links a.fr-link:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-link:disabled:active,
|
|||
|
|
.fr-header__menu-links a.fr-link:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link:disabled,
|
|||
|
|
.fr-header__tools-links a.fr-link:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link:disabled:hover,
|
|||
|
|
.fr-header__tools-links a.fr-link:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-link:disabled:active,
|
|||
|
|
.fr-header__tools-links a.fr-link:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@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-range[data-fr-js-range] input[type=range]::-ms-fill-lower {
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range] input[type=range]:disabled::-ms-fill-lower {
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-range[data-fr-js-range].fr-range--double {
|
|||
|
|
background-image: linear-gradient(to right, #000091 0, #000091 100%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 (min-width: 48em) and (-ms-high-contrast: none), (min-width: 48em) and (-ms-high-contrast: active) {
|
|||
|
|
.fr-sidemenu {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__title {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__inner {
|
|||
|
|
box-shadow: inset -1px 0 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--right .fr-sidemenu__inner {
|
|||
|
|
box-shadow: inset 1px 0 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:not(:first-child) {
|
|||
|
|
box-shadow: -1px 0 0 0 #6a6af4;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media (-ms-high-contrast: none) and (min-width: 48em), (-ms-high-contrast: active) and (min-width: 48em) {
|
|||
|
|
.fr-tabs__panel > * {
|
|||
|
|
margin-left: 2rem;
|
|||
|
|
margin-right: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel > *:first-child {
|
|||
|
|
margin-top: 1.75rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__panel > *:last-child {
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__header {
|
|||
|
|
padding-top: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download .fr-card__body,
|
|||
|
|
.fr-card--horizontal .fr-card__body,
|
|||
|
|
.fr-card--horizontal-half .fr-card__body,
|
|||
|
|
.fr-card--horizontal-tier .fr-card__body {
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--download.fr-tile--vertical\@md .fr-tile__body,
|
|||
|
|
.fr-tile--horizontal.fr-tile--vertical\@md .fr-tile__body {
|
|||
|
|
flex-basis: auto;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media (forced-colors: active) and (-ms-high-contrast: none), (forced-colors: active) and (-ms-high-contrast: active), (prefers-contrast: more) and (-ms-high-contrast: none), (prefers-contrast: more) and (-ms-high-contrast: active) {
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]) {
|
|||
|
|
border: 1px solid #000091;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media (min-width: 62em) and (-ms-high-contrast: none), (min-width: 62em) and (-ms-high-contrast: active) {
|
|||
|
|
/**
|
|||
|
|
* Correctif de l'alignement des menus sur la droite
|
|||
|
|
*/
|
|||
|
|
.fr-nav__item {
|
|||
|
|
position: static;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-nav__item--align-right .fr-collapse {
|
|||
|
|
transform: translateX(-100%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Override du reset des marges des ul
|
|||
|
|
**/
|
|||
|
|
.fr-menu .fr-menu__list {
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu {
|
|||
|
|
z-index: 1000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu__list {
|
|||
|
|
background-color: #fff;
|
|||
|
|
box-shadow: inset 0 1px 0 0 #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu__list > *:first-child,
|
|||
|
|
.fr-menu__list > *:first-child > .fr-nav__link,
|
|||
|
|
.fr-menu__list > *:hover,
|
|||
|
|
.fr-menu__list > *:hover > .fr-nav__link,
|
|||
|
|
.fr-menu__list > *:hover + *,
|
|||
|
|
.fr-menu__list > *:hover + * > .fr-nav__link {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-menu .fr-nav__link {
|
|||
|
|
box-shadow: 0 calc(-1rem - 1px) 0 -1rem #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu {
|
|||
|
|
z-index: 1000;
|
|||
|
|
background-color: #fff;
|
|||
|
|
box-shadow: inset 0 1px 0 0 #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-mega-menu__category {
|
|||
|
|
box-shadow: 0 calc(1rem + 1px) 0 -1rem #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header {
|
|||
|
|
z-index: 750;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand {
|
|||
|
|
z-index: auto;
|
|||
|
|
background: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media (-ms-high-contrast: none) and (min-width: 62em), (-ms-high-contrast: active) and (min-width: 62em) {
|
|||
|
|
.fr-tile--download.fr-tile--vertical\@lg .fr-tile__body,
|
|||
|
|
.fr-tile--horizontal.fr-tile--vertical\@lg .fr-tile__body {
|
|||
|
|
flex-basis: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal {
|
|||
|
|
position: static;
|
|||
|
|
overflow: visible;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media print {
|
|||
|
|
.fr-upload {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd, 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn[aria-expanded=true] {
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion__btn::after {
|
|||
|
|
transform: rotate(-180deg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-accordion .fr-collapse:not(.fr-collapse--expanded) {
|
|||
|
|
--collapse-max-height: none !important;
|
|||
|
|
--collapse: inherit !important;
|
|||
|
|
visibility: visible;
|
|||
|
|
padding: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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: #000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-logo::after {
|
|||
|
|
background-position: 0 calc(100% + 1.875rem) !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--secondary:disabled,
|
|||
|
|
a.fr-btn--secondary:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary,
|
|||
|
|
.fr-btn--account {
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:disabled,
|
|||
|
|
a.fr-btn--tertiary:not([href]),
|
|||
|
|
a.fr-btn--account:not([href]),
|
|||
|
|
.fr-btn--account:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary-no-outline,
|
|||
|
|
.fr-btn--close,
|
|||
|
|
.fr-btn--display,
|
|||
|
|
.fr-btn--fullscreen,
|
|||
|
|
.fr-btn--tooltip,
|
|||
|
|
.fr-btn--briefcase,
|
|||
|
|
.fr-btn--team {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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]),
|
|||
|
|
a.fr-btn--tooltip:not([href]),
|
|||
|
|
a.fr-btn--briefcase:not([href]),
|
|||
|
|
a.fr-btn--team:not([href]),
|
|||
|
|
.fr-btn--close:disabled,
|
|||
|
|
.fr-btn--display:disabled,
|
|||
|
|
.fr-btn--fullscreen:disabled,
|
|||
|
|
.fr-btn--tooltip:disabled,
|
|||
|
|
.fr-btn--briefcase:disabled,
|
|||
|
|
.fr-btn--team:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--secondary,
|
|||
|
|
.fr-btn--tertiary,
|
|||
|
|
.fr-btn--tertiary-no-outline,
|
|||
|
|
.fr-btn--close,
|
|||
|
|
.fr-btn--display,
|
|||
|
|
.fr-btn--fullscreen,
|
|||
|
|
.fr-btn--tooltip {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect {
|
|||
|
|
background-color: #000091;
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect:disabled,
|
|||
|
|
a.fr-connect:not([href]) {
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect-group .fr-connect + p a {
|
|||
|
|
color: #000091;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-connect-group p {
|
|||
|
|
color: #666;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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__source {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-quote__author,
|
|||
|
|
.fr-quote cite,
|
|||
|
|
.fr-quote figcaption li {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb {
|
|||
|
|
color: #666;
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-breadcrumb__link[aria-current]:not([aria-current=false]) {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--valid label,
|
|||
|
|
.fr-input-group--valid label,
|
|||
|
|
.fr-range-group--valid label,
|
|||
|
|
.fr-upload-group--valid label {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--error label,
|
|||
|
|
.fr-input-group--error label,
|
|||
|
|
.fr-range-group--error label,
|
|||
|
|
.fr-upload-group--error label {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--info label,
|
|||
|
|
.fr-input-group--info label,
|
|||
|
|
.fr-range-group--info label,
|
|||
|
|
.fr-upload-group--info label {
|
|||
|
|
color: #0063cb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--disabled label,
|
|||
|
|
.fr-select-group--disabled .fr-hint-text,
|
|||
|
|
.fr-input-group--disabled label,
|
|||
|
|
.fr-input-group--disabled .fr-hint-text,
|
|||
|
|
.fr-range-group--disabled label,
|
|||
|
|
.fr-range-group--disabled .fr-hint-text,
|
|||
|
|
.fr-upload-group--disabled label,
|
|||
|
|
.fr-upload-group--disabled .fr-hint-text {
|
|||
|
|
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;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--error {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--valid {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-message--info {
|
|||
|
|
color: #0063cb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset:disabled .fr-label,
|
|||
|
|
.fr-fieldset:disabled .fr-hint-text,
|
|||
|
|
.fr-fieldset:disabled .fr-fieldset__legend {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset input:disabled + label,
|
|||
|
|
.fr-fieldset input:disabled + label .fr-hint-text,
|
|||
|
|
.fr-fieldset input:disabled + label + .fr-hint-text {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset__legend {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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-stepper__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__state {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__details {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-stepper__steps {
|
|||
|
|
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,
|
|||
|
|
.fr-stepper__details {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip.fr-placement {
|
|||
|
|
background-image: linear-gradient(90deg, #fff, #fff);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-link__detail {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group li::marker {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-links-group--bordered {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd, inset 0 1px 0 0 #ddd;
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
@include elevation.elevate(raised, (legacy:$legacy));
|
|||
|
|
@include respond-from(md) {
|
|||
|
|
@include elevation.drop((legacy:$legacy));
|
|||
|
|
}
|
|||
|
|
*/
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__title {
|
|||
|
|
color: #161616;
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__item .fr-sidemenu__link,
|
|||
|
|
.fr-sidemenu__item .fr-sidemenu__btn {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link[aria-current]:not([aria-current=false]),
|
|||
|
|
.fr-sidemenu__btn[aria-current]:not([aria-current=false]) {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__link[aria-current]:not([aria-current=false])::before,
|
|||
|
|
.fr-sidemenu__btn[aria-current]:not([aria-current=false])::before {
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__btn[aria-expanded=true] {
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight {
|
|||
|
|
background-image: linear-gradient(0deg, #6a6af4, #6a6af4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-tilleul-verveine {
|
|||
|
|
background-image: linear-gradient(0deg, #b7a73f, #b7a73f);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-bourgeon {
|
|||
|
|
background-image: linear-gradient(0deg, #68a532, #68a532);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-emeraude {
|
|||
|
|
background-image: linear-gradient(0deg, #00a95f, #00a95f);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-menthe {
|
|||
|
|
background-image: linear-gradient(0deg, #009081, #009081);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--green-archipel {
|
|||
|
|
background-image: linear-gradient(0deg, #009099, #009099);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--blue-ecume {
|
|||
|
|
background-image: linear-gradient(0deg, #465f9d, #465f9d);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--blue-cumulus {
|
|||
|
|
background-image: linear-gradient(0deg, #417dc4, #417dc4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--purple-glycine {
|
|||
|
|
background-image: linear-gradient(0deg, #a558a0, #a558a0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--pink-macaron {
|
|||
|
|
background-image: linear-gradient(0deg, #e18b76, #e18b76);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--pink-tuile {
|
|||
|
|
background-image: linear-gradient(0deg, #ce614a, #ce614a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--yellow-tournesol {
|
|||
|
|
background-image: linear-gradient(0deg, #c8aa39, #c8aa39);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--yellow-moutarde {
|
|||
|
|
background-image: linear-gradient(0deg, #c3992a, #c3992a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--orange-terre-battue {
|
|||
|
|
background-image: linear-gradient(0deg, #e4794a, #e4794a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-cafe-creme {
|
|||
|
|
background-image: linear-gradient(0deg, #d1b781, #d1b781);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-caramel {
|
|||
|
|
background-image: linear-gradient(0deg, #c08c65, #c08c65);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--brown-opera {
|
|||
|
|
background-image: linear-gradient(0deg, #bd987a, #bd987a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-highlight--beige-gris-galet {
|
|||
|
|
background-image: linear-gradient(0deg, #aea397, #aea397);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Tab button
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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, #ddd, #ddd), 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]:not(:disabled) {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
background-color: #fff;
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tabs__tab:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]) {
|
|||
|
|
background-color: #000091;
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]):hover {
|
|||
|
|
background-color: #1212ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link[aria-current]:not([aria-current=false]):active {
|
|||
|
|
background-color: #2323ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-pagination__link:not([aria-current]):disabled,
|
|||
|
|
a.fr-pagination__link:not([aria-current]):not([href]),
|
|||
|
|
a.fr-pagination__link[aria-current=false]:not([href]),
|
|||
|
|
.fr-pagination__link[aria-current=false]:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary {
|
|||
|
|
background-color: #eee;
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-summary li > a {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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 {
|
|||
|
|
/* Style bordered, ajoute des bordures entre chaque ligne */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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);
|
|||
|
|
|
|||
|
|
/* Style bordered, enleve le style even/odd */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-table td,
|
|||
|
|
.fr-table th {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag {
|
|||
|
|
color: #161616;
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[aria-pressed=false] {
|
|||
|
|
color: #000091;
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[aria-pressed=false]:hover {
|
|||
|
|
background-color: #c1c1fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag[aria-pressed=false]:active {
|
|||
|
|
background-color: #adadf9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag.fr-tag--dismiss {
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag.fr-tag--dismiss:hover {
|
|||
|
|
background-color: #1212ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tag.fr-tag--dismiss:active {
|
|||
|
|
background-color: #2323ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag,
|
|||
|
|
button.fr-tag,
|
|||
|
|
input[type=button].fr-tag {
|
|||
|
|
color: #000091;
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag:hover,
|
|||
|
|
button.fr-tag:hover,
|
|||
|
|
input[type=button].fr-tag:hover {
|
|||
|
|
background-color: #c1c1fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag:active,
|
|||
|
|
button.fr-tag:active,
|
|||
|
|
input[type=button].fr-tag:active {
|
|||
|
|
background-color: #adadf9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-tilleul-verveine,
|
|||
|
|
button.fr-tag--green-tilleul-verveine,
|
|||
|
|
input[type=button].fr-tag--green-tilleul-verveine {
|
|||
|
|
color: #66673d;
|
|||
|
|
background-color: #fbe769;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-tilleul-verveine:hover,
|
|||
|
|
button.fr-tag--green-tilleul-verveine:hover,
|
|||
|
|
input[type=button].fr-tag--green-tilleul-verveine:hover {
|
|||
|
|
background-color: #d7c655;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-tilleul-verveine:active,
|
|||
|
|
button.fr-tag--green-tilleul-verveine:active,
|
|||
|
|
input[type=button].fr-tag--green-tilleul-verveine:active {
|
|||
|
|
background-color: #c2b24c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-bourgeon,
|
|||
|
|
button.fr-tag--green-bourgeon,
|
|||
|
|
input[type=button].fr-tag--green-bourgeon {
|
|||
|
|
color: #447049;
|
|||
|
|
background-color: #a9fb68;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-bourgeon:hover,
|
|||
|
|
button.fr-tag--green-bourgeon:hover,
|
|||
|
|
input[type=button].fr-tag--green-bourgeon:hover {
|
|||
|
|
background-color: #8ed654;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-bourgeon:active,
|
|||
|
|
button.fr-tag--green-bourgeon:active,
|
|||
|
|
input[type=button].fr-tag--green-bourgeon:active {
|
|||
|
|
background-color: #7fc04b;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-emeraude,
|
|||
|
|
button.fr-tag--green-emeraude,
|
|||
|
|
input[type=button].fr-tag--green-emeraude {
|
|||
|
|
color: #297254;
|
|||
|
|
background-color: #9ef9be;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-emeraude:hover,
|
|||
|
|
button.fr-tag--green-emeraude:hover,
|
|||
|
|
input[type=button].fr-tag--green-emeraude:hover {
|
|||
|
|
background-color: #69df97;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-emeraude:active,
|
|||
|
|
button.fr-tag--green-emeraude:active,
|
|||
|
|
input[type=button].fr-tag--green-emeraude:active {
|
|||
|
|
background-color: #5ec988;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-menthe,
|
|||
|
|
button.fr-tag--green-menthe,
|
|||
|
|
input[type=button].fr-tag--green-menthe {
|
|||
|
|
color: #37635f;
|
|||
|
|
background-color: #8bf8e7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-menthe:hover,
|
|||
|
|
button.fr-tag--green-menthe:hover,
|
|||
|
|
input[type=button].fr-tag--green-menthe:hover {
|
|||
|
|
background-color: #6ed5c5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-menthe:active,
|
|||
|
|
button.fr-tag--green-menthe:active,
|
|||
|
|
input[type=button].fr-tag--green-menthe:active {
|
|||
|
|
background-color: #62bfb1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-archipel,
|
|||
|
|
button.fr-tag--green-archipel,
|
|||
|
|
input[type=button].fr-tag--green-archipel {
|
|||
|
|
color: #006a6f;
|
|||
|
|
background-color: #a6f2fa;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-archipel:hover,
|
|||
|
|
button.fr-tag--green-archipel:hover,
|
|||
|
|
input[type=button].fr-tag--green-archipel:hover {
|
|||
|
|
background-color: #62dbe5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--green-archipel:active,
|
|||
|
|
button.fr-tag--green-archipel:active,
|
|||
|
|
input[type=button].fr-tag--green-archipel:active {
|
|||
|
|
background-color: #58c5cf;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-ecume,
|
|||
|
|
button.fr-tag--blue-ecume,
|
|||
|
|
input[type=button].fr-tag--blue-ecume {
|
|||
|
|
color: #2f4077;
|
|||
|
|
background-color: #dee5fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-ecume:hover,
|
|||
|
|
button.fr-tag--blue-ecume:hover,
|
|||
|
|
input[type=button].fr-tag--blue-ecume:hover {
|
|||
|
|
background-color: #b4c5fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-ecume:active,
|
|||
|
|
button.fr-tag--blue-ecume:active,
|
|||
|
|
input[type=button].fr-tag--blue-ecume:active {
|
|||
|
|
background-color: #99b3f9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-cumulus,
|
|||
|
|
button.fr-tag--blue-cumulus,
|
|||
|
|
input[type=button].fr-tag--blue-cumulus {
|
|||
|
|
color: #3558a2;
|
|||
|
|
background-color: #dae6fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-cumulus:hover,
|
|||
|
|
button.fr-tag--blue-cumulus:hover,
|
|||
|
|
input[type=button].fr-tag--blue-cumulus:hover {
|
|||
|
|
background-color: #a9c8fb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--blue-cumulus:active,
|
|||
|
|
button.fr-tag--blue-cumulus:active,
|
|||
|
|
input[type=button].fr-tag--blue-cumulus:active {
|
|||
|
|
background-color: #8ab8f9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--purple-glycine,
|
|||
|
|
button.fr-tag--purple-glycine,
|
|||
|
|
input[type=button].fr-tag--purple-glycine {
|
|||
|
|
color: #6e445a;
|
|||
|
|
background-color: #fddbfa;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--purple-glycine:hover,
|
|||
|
|
button.fr-tag--purple-glycine:hover,
|
|||
|
|
input[type=button].fr-tag--purple-glycine:hover {
|
|||
|
|
background-color: #fbaff5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--purple-glycine:active,
|
|||
|
|
button.fr-tag--purple-glycine:active,
|
|||
|
|
input[type=button].fr-tag--purple-glycine:active {
|
|||
|
|
background-color: #fa96f2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-macaron,
|
|||
|
|
button.fr-tag--pink-macaron,
|
|||
|
|
input[type=button].fr-tag--pink-macaron {
|
|||
|
|
color: #8d533e;
|
|||
|
|
background-color: #fddfda;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-macaron:hover,
|
|||
|
|
button.fr-tag--pink-macaron:hover,
|
|||
|
|
input[type=button].fr-tag--pink-macaron:hover {
|
|||
|
|
background-color: #fbb8ab;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-macaron:active,
|
|||
|
|
button.fr-tag--pink-macaron:active,
|
|||
|
|
input[type=button].fr-tag--pink-macaron:active {
|
|||
|
|
background-color: #faa18d;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-tuile,
|
|||
|
|
button.fr-tag--pink-tuile,
|
|||
|
|
input[type=button].fr-tag--pink-tuile {
|
|||
|
|
color: #a94645;
|
|||
|
|
background-color: #fddfdb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-tuile:hover,
|
|||
|
|
button.fr-tag--pink-tuile:hover,
|
|||
|
|
input[type=button].fr-tag--pink-tuile:hover {
|
|||
|
|
background-color: #fbb8ad;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--pink-tuile:active,
|
|||
|
|
button.fr-tag--pink-tuile:active,
|
|||
|
|
input[type=button].fr-tag--pink-tuile:active {
|
|||
|
|
background-color: #faa191;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-tournesol,
|
|||
|
|
button.fr-tag--yellow-tournesol,
|
|||
|
|
input[type=button].fr-tag--yellow-tournesol {
|
|||
|
|
color: #716043;
|
|||
|
|
background-color: #fde39c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-tournesol:hover,
|
|||
|
|
button.fr-tag--yellow-tournesol:hover,
|
|||
|
|
input[type=button].fr-tag--yellow-tournesol:hover {
|
|||
|
|
background-color: #e9c53b;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-tournesol:active,
|
|||
|
|
button.fr-tag--yellow-tournesol:active,
|
|||
|
|
input[type=button].fr-tag--yellow-tournesol:active {
|
|||
|
|
background-color: #d3b235;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-moutarde,
|
|||
|
|
button.fr-tag--yellow-moutarde,
|
|||
|
|
input[type=button].fr-tag--yellow-moutarde {
|
|||
|
|
color: #695240;
|
|||
|
|
background-color: #fde2b5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-moutarde:hover,
|
|||
|
|
button.fr-tag--yellow-moutarde:hover,
|
|||
|
|
input[type=button].fr-tag--yellow-moutarde:hover {
|
|||
|
|
background-color: #f6c43c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--yellow-moutarde:active,
|
|||
|
|
button.fr-tag--yellow-moutarde:active,
|
|||
|
|
input[type=button].fr-tag--yellow-moutarde:active {
|
|||
|
|
background-color: #dfb135;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--orange-terre-battue,
|
|||
|
|
button.fr-tag--orange-terre-battue,
|
|||
|
|
input[type=button].fr-tag--orange-terre-battue {
|
|||
|
|
color: #755348;
|
|||
|
|
background-color: #fddfd8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--orange-terre-battue:hover,
|
|||
|
|
button.fr-tag--orange-terre-battue:hover,
|
|||
|
|
input[type=button].fr-tag--orange-terre-battue:hover {
|
|||
|
|
background-color: #fbb8a5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--orange-terre-battue:active,
|
|||
|
|
button.fr-tag--orange-terre-battue:active,
|
|||
|
|
input[type=button].fr-tag--orange-terre-battue:active {
|
|||
|
|
background-color: #faa184;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-cafe-creme,
|
|||
|
|
button.fr-tag--brown-cafe-creme,
|
|||
|
|
input[type=button].fr-tag--brown-cafe-creme {
|
|||
|
|
color: #685c48;
|
|||
|
|
background-color: #f4e3c7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-cafe-creme:hover,
|
|||
|
|
button.fr-tag--brown-cafe-creme:hover,
|
|||
|
|
input[type=button].fr-tag--brown-cafe-creme:hover {
|
|||
|
|
background-color: #e1c386;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-cafe-creme:active,
|
|||
|
|
button.fr-tag--brown-cafe-creme:active,
|
|||
|
|
input[type=button].fr-tag--brown-cafe-creme:active {
|
|||
|
|
background-color: #ccb078;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-caramel,
|
|||
|
|
button.fr-tag--brown-caramel,
|
|||
|
|
input[type=button].fr-tag--brown-caramel {
|
|||
|
|
color: #845d48;
|
|||
|
|
background-color: #f3e2d9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-caramel:hover,
|
|||
|
|
button.fr-tag--brown-caramel:hover,
|
|||
|
|
input[type=button].fr-tag--brown-caramel:hover {
|
|||
|
|
background-color: #e7bea6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-caramel:active,
|
|||
|
|
button.fr-tag--brown-caramel:active,
|
|||
|
|
input[type=button].fr-tag--brown-caramel:active {
|
|||
|
|
background-color: #e1a982;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-opera,
|
|||
|
|
button.fr-tag--brown-opera,
|
|||
|
|
input[type=button].fr-tag--brown-opera {
|
|||
|
|
color: #745b47;
|
|||
|
|
background-color: #f3e2d7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-opera:hover,
|
|||
|
|
button.fr-tag--brown-opera:hover,
|
|||
|
|
input[type=button].fr-tag--brown-opera:hover {
|
|||
|
|
background-color: #e7bfa0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--brown-opera:active,
|
|||
|
|
button.fr-tag--brown-opera:active,
|
|||
|
|
input[type=button].fr-tag--brown-opera:active {
|
|||
|
|
background-color: #deaa7e;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--beige-gris-galet,
|
|||
|
|
button.fr-tag--beige-gris-galet,
|
|||
|
|
input[type=button].fr-tag--beige-gris-galet {
|
|||
|
|
color: #6a6156;
|
|||
|
|
background-color: #eee4d9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--beige-gris-galet:hover,
|
|||
|
|
button.fr-tag--beige-gris-galet:hover,
|
|||
|
|
input[type=button].fr-tag--beige-gris-galet:hover {
|
|||
|
|
background-color: #dbc3a4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.fr-tag--beige-gris-galet:active,
|
|||
|
|
button.fr-tag--beige-gris-galet:active,
|
|||
|
|
input[type=button].fr-tag--beige-gris-galet:active {
|
|||
|
|
background-color: #c6b094;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled),
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled) {
|
|||
|
|
color: #f5f5fe;
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #000091 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled):hover,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled):hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #1212ff 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled):active,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled):active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #2323ff 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]::after {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:disabled,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:disabled {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.25rem, transparent 0.578125rem, #e5e5e5 0.625rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:disabled::after,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:disabled::after {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #000091 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:hover,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #1212ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:active,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #2323ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true].fr-tag--sm:disabled,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true].fr-tag--sm:disabled {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #e5e5e5 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag:disabled,
|
|||
|
|
input[type=button].fr-tag:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a:not([href]).fr-tag {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true],
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true] {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #000091 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:hover,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:hover {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #1212ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:active,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:active {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #2323ff 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tags-group.fr-tags-group--sm button.fr-tag[aria-pressed=true]:disabled,
|
|||
|
|
.fr-tags-group.fr-tags-group--sm input[type=button].fr-tag[aria-pressed=true]:disabled {
|
|||
|
|
background-image: radial-gradient(circle at 100% 0.1875rem, transparent 0.4475rem, #e5e5e5 0.5rem);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert {
|
|||
|
|
background-image: linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a), linear-gradient(0deg, #3a3a3a, #3a3a3a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert::before {
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--info {
|
|||
|
|
background-image: linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb), linear-gradient(0deg, #0063cb, #0063cb);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--error {
|
|||
|
|
background-image: linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500), linear-gradient(0deg, #ce0500, #ce0500);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--success {
|
|||
|
|
background-image: linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c), linear-gradient(0deg, #18753c, #18753c);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-alert--warning {
|
|||
|
|
background-image: linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000), linear-gradient(0deg, #b34000, #b34000);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice {
|
|||
|
|
background-color: #eee;
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-notice--info {
|
|||
|
|
background-color: #e8edff;
|
|||
|
|
color: #0063cb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #000091 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #000091 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px), radial-gradient(#e5e5e5 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #ce0500 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #ce0500 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #18753c 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #18753c 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #0063cb 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #0063cb 11px, transparent 12px), radial-gradient(#000091 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 10px, #e5e5e5 11px, transparent 12px), radial-gradient(#e5e5e5 5px, transparent 6px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #000091 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #000091 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-group--sm input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #ce0500 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #ce0500 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #18753c 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #18753c 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group--sm input[type=radio] + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #0063cb 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-group--sm input[type=radio]:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #0063cb 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group--sm input[type=radio]:disabled + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-group--sm input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #000091 7px, transparent 8px);
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:disabled ~ .fr-radio-rich__pictogram svg * {
|
|||
|
|
fill: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #000091 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked ~ .fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), linear-gradient(0deg, #929292, #929292), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-radio-rich input[type=radio]:checked:disabled ~ .fr-radio-rich__pictogram {
|
|||
|
|
background-image: linear-gradient(0deg, #e5e5e5, #e5e5e5), linear-gradient(0deg, #e5e5e5, #e5e5e5), linear-gradient(0deg, #e5e5e5, #e5e5e5), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #ce0500 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #ce0500 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #18753c 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #18753c 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-rich input[type=radio] + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #0063cb 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--info .fr-radio-rich input[type=radio]:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), linear-gradient(0deg, #000091, #000091), radial-gradient(transparent 6px, #0063cb 7px, transparent 8px), radial-gradient(#000091 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-rich input[type=radio]:disabled + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset .fr-radio-rich input[type=radio]:disabled:checked + label {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), radial-gradient(transparent 6px, #e5e5e5 7px, transparent 8px), radial-gradient(#e5e5e5 3px, transparent 4px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card:not(.fr-card--no-border):not(.fr-card--shadow) {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--shadow {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--shadow.fr-card--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--download:not(.fr-card--no-background) .fr-card__header {
|
|||
|
|
background-color: #f6f6f6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__detail {
|
|||
|
|
color: #666;
|
|||
|
|
line-height: 1rem !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title a[href] {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__title:disabled,
|
|||
|
|
a.fr-card__title:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card__detail,
|
|||
|
|
.fr-card__desc {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox] + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox]:checked + label::before {
|
|||
|
|
background-color: var(--background-active-blue-france);
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-active-blue-france) 4px, var(--border-active-blue-france) 5px, transparent 6px), linear-gradient(var(--border-active-blue-france), var(--border-active-blue-france)), var(--data-uri-svg);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23f5f5fe' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-checkbox-group input[type=checkbox]:checked + label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23000091' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox]:disabled + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--background-disabled-grey) 4px, var(--background-disabled-grey) 5px, transparent 6px), linear-gradient(var(--background-disabled-grey), var(--background-disabled-grey)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group input[type=checkbox]:disabled:checked + label::before {
|
|||
|
|
background-color: var(--background-disabled-grey);
|
|||
|
|
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23929292' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
:root[data-fr-theme=dark] .fr-checkbox-group input[type=checkbox]:disabled:checked + label::before {
|
|||
|
|
--data-uri-svg: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23666' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/></svg>");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox] + label,
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox]:checked + label {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox] + label::before,
|
|||
|
|
.fr-checkbox-group--error input[type=checkbox]:checked + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--error::before {
|
|||
|
|
background-color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox] + label,
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox]:checked + label {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox] + label::before,
|
|||
|
|
.fr-checkbox-group--valid input[type=checkbox]:checked + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-checkbox-group--valid::before {
|
|||
|
|
background-color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-checkbox-group input[type=checkbox] + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-error) 4px, var(--border-plain-error) 5px, transparent 6px), linear-gradient(var(--border-plain-error), var(--border-plain-error)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-checkbox-group input[type=checkbox] + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-plain-success) 4px, var(--border-plain-success) 5px, transparent 6px), linear-gradient(var(--border-plain-success), var(--border-plain-success)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label::before {
|
|||
|
|
color: #000091;
|
|||
|
|
content: "";
|
|||
|
|
display: block;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label::after {
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #000091;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox] {
|
|||
|
|
box-shadow: inset 0 0 0 1px #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked {
|
|||
|
|
background-color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled {
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked {
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::before {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::after {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle .fr-hint-text {
|
|||
|
|
color: #666;
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--border-bottom {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label,
|
|||
|
|
.fr-fieldset--error .fr-toggle label {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label::before,
|
|||
|
|
.fr-fieldset--error .fr-toggle label::before {
|
|||
|
|
color: #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label::after,
|
|||
|
|
.fr-fieldset--error .fr-toggle label::after {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label::before,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label::before {
|
|||
|
|
color: #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label::after,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label::after {
|
|||
|
|
box-shadow: inset 0 0 0 1px #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplinks {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-skiplink {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
background-color: #eee;
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a;
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 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-fieldset--valid .fr-select,
|
|||
|
|
.fr-select-group--valid .fr-select {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-select,
|
|||
|
|
.fr-select-group--error .fr-select {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, #ce0500, #ce0500);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, #18753c, #18753c);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select-group--info::before {
|
|||
|
|
background-image: linear-gradient(0deg, #0063cb, #0063cb);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select:disabled {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select:-webkit-autofill,
|
|||
|
|
.fr-select:-webkit-autofill:hover,
|
|||
|
|
.fr-select:-webkit-autofill:focus {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a, inset 0 0 0 1000px #ececfe;
|
|||
|
|
-webkit-text-fill-color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout {
|
|||
|
|
background-color: #eee;
|
|||
|
|
background-image: linear-gradient(0deg, #6a6af4, #6a6af4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout::before {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-tilleul-verveine {
|
|||
|
|
background-image: linear-gradient(0deg, #b7a73f, #b7a73f);
|
|||
|
|
background-color: #fceeac;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-bourgeon {
|
|||
|
|
background-image: linear-gradient(0deg, #68a532, #68a532);
|
|||
|
|
background-color: #c9fcac;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-emeraude {
|
|||
|
|
background-image: linear-gradient(0deg, #00a95f, #00a95f);
|
|||
|
|
background-color: #c3fad5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-menthe {
|
|||
|
|
background-image: linear-gradient(0deg, #009081, #009081);
|
|||
|
|
background-color: #bafaee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--green-archipel {
|
|||
|
|
background-image: linear-gradient(0deg, #009099, #009099);
|
|||
|
|
background-color: #c7f6fc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--blue-ecume {
|
|||
|
|
background-image: linear-gradient(0deg, #465f9d, #465f9d);
|
|||
|
|
background-color: #e9edfe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--blue-cumulus {
|
|||
|
|
background-image: linear-gradient(0deg, #417dc4, #417dc4);
|
|||
|
|
background-color: #e6eefe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--purple-glycine {
|
|||
|
|
background-image: linear-gradient(0deg, #a558a0, #a558a0);
|
|||
|
|
background-color: #fee7fc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--pink-macaron {
|
|||
|
|
background-image: linear-gradient(0deg, #e18b76, #e18b76);
|
|||
|
|
background-color: #fee9e6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--pink-tuile {
|
|||
|
|
background-image: linear-gradient(0deg, #ce614a, #ce614a);
|
|||
|
|
background-color: #fee9e7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--yellow-tournesol {
|
|||
|
|
background-image: linear-gradient(0deg, #c8aa39, #c8aa39);
|
|||
|
|
background-color: #feecc2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--yellow-moutarde {
|
|||
|
|
background-image: linear-gradient(0deg, #c3992a, #c3992a);
|
|||
|
|
background-color: #feebd0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--orange-terre-battue {
|
|||
|
|
background-image: linear-gradient(0deg, #e4794a, #e4794a);
|
|||
|
|
background-color: #fee9e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-cafe-creme {
|
|||
|
|
background-image: linear-gradient(0deg, #d1b781, #d1b781);
|
|||
|
|
background-color: #f7ecdb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-caramel {
|
|||
|
|
background-image: linear-gradient(0deg, #c08c65, #c08c65);
|
|||
|
|
background-color: #f7ebe5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--brown-opera {
|
|||
|
|
background-image: linear-gradient(0deg, #bd987a, #bd987a);
|
|||
|
|
background-color: #f7ece4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-callout--beige-gris-galet {
|
|||
|
|
background-image: linear-gradient(0deg, #aea397, #aea397);
|
|||
|
|
background-color: #f3ede5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__footer {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body.fr-scroll-divider .fr-modal__footer {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-navigation {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled,
|
|||
|
|
.fr-share a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share__text {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer {
|
|||
|
|
box-shadow: inset 0 2px 0 0 #000091, inset 0 -1px 0 0 #ddd;
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__content-link {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top-cat {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__top {
|
|||
|
|
background-color: #f6f6f6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom .fr-btn {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-item::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-link {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__bottom-copy {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners-title {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-footer__partners .fr-footer__logo {
|
|||
|
|
background-color: #fff;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile:not(.fr-tile--no-border):not(.fr-tile--shadow) {
|
|||
|
|
background-image: linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd), linear-gradient(0deg, #ddd, #ddd);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--shadow {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--shadow.fr-tile--grey {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title:disabled,
|
|||
|
|
a.fr-tile__title:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
background-color: #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title::before {
|
|||
|
|
background-image: linear-gradient(0deg, #3a3a3a, #3a3a3a);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a::before {
|
|||
|
|
background-image: linear-gradient(0deg, #000091, #000091);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile__title a:not([href])::before {
|
|||
|
|
background-image: linear-gradient(0deg, #e5e5e5, #e5e5e5);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile .fr-tile__desc,
|
|||
|
|
.fr-tile .fr-tile__detail,
|
|||
|
|
.fr-tile__desc,
|
|||
|
|
.fr-tile__detail,
|
|||
|
|
.fr-tile--sm .fr-tile__desc,
|
|||
|
|
.fr-tile--sm .fr-tile__detail,
|
|||
|
|
.fr-tile--sm__desc,
|
|||
|
|
.fr-tile--sm__detail {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn[aria-expanded=true] {
|
|||
|
|
color: #000091;
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate .fr-translate__btn {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__btn[aria-expanded=true] {
|
|||
|
|
background-color: #e3e3fd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__content::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription__footer::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription .fr-modal:not(.fr-modal--opened)::before {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-transcription {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input {
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
background-color: #eee;
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::placeholder {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::-webkit-contacts-auto-fill-button {
|
|||
|
|
background-color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::-webkit-contacts-auto-fill-button:hover {
|
|||
|
|
background-color: #343434;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input::-webkit-contacts-auto-fill-button:active {
|
|||
|
|
background-color: #474747;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input:disabled {
|
|||
|
|
color: var(--text-disabled-grey);
|
|||
|
|
box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input:autofill,
|
|||
|
|
.fr-input:autofill:hover,
|
|||
|
|
.fr-input:autofill:focus,
|
|||
|
|
.fr-input:-webkit-autofill,
|
|||
|
|
.fr-input:-webkit-autofill:hover,
|
|||
|
|
.fr-input:-webkit-autofill:focus {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #3a3a3a, inset 0 0 0 1000px #e8edff;
|
|||
|
|
-webkit-text-fill-color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--valid .fr-input,
|
|||
|
|
.fr-fieldset--valid .fr-input-wrap--addon > .fr-input:not(:last-child),
|
|||
|
|
.fr-input-group--valid .fr-input,
|
|||
|
|
.fr-input-group--valid .fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-fieldset--error .fr-input,
|
|||
|
|
.fr-fieldset--error .fr-input-wrap--addon > .fr-input:not(:last-child),
|
|||
|
|
.fr-input-group--error .fr-input,
|
|||
|
|
.fr-input-group--error .fr-input-wrap--addon > .fr-input:not(:last-child) {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--error::before {
|
|||
|
|
background-image: linear-gradient(0deg, #ce0500, #ce0500);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--valid::before {
|
|||
|
|
background-image: linear-gradient(0deg, #18753c, #18753c);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-input-group--info::before {
|
|||
|
|
background-image: linear-gradient(0deg, #0063cb, #0063cb);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input--valid {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #18753c;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input--error {
|
|||
|
|
box-shadow: inset 0 -2px 0 0 #ce0500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption,
|
|||
|
|
.fr-content-media .fr-link {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption .fr-link {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
line-height: 1.5rem;
|
|||
|
|
padding: 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-content-media__caption .fr-link::before,
|
|||
|
|
.fr-content-media__caption .fr-link::after {
|
|||
|
|
--icon-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-placeholder {
|
|||
|
|
background-color: #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner {
|
|||
|
|
background-color: #f6f6f6;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header,
|
|||
|
|
.fr-consent-service {
|
|||
|
|
box-shadow: inset 0 -1px 0 0 #ddd;
|
|||
|
|
color: #3a3a3a;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-manager__header .fr-radio-group + .fr-radio-group::before,
|
|||
|
|
.fr-consent-service .fr-radio-group + .fr-radio-group::before {
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service .fr-consent-service__collapse-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Mixin d'ajout des icones des réseaux sociaux
|
|||
|
|
**/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Mixin d'ajout des icones des réseaux sociaux
|
|||
|
|
**/
|
|||
|
|
.fr-follow {
|
|||
|
|
background-color: #f5f5fe;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-input {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__newsletter-legal {
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:not(:first-child) {
|
|||
|
|
box-shadow: 0 -1px 0 0 #6a6af4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled,
|
|||
|
|
a.fr-password__btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-password__checkbox input[type=checkbox] + label {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password .fr-password__checkbox input[type=checkbox] + label::before {
|
|||
|
|
background-image: radial-gradient(at 5px 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) 4px, transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at calc(100% - 5px) calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), radial-gradient(at 5px calc(100% - 4px), transparent 4px, var(--border-action-high-blue-france) 4px, var(--border-action-high-blue-france) 5px, transparent 6px), linear-gradient(var(--border-action-high-blue-france), var(--border-action-high-blue-france)), var(--data-uri-svg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand {
|
|||
|
|
background-color: #fff;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service {
|
|||
|
|
color: #161616;
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links::after {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-service__title {
|
|||
|
|
color: #161616;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn {
|
|||
|
|
color: #000091;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu {
|
|||
|
|
color: #000091;
|
|||
|
|
box-shadow: inset 0 0 0 1px #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]) {
|
|||
|
|
color: #929292;
|
|||
|
|
box-shadow: inset 0 0 0 1px #e5e5e5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-modal {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__body-row {
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__body .fr-header__tools,
|
|||
|
|
.fr-header__body .fr-header__navbar {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand-top {
|
|||
|
|
width: auto;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media print and (-ms-high-contrast: none), print and (-ms-high-contrast: active) {
|
|||
|
|
.fr-btn--secondary {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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]) {
|
|||
|
|
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,
|
|||
|
|
.fr-btn--account {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:hover,
|
|||
|
|
.fr-btn--account:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:active,
|
|||
|
|
.fr-btn--account:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:disabled,
|
|||
|
|
a.fr-btn--tertiary:not([href]),
|
|||
|
|
a.fr-btn--account:not([href]),
|
|||
|
|
.fr-btn--account:disabled {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:disabled:hover,
|
|||
|
|
a.fr-btn--tertiary:not([href]):hover,
|
|||
|
|
a.fr-btn--account:not([href]):hover,
|
|||
|
|
.fr-btn--account:disabled:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary:disabled:active,
|
|||
|
|
a.fr-btn--tertiary:not([href]):active,
|
|||
|
|
a.fr-btn--account:not([href]):active,
|
|||
|
|
.fr-btn--account:disabled:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary-no-outline,
|
|||
|
|
.fr-btn--close,
|
|||
|
|
.fr-btn--display,
|
|||
|
|
.fr-btn--fullscreen,
|
|||
|
|
.fr-btn--tooltip,
|
|||
|
|
.fr-btn--briefcase,
|
|||
|
|
.fr-btn--team {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-btn--tertiary-no-outline:hover,
|
|||
|
|
.fr-btn--close:hover,
|
|||
|
|
.fr-btn--display:hover,
|
|||
|
|
.fr-btn--fullscreen:hover,
|
|||
|
|
.fr-btn--tooltip:hover,
|
|||
|
|
.fr-btn--briefcase:hover,
|
|||
|
|
.fr-btn--team: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,
|
|||
|
|
.fr-btn--tooltip:active,
|
|||
|
|
.fr-btn--briefcase:active,
|
|||
|
|
.fr-btn--team: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]),
|
|||
|
|
a.fr-btn--tooltip:not([href]),
|
|||
|
|
a.fr-btn--briefcase:not([href]),
|
|||
|
|
a.fr-btn--team:not([href]),
|
|||
|
|
.fr-btn--close:disabled,
|
|||
|
|
.fr-btn--display:disabled,
|
|||
|
|
.fr-btn--fullscreen:disabled,
|
|||
|
|
.fr-btn--tooltip:disabled,
|
|||
|
|
.fr-btn--briefcase:disabled,
|
|||
|
|
.fr-btn--team:disabled {
|
|||
|
|
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,
|
|||
|
|
a.fr-btn--tooltip:not([href]):hover,
|
|||
|
|
a.fr-btn--briefcase:not([href]):hover,
|
|||
|
|
a.fr-btn--team:not([href]):hover,
|
|||
|
|
.fr-btn--close:disabled:hover,
|
|||
|
|
.fr-btn--display:disabled:hover,
|
|||
|
|
.fr-btn--fullscreen:disabled:hover,
|
|||
|
|
.fr-btn--tooltip:disabled:hover,
|
|||
|
|
.fr-btn--briefcase:disabled:hover,
|
|||
|
|
.fr-btn--team: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,
|
|||
|
|
a.fr-btn--tooltip:not([href]):active,
|
|||
|
|
a.fr-btn--briefcase:not([href]):active,
|
|||
|
|
a.fr-btn--team:not([href]):active,
|
|||
|
|
.fr-btn--close:disabled:active,
|
|||
|
|
.fr-btn--display:disabled:active,
|
|||
|
|
.fr-btn--fullscreen:disabled:active,
|
|||
|
|
.fr-btn--tooltip:disabled:active,
|
|||
|
|
.fr-btn--briefcase:disabled:active,
|
|||
|
|
.fr-btn--team:disabled:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tooltip.fr-placement {
|
|||
|
|
z-index: 1000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.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);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:not(:disabled),
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:not(:disabled) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button.fr-tag[aria-pressed=true]:disabled,
|
|||
|
|
input[type=button].fr-tag[aria-pressed=true]:disabled {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--shadow {
|
|||
|
|
z-index: 500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-background {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-background:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-card--no-background:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23000091' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23000091' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::after {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000091' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23e5e5e5' height='24' viewBox='0 0 40 24' fill='%23e5e5e5' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled:checked ~ .fr-toggle__label::after {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23929292' d='M10 15.17l9.2-9.2 1.4 1.42L10 18l-6.36-6.36 1.4-1.42z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle input[type=checkbox]:disabled ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23e5e5e5' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error label::before,
|
|||
|
|
.fr-fieldset--error .fr-toggle label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23ce0500' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--error input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
.fr-fieldset--error .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%23ce0500' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid label::before,
|
|||
|
|
.fr-fieldset--valid .fr-toggle label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%2318753c' height='24' viewBox='0 0 40 24' fill='transparent' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-toggle--valid input[type=checkbox]:checked ~ .fr-toggle__label::before,
|
|||
|
|
.fr-fieldset--valid .fr-toggle input[type=checkbox]:checked ~ .fr-toggle__label::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' stroke='%2318753c' height='24' viewBox='0 0 40 24' fill='%23000091' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='39' height='23' rx='11.5' /%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' %3E%3Cpath fill='%23161616' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-select:disabled {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 24 24' %3E%3Cpath fill='%23929292' d='M12,13.1l5-4.9l1.4,1.4L12,15.9L5.6,9.5l1.4-1.4L12,13.1z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-modal__body {
|
|||
|
|
z-index: 2000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled,
|
|||
|
|
.fr-share a.fr-btn:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled:hover,
|
|||
|
|
.fr-share a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-share .fr-btn:disabled:active,
|
|||
|
|
.fr-share a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--shadow {
|
|||
|
|
z-index: 500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-background {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-background:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-tile--no-background:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-translate__menu .fr-translate__language {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-search-bar .fr-input::-webkit-search-cancel-button {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='%23161616' d='M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-11.414L9.172 7.757 7.757 9.172 10.586 12l-2.829 2.828 1.415 1.415L12 13.414l2.828 2.829 1.415-1.415L13.414 12l2.829-2.828-1.415-1.415L12 10.586z'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-banner {
|
|||
|
|
z-index: 1500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-consent-service:last-of-type,
|
|||
|
|
.fr-consent-service .fr-consent-service {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled:hover,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow__social .fr-btn:disabled:active,
|
|||
|
|
.fr-follow__social a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled,
|
|||
|
|
a.fr-password__btn:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled:hover,
|
|||
|
|
a.fr-password__btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password__btn:disabled:active,
|
|||
|
|
a.fr-password__btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-password [data-fr-capslock]::before {
|
|||
|
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23161616' d='M22.668 0C23.4023 0 24 .5977 24 1.332v21.336c0 .7343-.5977 1.332-1.332 1.332H1.332C.5977 24 0 23.4023 0 22.668V1.332C0 .5977.5977 0 1.332 0Zm-1.336 2.668H2.668v18.664h18.664Zm-4.664 12.664V18H7.332v-2.668ZM12 5.332 16.668 10H14v3.332h-4V10H7.332Zm0 0'/%3E%3C/svg%3E");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand {
|
|||
|
|
z-index: 750;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__menu-links .fr-btn:disabled:active,
|
|||
|
|
.fr-header__menu-links a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links .fr-btn:disabled:active,
|
|||
|
|
.fr-header__tools-links a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child .fr-btn:disabled:active,
|
|||
|
|
.fr-header__tools-links > .fr-translate:first-child:last-child a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled:hover,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn:disabled:active,
|
|||
|
|
.fr-header__navbar a.fr-btn:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]) {
|
|||
|
|
background-color: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled:hover,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]):hover {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__navbar .fr-btn--menu:disabled:active,
|
|||
|
|
.fr-header__navbar a.fr-btn--menu:not([href]):active {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media print and (min-width: 48em) and (-ms-high-contrast: none), print and (min-width: 48em) and (-ms-high-contrast: active) {
|
|||
|
|
.fr-sidemenu {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu__title {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media print and (min-width: 48em) {
|
|||
|
|
.fr-sidemenu__inner {
|
|||
|
|
box-shadow: inset -1px 0 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-sidemenu--right .fr-sidemenu__inner {
|
|||
|
|
box-shadow: inset 1px 0 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-follow .fr-grid-row > *:not(:first-child) {
|
|||
|
|
box-shadow: -1px 0 0 0 #6a6af4;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media print and (min-width: 62em) {
|
|||
|
|
.fr-header {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header .fr-header__menu {
|
|||
|
|
box-shadow: inset 0 1px 0 0 #ddd;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
@media print and (min-width: 62em) and (-ms-high-contrast: none), print and (min-width: 62em) and (-ms-high-contrast: active) {
|
|||
|
|
.fr-header {
|
|||
|
|
z-index: 750;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__brand {
|
|||
|
|
z-index: auto;
|
|||
|
|
background: transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr-header__service {
|
|||
|
|
box-shadow: none;
|
|||
|
|
}
|
|||
|
|
}
|