Tailwind CSS est un utilitaire, mais aussi un framework CSS rempli de classes comme "flex", "pt-4", "text-center" et "rotate-90", qui peut être composé pour construire n'importe quel design, directement dans votre balisage. Il a été développé pour vous permettre de construire rapidement des sites Web modernes sans jamais quitter votre HTML. La version 2.0 de Tailwind CSS est désormais disponible et apporte de nouvelles fonctionnalités et quelques changements, et représente la première mise à jour majeure du framework jamais réalisée.L'équipe de développement de Tailwind CSS a rappelé qu'il y a presque exactement 18 mois qu'elle a lancé la version 1.0 du framework, qui a marqué un engagement en faveur de la stabilité tout en continuant à repousser les limites grâce à de nouvelles fonctionnalités intéressantes dans chaque version mineure. Ces 18 mois ont été marqués par la publication de neuf versions mineures qui ont ajouté des fonctionnalités telles que le style des caractères de remplissage, la visibilité du lecteur d'écran, la grille CSS, les transitions, les transformations, les animations, les utilitaires de mise en page, le tremblement d'arbre intégré, les dégradés, etc.
Tailwind CSS fournit une API pour votre système de conception. Selon l'équipe, les classes utilitaires vous aident à travailler dans le cadre des contraintes d'un système au lieu d'encombrer vos feuilles de style de valeurs arbitraires. Elles permettent d'être facilement cohérent avec les choix de couleurs, l'espacement, la typographie, les ombres et tout ce qui constitue un système de conception bien conçu. En outre, elle a ajouté que, même si Tailwind CSS v2.0 est une nouvelle version majeure, elle a travaillé très dur pour minimiser les modifications importantes, en particulier celles qui vous obligeraient à modifier des tonnes de vos modèles.
« Nous avons renommé deux classes, supprimé trois classes qui ne sont plus pertinentes dans les navigateurs modernes et en avons remplacé deux par des alternatives plus puissantes. Toute autre modification qui pourrait vous affecter peut être corrigée en ajoutant quelques petites modifications à votre fichier tailwind.config.js. La mise à jour ne devrait pas prendre plus de 30 minutes environ », a certifié l'équipe de développement du framework. Voici ci-dessous un aperçu de ce dont il s'agit dans Tailwind CSS v2.0 :
- une toute nouvelle palette de couleurs, comprenant 220 couleurs au total ainsi qu'un nouveau flux de travail pour créer vos propres modèles de couleurs ;
- la prise en charge du mode sombre, ce qui, selon l'équipe, facilite plus que jamais la modification dynamique de votre dessin lorsque le mode sombre est activé ;
- "extra wide 2XL breakpoint" pour la conception à partir de 1536px ;
- de nouveaux services d'anneaux de contour, qui, selon l'équipe, sont presque aussi bons que s'ils ne faisaient que rendre réel le rayon de contour ;
- des styles de formulaires conviviaux : une nouvelle réinitialisation de formulaire qui permet de personnaliser facilement les éléments de formulaire (même les cases à cocher) avec seulement des classes utilitaires ;
- des échelles d'espacement, de typographie et d'opacité étendues pour affiner les choses au niveau micro, pour avoir un impact encore plus grand avec de grands titres, et pour quand opacity-25 ne suffisait pas et opacity-50 était trop ;
- utilisez désormais "@apply" avec n'importe quoi, y compris "hover", "focus", et d'autres variantes ;
- de nouveaux utilitaires de débordement de texte sont disponibles pour vous aider à contrôler les choses plus précisément que ce que vous pouvez faire avec "truncate" seul ;
- une extension des variantes, de sorte que vous puissiez activer des variantes supplémentaires comme "focus-visible" sans devoir déclarer à nouveau la liste entière ou penser à l'ordre ;
- activation par défaut de "group-hover" et de "focus-within", car vous les activiez de toute façon sur chaque projet ;
- etc.
Incompatibilité avec IE11
À partir de cette version, Tailwind CSS n'est plus compatible avec Internet Explorer 11. L'équipe a déclaré qu'elle a fait ce choix afin de permettre aux utilisateurs de profiter pleinement des fonctionnalités CSS modernes. « Nous avons décidé de nous décharger de tout souci concernant IE11, ce qui nous a permis d'adopter pleinement les propriétés CSS personnalisées pour toutes sortes de trucs fous et c'est ce qui rend possible des choses comme les nouveaux utilitaires de ring », a déclaré l'équipe de développement de Tailwind CSS.
« La suppression du support d'IE11 signifie des constructions plus petites même en utilisant PurgeCSS, parce que nous n'avons pas besoin d'envoyer de variables CSS de repli, ce qui représente plus que ce à quoi on pourrait s'attendre », a-t-elle ajouté. Selon l'équipe, cette décision a été grandement influencée par la décision de Bootstrap d'abandonner en premier le support d'IE11. « Bravo à Bootstrap pour avoir eu les cojones de faire cela en premier, je ne pense pas que nous aurions été aussi audacieux s'ils n'avaient pas décidé de nous ouvrir la voie », a-t-elle expliqué.
Toutefois, la bonne nouvelle est que si vous avez besoin de prendre en charge IE11, vous pouvez toujours utiliser Tailwind CSS v1.9 qui, d'après l'équipe, est toujours un framework incroyablement productif.
Source : Tailwind CSS v2.0
Et vous ?
Que pensez-vous de Tailwind CSS ?Voir aussi
Microsoft Edge trois fois plus rapide que IE 11 grâce à Asm.js, le navigateur offrira plus de sécurité La version 5.0 de Bootstrap supprimera le support d'Internet Explorer 11. Cela fait suite à l'annonce de supprimer jQuery pour du pur JavaScript Tailwind UI, des composants d'interface utilisateur conçus par les créateurs de Tailwind CSS, qui permettent de créer des styles personnalisés sans jamais quitter le HTML, selon ses concepteurs La version 5.0 du framework Bootstrap va supprimer jQuery, sa plus grande dépendance côté client pour du pur JavaScript