themesberg / flowbite-react

Official React components built for Flowbite and Tailwind CSS

https://flowbite-react.com

MIT License

1.77k stars 395 forks source link

Toggle switch UI not showing properly. #1360

Closed karanMalhii closed 2 weeks ago

karanMalhii commented 2 months ago

on latest version 8.0 the toggle switch button is not working; properly.

https://flowbite-react.com/docs/components/forms#toggle-switch

SutuSebastian commented 2 months ago

Do u mean "its NOT working properly" maybe? 😄

karanMalhii commented 2 months ago

Do u mean "its NOT working properly" maybe? 😄

nice catch😉

karanMalhii commented 2 months ago

now it seems working fine.

SutuSebastian commented 2 months ago

Still broken in the docs tho.

taskrider2022 commented 2 months ago

Also broken if you use them in your project

alfreddagenais commented 2 months ago

I just mentioned into this issue https://github.com/themesberg/flowbite-react/issues/1321#issuecomment-2032778546 A temporary fix for me :

export const customThemeToggleSwitch: CustomFlowbiteTheme['toggleSwitch'] = {
    toggle: {
      base: "after:rounded-full rounded-full border group-focus:ring-4 group-focus:ring-cyan-500/25",
      checked: {
          on: "after:bg-white after:translate-x-full",
          off: "after:bg-gray-400 dark:after:bg-gray-500 border-gray-200 bg-gray-200 dark:border-gray-600 dark:bg-gray-700",
      },
    },
};

This solution might help others facing similar problems.

victorfunes commented 2 months ago

Also broken for me.

MateoWartelle commented 1 month ago

1397 - you can close

SutuSebastian commented 2 weeks ago

Fixed in https://github.com/themesberg/flowbite-react/pull/1428