Contents

// stylelint-disable max-nesting-depth

$highlight-answer-bg-color: govuk-colour("green");
$highlight-answer-color: govuk-colour("white");

.govspeak, // Legacy class name that's still used in some content items - needs to be kept until `.govspeak` is removed from the content items.
.gem-c-govspeak {
  .highlight-answer {
    background-color: $highlight-answer-bg-color;
    color: $highlight-answer-color;
    text-align: center;
    padding: 1.75em .75em 1.25em;
    margin: 0 -1em 1em;

    p {
      color: $highlight-answer-color;
      @include govuk-font($size: 24, $weight: bold);

      em {
        display: block;
        padding-top: .1em;
        color: $highlight-answer-color;
        @include govuk-font($size: 80, $weight: bold);
      }
    }

    p:last-child {
      margin-bottom: 0;
    }

    @include govuk-media-query($until: tablet) {
      margin: 0 0 1em;
      @include govuk-font($size: 48);

      p {
        font-size: 1em;
        line-height: inherit;

        em {
          font-size: 1em;
          padding-top: 0;
          display: inline;
        }
      }
    }

    @include govuk-media-query($media-type: print) {
      background: none;

      &,
      & * {
        color: $govuk-print-text-colour !important; // stylelint-disable-line declaration-no-important
      }
    }
  }
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
govuk_publishing_components-43.1.0	app/assets/stylesheets/govuk_publishing_components/components/govspeak/_highlight-answer.scss
govuk_publishing_components-43.0.2	app/assets/stylesheets/govuk_publishing_components/components/govspeak/_highlight-answer.scss