Défi : Style de Base

Tâche

En utilisant les utilitaires Tailwind CSS pour les couleurs, les bordures et les ombres, créez un composant de carte stylisé avec les spécifications suivantes :

1. Le conteneur extérieur doit avoir :
   • Une couleur de fond blanche ;
   • Une ombre moyenne.
2. La carte doit contenir :
   • Un titre (h2) avec une taille de texte de 2xl et une couleur de texte gris-900 ;
   • Un paragraphe (p) avec une couleur de texte gris-700.
3. À l'intérieur de la carte, créez une boîte bordée avec :
   • Une couleur de fond bleu clair (par exemple, blue-50) ;
   • Une couleur de bordure bleue ;
   • Des coins moyennement arrondis ;
   • Une couleur de texte bleu-700.
4. Ajoutez une autre boîte avec :
   • Une couleur de fond vert clair (par exemple, green-100) ;
   • Une couleur de bordure verte ;
   • Des coins arrondis ;
   • Une petite ombre ;
   • Une couleur de texte vert-700.

1. Couleurs de fond : Utilisez bg-white, bg-blue-50, bg-green-100 pour les couleurs de fond ;
2. Couleurs du texte : Utilisez text-gray-900, text-gray-700, text-blue-700, text-green-700 pour les couleurs du texte ;
3. Couleurs des bordures : Utilisez border-blue-500, border-green-500 pour les couleurs des bordures ;
4. Rayon des bordures : Utilisez rounded-md, rounded pour les coins arrondis ;
5. Ombres : Utilisez shadow-md, shadow-sm pour les ombres ;
6. Taille du texte : Utilisez text-2xl pour la taille des titres.