Rosemary, gestion de filtres pour le développement CSS

En anglais, Rosemary is an open-source modular cascading filter-based modification system for CSS files : OSMCFBMS4CSS. Rosemary n'est pas un framework CSS, son fonctionnement permet de déclarer des propriétés CSS en fonction de filtres ; par exemple un filtre sur le type de navigateur.

A filter is an independent package of code that modifies your CSS or gives you new abilities when writing CSS. An example of this is the Browser Filter. The Browser Filter gives you new capabilities in CSS writing to define certain blocks or properties as browser specific. The filter will remove any blocks or properties labeled "IE" if the visiting user is running Firefox. There are also other filters, like the Compressor Filter, that don't give you any new capabilities but simply perform an action. In this case, the Compressor Filter removes all whitespace and line breaks in real time so you can edit clean code and send a small compressed file to the user.

Les filtres disponibles sont : Browser, Compressor, Inheritance, Reset, StripComments, Variables. Ils vont permettre d'avoir une gestion poussée de ses feuilles de styles.

La gestion du filtre Browser évitera d'appeler une feuille spécifique pour certains navigateurs, ainsi il n'y aura qu'une seule feuille contenant tous les hacks. Pour des feuilles de styles pour mobile, l'avantage peut être très intéressant. On pourra, de même, cumuler le filtre browser et les variables afin de déclarer des valeurs en fonction de l'interface de destination.

Au final, on se demande si l'usage de Rosemary n'est pas une source de complexité plus que de simplicité. Comme pour les FrameWork, Rosemary est destiné à des usages bien spécifiques : pour des sites contenant beaucoup de pages, des parcs de sites ou encore des sites s'affichant sur de nombreux terminaux.

En effet, Rosemary offre la possibilité de factoriser certaines parties du code ; le nombre de feuilles de styles sera diminué, la modification de certaines propriétés sera accéléré.

Découvrir A Dash of Rosemary on Your CSS.