Boolean
$link-disable-everything: false !default;
Boolean
$link-disable-skip-to-main: false !default;
Boolean
$link-disable-flex: false !default;
Number
$link-transition-duration: transition.$linear-duration !default;
Color
$link-color: colors.$blue-500 !default;
Color
$link-visited-color: colors.$blue-600 !default;
Color
$link-hover-color: colors.$blue-400 !default;
Number
$link-skip-to-main-z-index: 10000 !default;
Map
$link-skip-to-main-styles: (
color: theme.theme-get-var(on-primary-color),
left: 50%,
padding: spacing.get-var(xs) spacing.get-var(md),
top: spacing.get-var(xs),
transform: translateX(-50%),
z-index: $skip-to-main-z-index,
) !default;
Map
$link-skip-to-main-active-styles: (
outline: 0.25rem dashed currentcolor,
) !default;
List
$link-variables: (color, visited-color, hover-color);
mixin
@mixin set-var($name, $value) { … }
mixin
@mixin use-var($property, $name: $property, $fallback: null) { … }
mixin
@mixin use-light-theme { … }
mixin
@mixin use-dark-theme { … }
mixin
@mixin variables { … }
mixin
@mixin styles($disable-layer: false) { … }
function
@function get-var($name, $fallback: null) { … }
String
Set to true
to disable all the styles
Set to true
to disable the SkipToMainContent
component styles.
Set to true
to disable the display: inline-flex
styles for the link.
The transition duration for changing the link's color while hovered or visited.
The link's default text color
The link's default visited text color
The link's default hover text color
The z-index
for the SkipToMainContent
component.
A custom map of styles to apply to the SkipToMainContent
component.
A custom map of styles to apply to the SkipToMainContent
component while it is focused. This will be applied on top of the $skip-to-main-styles
.
The available configurable css variables and mostly used internally for the
get-var
, set-var
, and use-var
utils.
The supported variable name
The value to set the variable to. Supports null
which will just be a no-op.
The css property to apply the variable to
The supported variable name
An optional fallback value if the variable has not been set
Applies the light the variables based on feature flags
Applies the dark the variables based on feature flags
Conditionally applies the css variables based on feature flags
Generates all the styles based on feature flags.
Set this to true
to disable the layer behavior
a var()
statement
The supported variable name
An optional fallback value