Uppgift

Använd Tailwind CSS för att färdigställa utseendet på ett formulär med inmatningsfält, textområden, radioknappar och en switch.

Fyll i de tomma fälten med lämpliga Tailwind CSS-klasser för att uppnå önskad stil.

• Inmatningsfält och textområden:
  • Ljusgrå ram (border-gray-300);
  • Medelrunda hörn (rounded-md);
  • Fokusläge med blå ring (focus:ring-2 och focus:ring-blue-500).
• Skicka-knapp:
  • Primär blå bakgrund (bg-blue-500);
  • Mörkare blå vid hovring (hover:bg-blue-700);
  • Rundade hörn (rounded);
  • Fokusläge med ring (focus:outline-none, focus:ring-2 och focus:ring-blue-500).

1. Kantfärg: Använd border-gray-300 för en ljusgrå kant;
2. Rundade hörn: Använd rounded-md för medelrunda hörn;
3. Fokusring: Använd focus:ring-2 för att lägga till en ring vid fokus och focus:ring-blue-500 för blå färg.
4. Skicka-knapp vid hovring: Använd hover:bg-blue-700 för en mörkare blå färg vid hovring;
5. Skicka-knappens ring: Använd focus:outline-none för att ta bort standardfokus, focus:ring-2 för att lägga till en ring vid fokus och focus:ring-blue-500 för att ange ringens färg.