@codegouvfr/react-dsfr/dsfr/component/segmented/segmented.legacy.css

French State Design System React integration library

/*!
 * DSFR v1.13.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions)
 */
@media (min-width: 36em) {
  /*! media sm */
}
@media (min-width: 48em) {
  /*! media md */
}
@media (min-width: 62em) {
  /*! media lg */
}
@media (min-width: 78em) {
  /*! media xl */
}
@media screen and (min-width: 0\0) and (min-resolution: 72dpi) {
  .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;
  }
}