Variants 5 / 17
Tailwind provides variants to add classes for things like hover and focus states as well as breakpoints.
Try removing all the CSS and, instead, add these classes: hover:bg-teal-500, focus:bg-teal-600, md:uppercase. Look how much code we eliminated!
Say good bye to media queries. Simply prefix classes with sm:, md:, lg: or xl:.
Note: Expand the example view by clicking on the desktop icon in the top right corner.