Tarefa

Utilize o Tailwind CSS para finalizar a estilização de um formulário com campos de entrada, áreas de texto, botões de opção e um switch.

Preencha os espaços em branco com as classes apropriadas do Tailwind CSS para obter a estilização desejada.

• Inputs e Textareas:
  • Borda cinza clara (border-gray-300);
  • Cantos medianamente arredondados (rounded-md);
  • Estado de foco com anel azul (focus:ring-2 e focus:ring-blue-500).
• Botão de Enviar:
  • Fundo azul primário (bg-blue-500);
  • Azul mais escuro ao passar o mouse (hover:bg-blue-700);
  • Cantos arredondados (rounded);
  • Estado de foco com anel (focus:outline-none, focus:ring-2 e focus:ring-blue-500).

1. Cor da Borda: Utilize border-gray-300 para uma borda cinza clara;
2. Cantoneiras Arredondadas: Utilize rounded-md para cantos medianamente arredondados;
3. Anel de Foco: Utilize focus:ring-2 para adicionar um anel ao focar e focus:ring-blue-500 para cor azul.
4. Hover no Botão de Enviar: Utilize hover:bg-blue-700 para um azul mais escuro ao passar o mouse;
5. Anel no Botão de Enviar: Utilize focus:outline-none para remover o contorno padrão de foco, focus:ring-2 para adicionar um anel ao focar e focus:ring-blue-500 para definir a cor do anel.