packages/core/styles/components/pagination-nav.pcss

/**
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */

:root {
  --ifm-pagination-nav-border-radius: var(--ifm-global-radius);
  --ifm-pagination-nav-color-hover: var(--ifm-color-primary);
}

.pagination-nav {
  display: flex;

  @media print {
    display: none;
  }

  &__item {
    display: flex;
    flex: 1 50%;
    max-width: 50%;

    &--next {
      text-align: right;
    }

    & + & {
      margin-left: var(--ifm-spacing-horizontal);
    }
  }

  &__link {
    border: 1px solid var(--ifm-color-emphasis-300);
    border-radius: var(--ifm-pagination-nav-border-radius);
    flex-grow: 1;
    line-height: var(--ifm-heading-line-height);
    padding: var(--ifm-global-spacing);
    @mixin transition border-color;

    &:hover {
      border-color: var(--ifm-pagination-nav-color-hover);
      text-decoration: none;
    }
  }

  &__label {
    font-size: var(--ifm-h4-font-size);
    font-weight: var(--ifm-heading-font-weight);
    word-break: break-word;

    ^&__item:first-child &::before {
      content: '« ';
    }

    ^&__item--next &::after {
      content: ' »';
    }
  }

  &__sublabel {
    color: var(--ifm-color-content-secondary);
    font-size: var(--ifm-h5-font-size);
    font-weight: var(--ifm-font-weight-semibold);
    margin-bottom: 0.25rem;
  }
}