Sha256: 8b8e4551851b3ec19ced7911c5ae158c1acac40f062099d1239614097a1375ae

Contents?: true

Size: 1.33 KB

Versions: 25

Compression:

Stored size: 1.33 KB

Contents

.gem-c-big-number {
  margin-bottom: govuk-spacing(3);
  @include govuk-text-colour;
}

.gem-c-big-number__value {
  @include govuk-font($size: false, $weight: bold);
  line-height: 1;
  font-size: 80px;
  font-size: govuk-px-to-rem(80px);
}

.gem-c-big-number__label {
  @include govuk-font($size: 19, $weight: bold);

  // This pseudo element is to bypass an issue with NVDA where block level elements are dictated separately.
  // What's happening here is that the label and the number technically have an inline relationship but appear to have a block relationship thanks to this element
  &:before {
    content: "";
    display: block;
  }
}

.gem-c-big-number__link {
  display: inline-block;
  text-decoration: none;

  // Add govuk-link hover decoration to main value if no label present but a href attribute is
  .gem-c-big-number__value--decorated {
    @include govuk-link-decoration;
    @include govuk-link-style-no-underline;
  }

  .gem-c-big-number__label {
    @include govuk-link-decoration;
  }

  &:hover,
  &:active {
    .gem-c-big-number__label,
    .gem-c-big-number__value--decorated {
      @include govuk-link-hover-decoration;
    }
  }

  &:focus,
  &:focus:hover {
    .gem-c-big-number__label,
    .gem-c-big-number__value--decorated {
      text-decoration: none;
    }
  }
}

.gem-c-big-number__suffix {
  vertical-align: middle;
}

Version data entries

25 entries across 25 versions & 1 rubygems

Version Path
govuk_publishing_components-34.1.1 app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss
govuk_publishing_components-34.1.0 app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss
govuk_publishing_components-34.0.0 app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss
govuk_publishing_components-33.1.0 app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss
govuk_publishing_components-33.0.0 app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss