{"version":3,"sources":["../../../../src/nhsuk/core/tools/_links.scss"],"names":[],"mappings":"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","file":"_links.scss","sourcesContent":["@use \"sass:color\";\n@use \"../settings\" as *;\n@use \"../helpers\" as *;\n@use \"focused\" as *;\n\n////\n/// Links\n///\n/// @group tools\n////\n\n/// Link styling with colour overrides\n///\n/// @param {Colour} $link-colour [$nhsuk-link-colour] - Link colour\n/// @param {Colour} $link-hover-colour [$nhsuk-link-hover-colour] - Link hover colour\n/// @param {Colour} $link-visited-colour [$nhsuk-link-visited-colour] - Link visited colour\n/// @param {Colour} $link-active-colour [$nhsuk-link-active-colour] - Link active colour\n///\n\n@mixin nhsuk-link-style(\n  $link-colour: $nhsuk-link-colour,\n  $link-visited-colour: $nhsuk-link-visited-colour,\n  $link-hover-colour: $nhsuk-link-hover-colour,\n  $link-active-colour: $nhsuk-link-active-colour\n) {\n  & {\n    color: $link-colour;\n    text-decoration: underline;\n\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      color: LinkText;\n    }\n  }\n\n  @include nhsuk-link-style-visited($link-visited-colour);\n  @include nhsuk-link-style-hover($link-hover-colour);\n  @include nhsuk-link-style-active($link-active-colour);\n  @include nhsuk-link-style-focus;\n}\n\n/// Default link styles\n///\n/// Makes links use the default unvisited, visited, hover and active colours.\n///\n/// @example scss\n///   .nhsuk-component__link {\n///     @include nhsuk-link-style-default;\n///   }\n///\n\n@mixin nhsuk-link-style-default {\n  @include nhsuk-link-style;\n}\n\n/// Reverse link styles\n///\n/// Makes links white, in all states. Use this mixin if you're displaying links\n/// against a dark background.\n///\n/// If you use this mixin in a component, you must also include the\n/// `nhsuk-link-style-default` mixin to get the correct focus and hover states.\n///\n/// @example scss\n///   .nhsuk-component__link {\n///     @include nhsuk-link-style-default;\n///     @include nhsuk-link-style-reverse;\n///   }\n///\n\n@mixin nhsuk-link-style-reverse {\n  @include nhsuk-link-style-text($override-colour: $nhsuk-reverse-text-colour);\n\n  @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n    color: LinkText;\n  }\n}\n\n/// White link styles (deprecated)\n///\n/// @alias nhsuk-link-style-reverse\n/// @deprecated To be removed in v11.0, replaced by nhsuk-link-style-reverse\n\n@mixin nhsuk-link-style-white {\n  @include nhsuk-warning(\n    \"nhsuk-link-style-white\",\n    \"nhsuk-link-style-white is deprecated. Use nhsuk-link-style-reverse instead.\"\n  );\n  @include nhsuk-link-style-reverse;\n}\n\n/// Default link visited only styling\n///\n/// @param {Colour} $link-visited-colour [$nhsuk-link-visited-colour] - Link visited colour\n///\n/// @example scss\n///   @include nhsuk-link-style-visited;\n///\n\n@mixin nhsuk-link-style-visited($link-visited-colour: $nhsuk-link-visited-colour) {\n  &:visited {\n    color: $link-visited-colour;\n\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      color: VisitedText;\n    }\n  }\n}\n\n/// Default link hover only styling\n///\n/// @param {Colour} $link-hover-colour [$nhsuk-link-hover-colour] - Link hover colour\n///\n/// @example scss\n///   @include nhsuk-link-style-hover;\n///\n\n@mixin nhsuk-link-style-hover($link-hover-colour: $nhsuk-link-hover-colour) {\n  &:hover {\n    color: $link-hover-colour;\n    text-decoration: none;\n\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      color: LinkText;\n    }\n  }\n}\n\n/// Default link focus only styling\n///\n/// @example scss\n///   @include nhsuk-link-style-focus;\n///\n\n@mixin nhsuk-link-style-focus {\n  &:focus {\n    @include nhsuk-focused-text;\n  }\n\n  &:focus:hover {\n    text-decoration: none;\n  }\n}\n\n/// Default link active only styling\n///\n/// @param {Colour} $link-active-colour [$nhsuk-link-active-colour] - Link active colour\n///\n/// @example scss\n///   @include nhsuk-link-style-active;\n///\n\n@mixin nhsuk-link-style-active($link-active-colour: $nhsuk-link-active-colour) {\n  &:active {\n    color: $link-active-colour;\n\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      color: ActiveText;\n    }\n  }\n}\n\n/// Error link styles\n///\n/// Makes links use the error colour. The link will darken if it's active or a\n/// user hovers their cursor over it.\n///\n/// If you use this mixin in a component, you must also include the\n/// `nhsuk-link-style-default` mixin to get the correct focus and hover states.\n///\n/// @example scss\n///   .nhsuk-component__link {\n///     @include nhsuk-link-style-default;\n///     @include nhsuk-link-style-error;\n///   }\n///\n\n@mixin nhsuk-link-style-error {\n  @include nhsuk-link-style(\n    $link-colour: $nhsuk-error-colour,\n    $link-visited-colour: $nhsuk-error-colour,\n    $link-hover-colour: nhsuk-colour-compatible(color.scale($nhsuk-error-colour, $lightness: -30%)),\n    $link-active-colour: $nhsuk-error-colour\n  );\n}\n\n/// Success link styles\n///\n/// Makes links use the success colour. The link will darken if it's active or a\n/// user hovers their cursor over it.\n///\n/// If you use this mixin in a component you must also include the\n/// `nhsuk-link-style-default` mixin to get the correct focus and hover states.\n///\n/// @example scss\n///   .nhsuk-component__link {\n///     @include nhsuk-link-style-default;\n///     @include nhsuk-link-style-success;\n///   }\n///\n\n@mixin nhsuk-link-style-success {\n  @include nhsuk-link-style(\n    $link-colour: $nhsuk-success-colour,\n    $link-visited-colour: $nhsuk-success-colour,\n    $link-hover-colour: nhsuk-shade($nhsuk-success-colour, 20%),\n    $link-active-colour: nhsuk-shade($nhsuk-success-colour, 50%)\n  );\n}\n\n/// No visited state link mixin\n///\n/// Used in cases where it is not helpful to distinguish between visited and\n/// non-visited links.\n///\n/// For example, navigation links to pages with dynamic content like admin\n/// dashboards. The content on the page is changing all the time, so the fact\n/// that you’ve visited it before is not important.\n///\n/// If you use this mixin in a component, you must also include the\n/// `nhsuk-link-style-default` mixin to get the correct focus and hover states.\n///\n/// @example scss\n///   .nhsuk-component__link {\n///     @include nhsuk-link-style-default;\n///     @include nhsuk-link-style-no-visited-state;\n///   }\n///\n\n@mixin nhsuk-link-style-no-visited-state {\n  @include nhsuk-link-style(\n    $link-colour: $nhsuk-link-colour,\n    $link-visited-colour: $nhsuk-link-colour,\n    $link-hover-colour: $nhsuk-link-hover-colour,\n    $link-active-colour: $nhsuk-link-active-colour\n  );\n}\n\n/// Remove underline from links\n///\n/// Remove underlines from links unless the link is active or a user hovers\n/// their cursor over it.\n///\n/// @example scss\n///   .nhsuk-component__link {\n///     @include nhsuk-link-style-default;\n///     @include nhsuk-link-style-no-underline;\n///   }\n///\n\n@mixin nhsuk-link-style-no-underline {\n  // Allow ':hover' and ':active' companion classes from postcss-pseudo-classes\n  // which the plugin unfortunately doesn't handle automatically.\n  // stylelint-disable-next-line selector-class-pattern\n  &:not(:hover):not(.\\:hover):not(:active):not(.\\:active) {\n    text-decoration: none;\n  }\n\n  &:hover {\n    text-decoration: underline;\n  }\n}\n\n/// Text link styles\n///\n/// Makes links use the primary text colour, in all states. Use this mixin for\n/// navigation components, such as breadcrumbs or the back link.\n///\n/// @param {Colour} $override-colour [$nhsuk-text-colour] - Link colour for all states\n///\n/// @example scss\n///   .nhsuk-component__link {\n///     @include nhsuk-link-style-text;\n///   }\n///\n\n@mixin nhsuk-link-style-text($override-colour: $nhsuk-text-colour) {\n  @include nhsuk-link-style(\n    $link-colour: $override-colour,\n    $link-visited-colour: $override-colour,\n    $link-hover-colour: $override-colour,\n    $link-active-colour: $override-colour\n  );\n\n  // Force a colour change on hover to work around a bug in Safari\n  // Also allows for ':focus' companion classes from postcss-pseudo-classes\n  // which the plugin unfortunately doesn't handle automatically.\n  // https://bugs.webkit.org/show_bug.cgi?id=224483\n  // stylelint-disable-next-line selector-class-pattern\n  &:not(:focus):not(.\\:focus):hover {\n    color: rgba($override-colour, 0.99);\n\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      color: LinkText;\n    }\n  }\n}\n\n/// Image link styles\n///\n/// Prepares and provides the focus state for links that only contain images\n/// with no accompanying text.\n\n@mixin nhsuk-link-image {\n  // Needed to draw the focus around the entire image\n  display: inline-block;\n\n  // Remove extra space at the bottom of the image that's added by line-height\n  line-height: 0;\n\n  // Don't render an underline\n  text-decoration: none;\n\n  &:focus {\n    @include nhsuk-focused-box;\n  }\n}\n"]}