ccs-frontend/dist/ccs/components/header/_index.scss.map

CCS Frontend contains assets and components used in CCS projects

{"version":3,"sources":["../../../../src/ccs/components/header/_index.scss"],"names":[],"mappings":"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","file":"_index.scss","sourcesContent":["@include ccs-exports(\"ccs/component/header\") {\n  $ccs-header-background: $ccs-brand-colour;\n  $ccs-header-service-authentication-background: ccs-colour(\"black\");\n  $ccs-header-text: govuk-colour(\"white\");\n  $ccs-header-link-active-border-color: govuk-colour(\"white\");\n  $ccs-header-nav-item-border-color: ccs-colour(\"dark-red\");\n  $ccs-header-link-underline-thickness: 3px;\n\n  .ccs-header {\n    @include govuk-font($size: 16);\n\n    color: $ccs-header-text;\n    background: $ccs-header-background;\n  }\n\n  .ccs-header__container--full-width {\n    padding: 0 govuk-spacing(3);\n\n    .ccs-header__menu-button {\n      right: govuk-spacing(3);\n    }\n  }\n\n  .ccs-header__container,\n  .ccs-header__service-authentication-container {\n    @include govuk-clearfix;\n    position: relative;\n  }\n\n  .ccs-header__container {\n    padding-top: govuk-spacing(2);\n  }\n\n  .ccs-header__service-authentication-container {\n    padding-top: govuk-spacing(1);\n    padding-bottom: govuk-spacing(1);\n  }\n\n  .ccs-header__service-authentication {\n    background: $ccs-header-service-authentication-background;\n    text-align: right;\n  }\n\n  .ccs-header__service-authentication-item {\n    display: inline-block;\n    margin-right: govuk-spacing(3);\n    padding: govuk-spacing(2) 0;\n    border: 0;\n\n    @include govuk-media-query ($from: desktop) {\n      padding: govuk-spacing(1) 0;\n    }\n\n    a, button {\n      @include govuk-font($size: 16, $weight: bold);\n    }\n  }\n\n  .ccs-header__service-authentication-list .ccs-header__service-authentication-item:last-child {\n    margin-right: 0;\n    border-bottom: 0;\n  }\n\n  .ccs-header__button_as_link {\n    display: inline;\n    padding: 0;\n    border: 0;\n    color: currentcolor;\n    background: transparent;\n    font: inherit;\n    cursor: pointer;\n\n    -webkit-appearance: none;\n  }\n\n  .ccs-header__link, .ccs-header__button_as_link {\n    // Avoid using the `govuk-link-common` mixin because the links in the header\n    // get a special treatment, because:\n    //\n    // - underlines are only visible on hover\n    // - all links get a 3px underline regardless of text size, as there are\n    //   multiple grouped elements close to one another and having slightly\n    //   different underline widths looks unbalanced\n    @include govuk-typography-common;\n    @include govuk-link-style-inverse;\n\n    border-bottom: solid .125rem transparent;\n    text-decoration: none;\n\n    &:hover {\n      text-decoration: underline;\n      text-decoration-thickness: $ccs-header-link-underline-thickness;\n\n      @if $govuk-link-underline-offset {\n        text-underline-offset: $govuk-link-underline-offset;\n      }\n    }\n\n    &:focus {\n      @include govuk-focused-text;\n    }\n  }\n\n  .ccs-header__link--homepage {\n    // Font size needs to be set on the link so that the box sizing is correct\n    // in Firefox\n    @include govuk-font($size: false, $weight: bold);\n\n    display: inline-block;\n    margin-right: govuk-spacing(2);\n    font-size: 30px; // We don't have a mixin that produces 30px font size\n    line-height: 1;\n\n    &:link,\n    &:visited {\n      text-decoration: none;\n    }\n\n    &:hover:not(:focus),\n    &:active:not(:focus) {\n      // Negate the added border\n      margin-bottom: -1px;\n      // Omitting colour will use default value of currentColor – if we\n      // specified currentColor explicitly IE8 would ignore this rule.\n      border-bottom: $ccs-header-link-underline-thickness solid;\n    }\n\n    // Remove any borders that show when focused and hovered.\n    &:focus {\n      margin-bottom: 0;\n    }\n  }\n\n  .ccs-header__link--service-name {\n    display: inline-block;\n    margin-bottom: govuk-spacing(2);\n    @include govuk-font($size: 24, $weight: bold);\n  }\n\n  .ccs-header__logo,\n  .ccs-header__content {\n    box-sizing: border-box;\n  }\n\n  .ccs-header__logo {\n    @include govuk-responsive-padding(2, \"bottom\");\n    padding-right: govuk-spacing(8);\n\n    @include govuk-media-query ($from: desktop) {\n      width: 25%;\n      padding-right: $govuk-gutter-half;\n      float: left;\n      vertical-align: top;\n    }\n  }\n\n  .ccs-header__content {\n    text-align: left;\n\n    @include govuk-media-query ($from: desktop) {\n      width: 75%;\n      padding-left: $govuk-gutter-half;\n      float: left;\n    }\n  }\n\n  .ccs-header__menu-button {\n    @include govuk-font($size: 16);\n    display: none;\n    position: absolute;\n    top: govuk-spacing(4);\n    right: 0;\n    margin: 0;\n    padding: 0;\n    border: 0;\n    color: govuk-colour(\"white\");\n    background: none;\n    cursor: pointer;\n\n    &:hover {\n      text-decoration: solid underline $ccs-header-link-underline-thickness;\n\n      @if $govuk-link-underline-offset {\n        text-underline-offset: $govuk-link-underline-offset;\n      }\n    }\n\n    &:focus {\n      @include govuk-focused-text;\n    }\n\n    &::after {\n      @include govuk-shape-arrow($direction: down, $base: 10px, $display: inline-block);\n      content: \"\";\n      margin-left: govuk-spacing(1);\n    }\n\n    @include govuk-media-query ($from: tablet) {\n      top: govuk-spacing(3);\n    }\n  }\n\n  .ccs-header__menu-button--open {\n    &::after {\n      @include govuk-shape-arrow($direction: up, $base: 10px, $display: inline-block);\n    }\n  }\n\n  .ccs-header__navigation {\n    @include govuk-media-query ($from: desktop) {\n      margin-bottom: govuk-spacing(2);\n    }\n  }\n\n  .ccs-header__service-authentication-list,\n  .ccs-header__navigation-primary-list,\n  .ccs-header__navigation-secondary-list {\n    // Reset user-agent default list styles\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .ccs-header__navigation--no-second-list {\n    @include govuk-media-query ($from: desktop) {\n      padding-top: govuk-spacing(6);\n    }\n  }\n\n  .js-enabled {\n    .ccs-header__menu-button {\n      display: block;\n      @include govuk-media-query ($from: desktop) {\n        display: none;\n      }\n    }\n\n    .ccs-header__navigation-lists {\n      display: none;\n      @include govuk-media-query ($from: desktop) {\n        display: block;\n      }\n    }\n\n    .ccs-header__navigation-lists--open {\n      display: block;\n    }\n  }\n\n  .ccs-header__navigation--end {\n    @include govuk-media-query ($from: desktop) {\n      margin: 0;\n      padding: govuk-spacing(1) 0;\n      text-align: right;\n    }\n  }\n\n  .ccs-header__navigation--no-service-name {\n    @include govuk-media-query ($from: desktop) {\n      padding-top: govuk-spacing(7);\n    }\n  }\n\n  .ccs-header__navigation-secondary-list {\n    .ccs-header__navigation-item {\n      a, button {\n        @include govuk-font($size: 16, $weight: regular);\n      }\n    }\n  }\n\n  .ccs-header__navigation-item {\n    padding: govuk-spacing(2) 0;\n    border-bottom: 1px solid $ccs-header-nav-item-border-color;\n\n    @include govuk-media-query ($from: desktop) {\n      display: inline-block;\n      margin-right: govuk-spacing(3);\n      padding: govuk-spacing(1) 0;\n      border: 0;\n    }\n\n    a, button {\n      @include govuk-font($size: 16, $weight: bold);\n      white-space: nowrap;\n    }\n  }\n\n  .ccs-header__navigation-item--active {\n    button {\n      // color: $ccs-header-link-active;\n      border-color: $ccs-header-link-active-border-color;\n      color: inherit;\n      background-color: transparent;\n    }\n\n    a {\n      &:link,\n      &:hover,\n      &:visited {\n        // color: $ccs-header-link-active;\n        border-color: $ccs-header-link-active-border-color;\n        color: inherit;\n        background-color: transparent;\n      }\n    }\n\n    a, button {\n      // When focussed, the text colour needs to be darker to ensure that colour\n      // contrast is still acceptable\n      &:focus {\n        @include govuk-focused-text;\n\n        border-color: $govuk-focus-colour;\n      }\n    }\n  }\n\n  .ccs-header__navigation-primary-list .ccs-header__navigation-item:last-child {\n    margin-right: 0;\n    border-bottom: 0;\n  }\n\n  .ccs-header__navigation-secondary-list .ccs-header__navigation-item:last-child {\n    margin-right: govuk-spacing(3);\n    border-bottom: 1px solid $ccs-header-nav-item-border-color;\n\n    @include govuk-media-query ($from: desktop) {\n      margin-right: 0;\n      border-bottom: 0;\n    }\n  }\n\n  @include govuk-media-query($media-type: print) {\n    .ccs-header {\n      border-bottom-width: 0;\n      color: govuk-colour(\"black\");\n      background: transparent;\n    }\n\n    .ccs-header__link {\n      &:link,\n      &:visited {\n        color: govuk-colour(\"black\");\n      }\n\n      // Do not append link href to GOV.UK link when printing (e.g. '(/)')\n      &::after {\n        display: none;\n      }\n    }\n  }\n}\n"]}