Boolean
$label-disable-everything: base.$form-disable-everything !default;
Boolean
$label-disable-floating: $disable-everything !default;
Boolean
$label-disable-text-field-container: false !default;
Boolean
$label-disable-text-field: $disable-text-field-container !default;
Boolean
$label-disable-select: $disable-text-field-container !default;
Boolean
$label-disable-native-select: $disable-text-field-container !default;
Boolean
$label-disable-gap: $disable-everything !default;
Boolean
$label-disable-reversed: $disable-everything !default;
Boolean
$label-disable-stacked: $disable-everything !default;
Boolean
$label-disable-stacked-reversed: $disable-everything !default;
Number
$label-gap: spacing.get-var(sm) !default;
Number
$label-font-size: 1em !default;
Map
$label-typography: map.merge(
typography.$body-1-styles,
(
font-size: $font-size,
)
) !default;
Number
$label-floating-y: 1rem !default;
Number
$label-floating-y-dense: 0.9rem !default;
Number
$label-floating-scale: 0.75 !default;
Number
$label-floating-padding: spacing.get-var(xs) !default;
List
$label-variables: (
floating-x,
floating-y,
floating-active-x,
floating-active-y,
active-padding,
active-background-color
);
mixin
@mixin set-var($name, $value) { … }
mixin
@mixin use-var($property, $name: $property, $fallback: null) { … }
mixin
@mixin active-styles { … }
mixin
@mixin floating-active-styles { … }
mixin
@mixin variables { … }
mixin
@mixin styles($disable-layer: false) { … }
function
@function get-var($name, $fallback: null) { … }
String
Set to true
to disable all the Label
styles
Set to true
to disable only the floating Label
styles
Set to true
to disable the styles that set the label active styles while an element in the TextFieldContainer
has focus.
Set to true
to disable if not using the TextField
, Password
, and
TextArea
components to remove the styles that float the label while the input or textarea has a value.
Set to true
to disable if not using the Select
component to remove the styles that float the label while the Select
has a value.
Set to true
to disable the styles to float the label while the
NativeSelect
has a value.
Set to true
to disable the gap
property on a Label
.
Set to true
to disable the reversed
styles on a Label
.
Set to true
to disable the stacked
styles for a Label
.
Set to true
to disable the stacked
and reversed
styles for a Label
.
The spacing between elements in a Label
.
The default Label
font size.
The default Label
typography.
The distance from the top of the floating label container to position the Label
while not active.
The distance from the top of the floating label container to position the Label
while not active and the dense
prop was enabled.
The transform: scale()
value to apply to the floating label while not active.
The amount of padding to apply to a floating label. This is used to "cover" the outline and add some general spacing.
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
This is probably an internal only mixin to generate update the label styles while linked component is considered active (normally focused).
This is probably an internal only mixin to generate update the label styles while linked component is considered active (normally focused).
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