react-tailwind icon indicating copy to clipboard operation
react-tailwind copied to clipboard

Transitions for Tab Pills

Open afc-profile opened this issue 5 years ago • 0 comments

This issue refers to the fact that at the moment, when you change the current opened tab with it's content the old active element will suddenly disappear and the new content will suddenly appear. We want to change this behavior and make some nice animations between the changes of the current active element, and the next one. Example of nice transitions:

  • https://getbootstrap.com/docs/4.4/components/navs/#javascript-behavior
  • https://react-swipeable-views.com/demos/demos/#tabs
  • https://codemyui.com/accordion-tab-navigation-menu-hero-section-slider/
  • We could make use of one of these from tailwindcss:
    • https://tailwindcss.com/docs/transition-property/
    • https://tailwindcss.com/docs/transition-delay/
    • https://tailwindcss.com/docs/transition-property/
    • https://tailwindcss.com/docs/translate/

afc-profile avatar May 11 '20 14:05 afc-profile