Toggle
Mixins
toggle
@mixin toggle() { ... }
@mixin toggle() { @include kib-button-new.generate-styles('action', 'tertiary', 'small', true); }
Description
Base styles
Parameters
None.
selected
@mixin selected() { ... }
@mixin selected() { @include kib-button-new.button-styles('action', 'primary'); }
Description
Toggle's selected state styles
Parameters
None.
size-medium
@mixin size-medium() { ... }
@mixin size-medium() { @include kib-button-new.size-medium; @include kib-button-new.button-padding('medium'); }
Description
Medium size
Parameters
None.
size-large
@mixin size-large() { ... }
@mixin size-large() { @include kib-button-new.size-large; @include kib-button-new.button-padding('large'); }
Description
Large size
Parameters
None.
utility
@mixin utility() { ... }
@mixin utility() { @include kib-button-new.button-styles('utility', 'tertiary'); }
Description
Utility variant
Parameters
None.
utility-selected
@mixin utility-selected() { ... }
@mixin utility-selected() { @include kib-button-new.button-styles('utility', 'primary'); }
Description
Selected utility variant
Parameters
None.
critical
@mixin critical() { ... }
@mixin critical() { @include kib-button-new.button-styles('destructive', 'tertiary'); }
Description
Critical variant
Parameters
None.
critical-selected
@mixin critical-selected() { ... }
@mixin critical-selected() { @include kib-button-new.button-styles('destructive', 'primary'); }
Description
Selected critical variant
Parameters
None.
icon
@mixin icon() { ... }
@mixin icon() { @include kib-button-new.icon; @include kib-button-new.icon-only; @include kib-button-new.icon-size-small; }
Description
Toggle icon styles
Parameters
None.
icon-medium
@mixin icon-medium() { ... }
@mixin icon-medium() { @include kib-button-new.icon-size-medium; }
Description
Medium icon size
Parameters
None.
icon-large
@mixin icon-large() { ... }
@mixin icon-large() { @include kib-button-new.icon-size-large; }
Description
Large icon size
Parameters
None.