Fields Password
Installation
yarn add @chewy/kib-fields-styles
Import
@use '~@chewy/kib-fields-styles/src/kib-input-password/styles' as kib-input-password;
Mixins
toggle-button
@mixin toggle-button() { ... }
@mixin toggle-button() { @include kib-button-new.generate-styles('utility', 'secondary', 'medium', true); $button-padding: map.get(kib-button-new.$icon-only-padding-sizes, medium) * 2; $button-height: kib-button-new.$icon-size-medium + $button-padding; position: absolute; top: calc((field-settings.$icon-size - $button-height) / 2); left: calc((field-settings.$icon-size - $button-height) / 2); cursor: pointer; pointer-events: auto; &:disabled { opacity: 0.5; pointer-events: none; } }
Description
Password text visibility toggle button
Parameters
None.
Requires
- [function]
get
- [variable]
icon-only-padding-sizes
- [variable]
button-height
- [variable]
icon-size-medium
- [variable]
icon-size