Bonjour les gens,
Pour bien démarrer 2013 (je suis un peu à la bourre), je vous propose une nouvelle css:
Cela fait bien longtemps que j'ai commencé à la développer et à l'utiliser, il est donc largement temps de la diffuser, même s'il doit rester de nombreux défauts. L'idée de base était de faire une css qui s'adapte bien à tous les formats ( responsive ) et qui permette une consultation agréable sur smartphone. Je ne suis pas vraiment satisfait du style des commentaires mais je n'ai pas trouvé mieux pour le moment (dur de trouver un truc à la fois joli et pratique pour garder le fil de l'arborescence). Les suggestions sont les bienvenues.
Le design reprend pas mal de choses de oli.jp style guide (licence by-sa) ainsi que de bootstrap (je ne suis pas webdesigner, juste bidouilleur occasionnel). Merci également à CrEv et sa css solarized, qui m'a mis sur la bonne voie avec l'utilisation de sass.
Les sources sont disponibles sur github et la version compilée est ici.
# pas mal !
Posté par fravashyo . Évalué à 5.
vraiment sympa cette feuille, je trouve celle par défaut déjà bien, mais celle-ci change un peu, et est très classe. Je vais la tester pour voir.
Je trouve que c'est une bonne idée d'atténuer les éléments autour du texte principal (c'est à dire les autres titres par rapport au texte de l'article en cours de lecture), néanmoins je trouve l'atténuation un peu trop poussée pour le coup.
Autre chose, dans les commentaires, quand on écrit ça passe par dessus la mention "markdown", j'imagine que ça devrait être un peu décalé pour éviter de chevaucher cela.
« I approve of any development that makes it more difficult for governments and criminals to monopolize the use of force. » Eric Raymond
[^] # Re: pas mal !
Posté par Anonyme . Évalué à 1.
Que c'est bio ! Vraiment.
[^] # Re: pas mal !
Posté par saimn . Évalué à 2.
effectivement ca manque peut-être un peu de contraste, je me suis habitué mais je comprend que ça puisse géner. Je vais voir si je trouve une texture de fond un poil plus claire.
corrigé. Merci pour le retour.
[^] # Re: pas mal !
Posté par fravashyo . Évalué à 2. Dernière modification le 03 février 2013 à 09:56.
En fait le fond est très bien, peut-être qu'en mettant le texte juste un ton au dessus de ce qu'il est actuellement… d'autant plus que les icônes sont beaucoup plus foncées, et que par exemple lorsque ça mélange liens et texte annexe, comme dans "Des règles de modération sont applicables aux commentaires", le contraste est presque trop important. L'idéal serait d'atténuer le texte pas important (comme celui indiqué plus haut), et renforcer la tonalité des liens, mais pas trop.
Enfin, dans des parties comme "Ce commentaire est-il pertinent ou inutile", on ne voit plus du tout ce qui est lien de ce qui ne l'est pas (idem pour pages perso), c'est un peu déroutant.
Pour la correction du markdown, je ne la vois pas, soit l'ancien css est toujours dans le cache, soit il n'a pas été recompilé suite à la modification. (edit : c'était bien un problème de cache. De plus le "modifier/répondre" a bien été corrigé !)
« I approve of any development that makes it more difficult for governments and criminals to monopolize the use of force. » Eric Raymond
[^] # Re: pas mal !
Posté par saimn . Évalué à 2.
J'ai mis une couleur un peu plus foncée pour voir ce que ça donne.
Pour le problème de cache, j'ai mis une durée de cache assez longue pour soulager mon serveur et éviter d'avoir à retélécharger la css trop souvent, donc il faut forcer le rafraîchissement.
Je ne sais pas dans quelle mesure il serait possible d'ajouter le hash de la css dans l'url pour les css externes ?
[^] # Re: pas mal !
Posté par fravashyo . Évalué à 3.
c'est très bien comme ça, merci
« I approve of any development that makes it more difficult for governments and criminals to monopolize the use of force. » Eric Raymond
# Suis-je un mec de droite ?
Posté par Ife . Évalué à 9. Dernière modification le 02 février 2013 à 17:01.
Elle est très jolie. Comme beaucoup d'autres ici.
Mais voilà, je n'arrive pas à utiliser une autre feuille de style que
contrib/kaiska-newqui était celle par défaut de DLFP avant qu'il ne passe sur RoR.Est-ce que ça fait de moi un dinosaure partouzeur de droite ?
Ruby est le résultat d'un gamin qui apprend le Java, puis jette un œil à Perl et se dit « je peux le réparer! »
[^] # Re: Suis-je un mec de droite ?
Posté par Anonyme . Évalué à 3.
J’utilise
grisequi reste à mon goût la plus belle.Sur cette nouvelle CSS, que je trouve jolie aussi, je pense qu’il manque un fond aux éléments du menu latéral.
[^] # Re: Suis-je un mec de droite ?
Posté par BAud (site web personnel) . Évalué à 3. Dernière modification le 07 février 2013 à 00:13.
beau succès 42 utilisateurs actuellement d'après
http://linuxfr.org/statistiques/users#stats_css :-)
édition : 72 au 7 février :-) bravo !
# Très chouette
Posté par Guillaume Denry (site web personnel) . Évalué à 2. Dernière modification le 02 février 2013 à 18:05.
J'apprécie les liens généraux en haut à gauche dans un bandeau toujours visible.
Les liens à droite dans la CSS par défaut sont anti-ergonomiques au possible, le regard étant généralement porté dans le coin nord-ouest.
Attention néanmoins aux liens répondre/modifier du commentaire qui se chevauchent (bug reproductible naturellement seulement pendant le cours laps de temps qui suit la création du commentaire).
[^] # Re: Très chouette
Posté par muchos (site web personnel) . Évalué à 2.
J'adore aussi !
Mais pourquoi y a-t-il autant d'erreurs au validateur ? (La réponse est dans la question, mais j'imagine que ce ne sont pas de "simples" erreurs…)
Debug the Web together.
[^] # Re: Très chouette
Posté par saimn . Évalué à 2.
Le validateur à l'air d'avoir un problème avec certaines règles css (
rgba(), *zoom), sans que je sache trop pourquoi …[^] # Re: Très chouette
Posté par gik . Évalué à 1. Dernière modification le 03 février 2013 à 00:34.
J'ai ce problème de chevauchement quand la fenêtre n'est pas assez large, ce qui est embêtant dans le cas ou l'on colle deux fenêtres l'une à côté de l'autre sur un écran de 1680 pixels de large (sous chromium). Je suppose que la largeur de la police de la feuille de style y est pour quelque chose.
Nimage
Sinon le logo en haut à gauche passe derrière le cadre blanc. Ces détails mis à part, j'aime autant l'esthétique que l'ergonomie et j'adopterais cette feuille de style dès qu'elle sera peaufinée.
PS: Tout compte fait, j'ai aussi Répondre et Modifier qui se chevauchent peut importe la taille de ma fenêtre.
[^] # Re: Très chouette
Posté par saimn . Évalué à 2.
Pour le logo et le lien "Modifier" c'est corrigé. Par contre pour le reste c'est plus compliqué si je veux garder cette disposition …
[^] # Re: Très chouette
Posté par gik . Évalué à 1.
Là, tout de suite maintenant tout est beau, tout fonctionne. Donc un grand merci et tout.
# Merci && Bug
Posté par François Chaix (site web personnel) . Évalué à 1. Dernière modification le 02 février 2013 à 22:07.
Très chouette. Je l'utilise maintenant. J'espère que tu ne casseras pas le lien, c'est ce que j'ai renseigné au site…
J'ai remarqué un petit bug minime : quand les titres de commentaires sont trop longs, ou que l'on est trop loin dans les emboîtements de commentaires, le titre du commentaire se chevauche avec le « Ce commentaire est-il pertinent ou inutile ? ».
Nimage
Edit : Ah d'ailleurs c'est pareil avec le Répondre/Modifier. : Nimage
La lumière pense voyager plus vite que quoi que ce soit d'autre, mais c'est faux. Peu importe à quelle vitesse voyage la lumière, l'obscurité arrive toujours la première, et elle l'attend.
[^] # Re: Merci && Bug
Posté par saimn . Évalué à 1.
C'est celui que j'utilise aussi donc si je le casse en général je m'en rend compte assez vite.
oui je connais le problème, mais j'ai pas vraiment de solution. Je suis un peu limité du fait de ne pas pouvoir toucher au code html.
j'ai remarqué ca tout à l'heure mais comme le lien modifier est éphémère, il a disparu entre temps. J'ai testé une modif on va voir ce que ça donne ;-).
# sass & co
Posté par CrEv (site web personnel) . Évalué à 4.
Ben de rien ;)
Franchement, ça fait un moment que je ne fais plus de css. Que du sass, scss, less, google stylesheet. C'est quand même beaucoup plus puissant / intéressant.
D'ailleurs, alors que j'étais plus syntaxe scss, j'utilise de plus en plus sass qui est plus sympa si on part from scratch (pas de css existant) et qui est plus cohérente dans un contexte ruby + coffeescript + haml puisqu'on a 4 syntaxes presque identiques.
Sinon, ça me fait dire que je devrais finir de corriger deux trois petites choses dans solarized, ça ferait du bien…
Bravo pour ta css
[^] # Re: sass & co
Posté par Laurent Pointecouteau (site web personnel, Mastodon) . Évalué à 1. Dernière modification le 03 février 2013 à 19:20.
Je songeais justement à préparer une feuille de style pour Linuxfr (j'en suis encore à la mockuper dans Gimp), et je pense profiter de l'occasion pour me mettre aux Sass et compagnie. Ce qui me fait un peu flipper, n'étant pas du tout programmeur, mais je pense pouvoir y arriver avec un peu d'abnégation.
Autrement, félicitations saimn, tu as fait ma nouvelle CSS préférée :)
# Très bien pour les smartphones
Posté par Sylvain Blandel . Évalué à 1.
Ta feuille de style donne un très bon affichage sur les smartphones. Merci et bravo !
Suivre le flux des commentaires
Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.