Update small toggle, create big toggle
Created by: tjkandala
Closes #13272 (closed)
-
Update small toggle styles -
Create big toggle -
Update storybook -
Event handler for mouseover -
Add tests for big toggle -
Refactor big and small toggle to function components -
Refactor CSS for big and small toggle -
Improve story + test -
Add hover and focus styles for big toggle -
Add hover and focus styles for small toggle
On:
-
- Active - knob: primary 100%, bar: primary 20% -
- Hover - knob: primary 100%, bar: primary 50% -
- Focus - knob: primary 100%, bar: primary 50%, stroke: primary 20% -
- Disabled - knob: primary 20%, bar: primary 20%
Off:
-
- Active - knob: text-muted 100%, bar: text-muted 20% -
- Hover - knob: text-muted 100%, bar: text-muted 50% -
- Focus - knob: text-muted 100%, bar: text-muted 50%, stroke: text-muted 20% -
-Disabled - knob: text-muted 20%, bar: text-muted 20% -
- implement contrast improvements and disabled states for big toggle