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

French State Design System React integration library

/*!
 * DSFR v1.10.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions)
 */
@charset "UTF-8";
@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 all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /**
  * Correctif de la largeur de la légende d'un fieldset
  */
  .fr-pagination [href] {
    text-decoration: none;
  }

  .fr-pagination ul {
    list-style-type: none;
  }

  .fr-pagination ol {
    list-style-type: none;
  }

  .fr-pagination ul,
  .fr-pagination ol {
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0;
  }

  .fr-pagination__link--first::before,
  .fr-pagination__link--first::after {
    background-color: transparent;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url("../../icons/system/fr--arrow-left-s-first-line.svg");
    width: 1.5rem;
    height: 1.5rem;
  }

  .fr-pagination__link--prev::before,
  .fr-pagination__link--prev::after {
    background-color: transparent;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url("../../icons/system/arrow-left-s-line.svg");
    width: 1.5rem;
    height: 1.5rem;
  }

  .fr-pagination__link--next::before,
  .fr-pagination__link--next::after {
    background-color: transparent;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url("../../icons/system/arrow-right-s-line.svg");
    width: 1.5rem;
    height: 1.5rem;
  }

  .fr-pagination__link--last::before,
  .fr-pagination__link--last::after {
    background-color: transparent;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url("../../icons/system/fr--arrow-right-s-last-line.svg");
    width: 1.5rem;
    height: 1.5rem;
  }

  .fr-pagination {
    color: #161616;
  }

  .fr-pagination__link[aria-current] {
    background-color: #000091;
    color: #f5f5fe;
  }

  .fr-pagination__link[aria-current]:hover {
    background-color: #1212ff;
  }

  .fr-pagination__link[aria-current]:active {
    background-color: #2323ff;
  }

  .fr-pagination__link:not([aria-current]):disabled,
  a.fr-pagination__link:not([aria-current]):not([href]) {
    color: #929292;
  }
}
@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-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);
  }
}
@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] {
    border: 1px solid #000091;
  }
}