Skip to content

Update small toggle, create big toggle

Administrator requested to merge tj/toggles into main

Created by: tjkandala

Closes #13272

  • 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

Merge request reports