URL: https://linuxfr.org/users/crev/journaux/linuxfr-solarized-nouvelle-version Title: linuxfr-solarized : nouvelle version Authors: CrEv Date: 2012年07月26日T15:56:39+02:00 License: CC By-SA Tags: css et linuxfr Score: 21 Bonjour tous, Je vous [faisais part](http://linuxfr.org/users/crev/journaux/css-linuxfr-solarized) il y a peu de la CSS que j'ai créé pour LinuxFr.org. J'ai fais ce premier journal pour avoir des retours assez rapide sur son utilisation et pour voir un peu ce qu'il manquait. Je note toute de même que d'après les [stats](https://linuxfr.org/statistiques/users#stats_css) un peu plus de 15 personnes utilisent une version ou une autre, c'est déjà plus que je ne pensais. Description : ------------- J'ai donc pris pas mal de remarques en compte, et j'ai une version qui me satisfait suffisamment pour refaire un journal. Comme pas mal de choses ont évoluées voici un résumé de**s** CSS**s** : Il y a en effet 2 grands types de CSS : fond clair ou fond sombre. Dans les deux cas il y a une sous catégorie concernant les extraits de code : comme le texte ou inversé. La CSS est volontairement assez colorée, notamment au niveau des badges représentant les notes des contenus (journaux, dépêches, forums). Ils sont classés suivant plusieurs catégories, du - au + : * rouge (looser) * orange (vil trolleur) * couleur secondaire (dépend de la CSS) (neutre+, + car il faut une note positive ou nulle) * bleu (intéressant) * vert (parfait pour rentrer dans l'histoire des moules) La CSS est en largeur fixe (le classique `960px`). Les tribunes, y compris dans l'espace de rédaction collaboratives ont étés réalisées (très simplement, mais avec survol des norloges). L'édition est l'endroit où il resterait encore un peu de boulot, je ne suis pas pleinement satisfait mais ça me permet quand même de naviguer, commenter et publier convenablement donc ça devrait aller pour l'instant). Les statistiques et sondages sont plutôt cools je trouve (ben quoi, j'ai le droit d'être satisfait non ? ;-) ) Les contenus nouveaux et non visités ont droit à une mise en évidence un peu criarde mais ça correspond à ma façon (en partie visuelle et pas uniquement avec la toolbar) de naviguer dans le site. Les citations dans les commentaires voient la couleur de la bordure varier avec la profondeur, plus agréable je trouve. Scrineshout (cliquables pour de plus grandes versions) : -------------------------------------------------------- Page des journaux fond clair : [![light background](http://ybr.phpnet.org/linuxfr/min/journaux_light.jpg)](http://ybr.phpnet.org/linuxfr/full/journaux_light.jpg) Page des journaux fond sombre : [![dark background](http://ybr.phpnet.org/linuxfr/min/journaux_dark.jpg)](http://ybr.phpnet.org/linuxfr/full/journaux_dark.jpg) Commentaires, quote et code clair sur fond clair : [![light light](http://ybr.phpnet.org/linuxfr/min/code_light_light.jpg)](http://ybr.phpnet.org/linuxfr/full/code_light_light.jpg) Idem mais code sombre : [![light dark](http://ybr.phpnet.org/linuxfr/min/code_light_dark.jpg)](http://ybr.phpnet.org/linuxfr/full/code_light_dark.jpg) Commentaires, quote et code sombre sur fond sombre : [![dark dark](http://ybr.phpnet.org/linuxfr/min/code_dark_dark.jpg)](http://ybr.phpnet.org/linuxfr/full/code_dark_dark.jpg) Idem mais code clair : [![dark light](http://ybr.phpnet.org/linuxfr/min/code_dark_light.jpg)](http://ybr.phpnet.org/linuxfr/full/code_dark_light.jpg) Pour la technique : ------------------- * basée sur le thème de couleur [Solarized](http://ethanschoonover.com/solarized) qui permet d'avoir deux ensembles de couleurs (sombre ou clair) plutôt cohérent * basée sur [Knacss](http://www.knacss.com/) pour la base de la base * utilisation de [sass](http://sass-lang.com) comme préprocesseur CSS, afin entre autre d'être compatible avec les sources de LinuxFR Le poids total de la CSS est un peu élevé à mon goût (environ 50ko, 6ko en gzip). C'est pas non plus énorme mais pour le moment j'ai du mal à descendre en dessous (en tout cas avec sass), la faute en partie aux codes de compatibilité pour les dégradés par exemple. Les sources sont disponibles dans deux dépôts : * l'un sur baregit : http://baregit.com/crev/linuxfr-solarized * l'un sur github : https://github.com/CrEv/linuxfr-solarized Pourquoi deux, sachant qu'en plus ils sont pour le moment synchrones ? en fait j'aime bien Baregit, c'est beaucoup plus rapide que github, son créateur est dans les parages, c'est hébergé en Europe. Pourquoi github alors ? Fonctionnellement la plateforme est sympa, wiki, etc. Donc pour le moment j'ai les deux, et ça ne coûte pas grand chose de faire 2 push. Je verrai par la suite si je n'en garde qu'un ou pas. Les liens vers les CSS : ------------------------ * fond clair, code clair : * fond clair, code sombre : * fond sombre, code sombre : * fond sombre, code clair : Note pour finir : ----------------- N'hésitez surtout pas à me signaler si vous voulez des modifications, améliorations, etc.

AltStyle によって変換されたページ (->オリジナル) /