A
Anonymous

Module Header - Copy this React, Tailwind Component to your project

Build a reusable component that shows the name of the module (Roosters, Trainers, etc.) centered and with good styles, below it should show an elegant and animated search bar, in the same row but on the right side there should be 2 buttons with icons, one to add (roosters, trainers) and another filter... when you click on filters, options for common filters should appear with text, icons, checkbox, etc. and a button to create the filter as such. Everything must be animated with Framer Motion. In addition, everything must be 100% responsive (on mobile and tablets all in columns (both buttons and the search bar occupying 100% of the width)). Everything must be compatible with the tailwind dark: classes and use orange 500 as the main color

Prompt
Component Preview

About

ModuleHeader - A responsive module header with a centered title, animated search bar, and filter buttons, built with React and Tailwin. Get instant access!

Share

Last updated 1 month ago