1707 lines
50 KiB
CSS
1707 lines
50 KiB
CSS
/*!
|
|
* DSFR v1.11.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions)
|
|
*/
|
|
@charset "UTF-8";
|
|
|
|
/* ¯¯¯¯¯¯¯¯¯ *\
|
|
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;
|
|
}
|
|
@media (min-width: 36em) {
|
|
/*! 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 (min-width: 48em) {
|
|
/*! 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 (min-width: 62em) {
|
|
/*! 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 (min-width: 78em) {
|
|
/*! media xl */
|
|
|
|
/*! media xl */
|
|
}
|
|
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
|
|
.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);
|
|
}
|
|
}
|
|
@media print {
|
|
.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;
|
|
}
|
|
}
|
|
@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);
|
|
}
|
|
}
|