Journal Mise à jour de la nouvelle css linuxfr

Posté par  .
Étiquettes :
0
10
juin
2004
Bonsoir,

Voilà j'ai encore bossé un peu ce soir sur la nouvelle css que j'avais pondu pour linuxfr. Donc au menu :
- Un petit icône prêt de la recherche en haut
- Une nouvelle killer feature contribué par Addendum Étienne Bersac à savoir que la dlfp toolbar est maintenant réduite et agrandis au survol.
- La recherche à été déplacé et certains éléments ne sont plus alignés pareil.
- la disparition de quelques bugs comme le trait blanc en haut

Mais un aperçu vos mieux qu'un long changelog http://zoukonet.free.fr/divers/css/sshot5.jpg(...)

Voilà donc c'est toujours ici pour la css http://zoukonet.free.fr/divers/css/style.css(...)

J'ai aussi remixé un wallpaper de ayo en provenance de lab73.com pour faire un nouveau logo linuxfr. Ca donnerais quelque chose comme ça
http://zoukonet.free.fr/divers/css/sshot6.jpg(...)
J'ai demandé l'autorisation à Ayo pour le proposer à linuxfr. J'attend ça réponse en croisant les doigts (de pieds)

Bien le bonsoir chez vous :)

  • # J'oubliais...

    Posté par  . Évalué à 10.

    L'icone de la recherche n'est pas de moi mais de http://jimmac.musichall.cz/(...)
    Voilà voilà, rendons à jimmac ce qui appartient à jimmac :D

    • [^] # Re: J'oubliais...

      Posté par  . Évalué à 3.

      Quelle façon classe de se faire plusser...

      mais je suis obligé de plusser tellement c'est beau.

      Bravo et merci !!!

      J'ai un petit bug tout de même, le bouton "Envoyer un commentaire" n'apparait qu'a moitié. La partie du haut. Est ce que le bug est uniquement chez moi ? (Firefox 0.9rc)

  • # Cette skin est excellente !

    Posté par  (site web personnel) . Évalué à 6.

    Je vote pour qu'elle soit la skin par défaut de linuxfr.org (ou au moins dispo en skin alternative).

    Merci beaucoup pour cette contribution.

    • [^] # Re: Cette skin est excellente !

      Posté par  . Évalué à 4.

      Il me semble que cette CSS utilise des trucs perso a mozilla qui n'ont rien de standard pour le moment. C'est donc une fort mauvaise idée d'en faire la CSS par defaut.

      Le web standard c'est pas uniquement quand il s'agit de geuler contre les extensions IE... J'ai aucun problème avec le fait d'utiliser des extensions des navigateurs mais c'est bonus pour ceux qui veulent/peuvent l'utiliser mais pas par défaut.

      PS: J'ai bien suivit pour les bords rond ?

      • [^] # Re: Cette skin est excellente !

        Posté par  . Évalué à 2.

        Bien sur, cette feuille de style est prévu pour les navigateurs basés sur gecko vous l'aurez compris. J'ai pas regardé ce que ça donne sous internet explorer mais c'est surement pas jojo. Si elle se dégrade bien sous IE pourquoi pas en feuille principale ?

        Sinon, en remetant à plat le xhtml du site, en nettoyant tout ça et en mettant en place une belle sémantique, on pourrait avoir le même look avec les bords ronds sans utiliser -moz-border-radius je pense. On pourrait d'ailleurs faire des choses bien plus jolies.

        Sinon pour la petite histoire de cet attribut css (-moz-border-radius) c'est plus ou moins une intégration "en avance" d'un attribut prévu pour les css3.

      • [^] # Re: Cette skin est excellente !

        Posté par  . Évalué à 5.

        Il n'y a casiment que les arrondies des cadres qui sautes sur les naviguateur non Geko et même sous IE sans gros probléme ( toolbar excepté ).

        Donc en soit cette feuillie de style CSS est meillieur que les premiére versions sous Templeet qui rendaient le site illisible sous IE.

      • [^] # Re: Cette skin est non valide w3c !!

        Posté par  . Évalué à 1.

        http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fzouko(...)

        Il est pas content le W3C.

        Joli boulot quand même.

        • [^] # Re: Cette skin est non valide w3c !!

          Posté par  . Évalué à 3.

          Aouch ! en effet ! Je vais décochoniser ça ce soir. Par contre elle ne validera pas car -moz-border-radius n'est pas reconnu. Mais y'aura pu que cette erreur (qui n'en est pas vraiment une) par contre :D

  • # petit bug ?

    Posté par  . Évalué à 2.

    De mieux en mieux cette css, ce serait en effet très bien de l'avoir selectionnée en permanence. C'est lourd de la remettre à chaque fois.

    Sinon, un petit pb chez moi http://littlebzh.free.fr/pb_bouton.png(...)
    avec mozilla 1.7RC3 en ce qui concernent le bouton envoyer un commentaire.
    C'est grave docteur ?

    • [^] # Re: petit bug ?

      Posté par  . Évalué à 2.

      Aouch ! En effet, c'est parceque le bouton recois le meme style que le champ de recherche en haut. Je vais voir si j'arrive atteindre cet élément sans modifier la barre de recherche la haut.

      Si une personne résponsable du site passe par là, la page principale ne valide plus car l'id "userbox" est répété plusieurs fois. Faudrait peut etre faire un petit quelque chose http://validator.w3.org/check?uri=http%3A%2F%2Flinuxfr.org%2Fmy%2F(...)

    • [^] # Re: petit bug ?

      Posté par  . Évalué à 1.

      Mozilla 1.7b
      Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.7b) Gecko/20040609

      même problème

  • # Bon....

    Posté par  . Évalué à 3.

    Vu le travail d'artiste je t'ai plussé à chaque fois que t'as posté un commentaire. Si tu veux que je continue à te payer en [+] tu sais ce qui te reste à faire :-)
    Merci

  • # Suggestions diverses

    Posté par  (site web personnel) . Évalué à 2.

    - proposer des variantes de couleur. J'aime bien les actuelles, mais ya moyen de jouer un peu dans les tons, meme en restant dans le schema actuel gris/beige. J'avais commencé sur ton ancienne version: http://mat.virgule.info/misc/linuxfr/style.css(...)
    - styler aussi les trucs de la toolbar

    Bon sinon j'ai d'autres idées mais je les garde pour le moment parceque apres quand moi je vais faire ma feuille de style yaura plus rien d'original :p

    • [^] # Re: Suggestions diverses

      Posté par  (site web personnel) . Évalué à 2.

      Je la trouve mieux ta feuille de style, surtout au niveau des polices, j'ai l'impression que celle de kaiska fait un anti-aliasing un peu dégueu (enfin dont le rendu sous windows est dégueu pour être exact)

      Un truc qui serait bien, ce serait de pouvoir garder ses CSS en mémoire sur son profil linuxfr.

      Apparement, c'est en cookie et j'ai pas la même gueule chez moi et au bureau. Et si je change de feuille pour mettre celle de quelqu'un d'autres, je perds définitivement l'autre (comme en plus, les feuilles de styles sont délocalisés un peu partout, ce serait bien de pouvoir avoir un genre de bookmark de feuille de style sur son profile) - Ce qui permettrait même de faire un "annuaire des feuilles de style" en récuperant celle enregistré par les utilisateurs.(et des statistiques de préférance d'utilisation etc.)

      Axel

      • [^] # Re: Suggestions diverses

        Posté par  (site web personnel) . Évalué à 2.

        Pour l'anti aliasing, ca vient des bordures en fait. J'ai volontairement mis des bordures qui vont mieux avec les couleurs de fond pour donner cette illusion d'un meilleur anti aliasing :)

  • # Splendide cette CSS

    Posté par  . Évalué à 3.

    Vraiment splendide, quelques tests : 
    Ceci est du code (balise pre)

    Ceci est du code (balise code)
    Liste:

    • Element

    • Element


    Liste compactée dans le code (Pour éviter que templeet ne mette des br :
    • Element
    • Element

    Blockquote:
    J'ai aussi remixé un wallpaper de ayo en provenance de lab73.com pour faire un nouveau logo linuxfr. Ca donnerais quelque chose comme ça
    http://zoukonet.free.fr/divers/css/sshot6.jpg(...)
    J'ai demandé l'autorisation à Ayo pour le proposer à linuxfr. J'attend ça réponse en croisant les doigts (de pieds)

    Quote : remixé un wallpaper

    C'est domage que code ne soit pas stylé comme pre, que le blockquote ait une police mono espacée et que le Quote ne fasse rien (De l'italique avec des guillemets français au tour serait le top)

    Les listes sont vraiment trop espacés (autant au tour de la liste qu'entre les élements)

    Aussi les bords rouge sur les boites de saisie actives... c'est bien de les surligner mais rouge ça fait bizzare avec le style de couleur, pourquoi pas faire les bords gris ou beige en temps normal et noir quand ils sont sélectionnés ?

    Oui je suis un enquiquinneur mais bon faut bien que certains fassent des remarques :D à part ça j'addore si non, ma nouvelle CSS par défaut.

    Note: Certains problèmes, notament avec les listes sont dejà présent avec la CSS par défaut, c'est pas ta faute, juste que si tu pouvais les corriger ce serait le top.

    • [^] # Re: Splendide cette CSS

      Posté par  (site web personnel) . Évalué à 2.

      [code] doit etre stylé avec une fonte monospace, mais pas comme du pre... peut etre avec le meme fond tout ca, mais ca doit rester inline.

      Pour les listes, ca vient du truc pour rajouter des retours chariots de linuxfr...

      • [^] # Re: Splendide cette CSS

        Posté par  . Évalué à 2.

        Bon je viens de faire quelques tests et apparament templeet ne fait pas la balise code ni la balise q Bon sinon pour mes tests : Quel type de fontes pour la balise tt ? Un bloc en monospace 
        # halt          Execute the halt command.
#
# Version:      @(#)halt  2.85-13  22-Mar-2004  miquels@cistron.nl
#

PATH=/sbin:/bin:/usr/sbin:/usr/bin

# Get the default from /etc/default/halt.
[ -f /etc/default/halt ] && . /etc/default/halt

if [ "$INIT_HALT" = "" ]
then
        case "$HALT" in
                [Pp]*)
                        INIT_HALT=POWEROFF
                        ;;
                [Hh]*)
                        INIT_HALT=HALT
                        ;;
        Block de citation
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse lorem turpis, commodo non, nonummy vitae, bibendum nec, nulla. Nullam diam arcu, ultricies at, lobortis eu, placerat eget, risus. Sed scelerisque malesuada libero. Curabitur eu purus ut tortor scelerisque varius. Cras ante massa, pretium et, interdum eu, fringilla non, velit. Cras leo metus, scelerisque et, vehicula sed, malesuada sed, velit. Aliquam wisi elit, sodales sit amet, auctor eu, scelerisque non, neque. In hac habitasse platea dictumst. Proin commodo molestie turpis. Duis id enim vitae purus cursus elementum. Nullam sodales felis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam feugiat ullamcorper turpis. Quisque in lorem a erat placerat semper. Integer feugiat laoreet quam.
        Du texte en gras, Un texte souligné, Un autre en italique, Une emphase, Un texte accentué.

        • [^] # Re: Splendide cette CSS

          Posté par  . Évalué à 2.

          Bon je viens de faire quelques tests et apparament templeet ne fait pas la balise code ni la balise q

          il est écrit en bas quant on poste un message que ça l'est mais j'ai pas vérifié dans le code HTML désolé, domage que ça n'y soit pas.

          • [^] # Re: Splendide cette CSS

            Posté par  . Évalué à 2.

            Merci pour tout ça blackfox :) Y'a des trucs qui vont pas encore au niveau des blocs de citations etc du dessus tu pense ?

            • [^] # Re: Splendide cette CSS

              Posté par  . Évalué à 2.

              Peut-être un espace entre les guillements et le texte serait bien... Si non c'est parfait.

      • [^] # Re: Splendide cette CSS

        Posté par  . Évalué à 2.

        Pour les listes, ca vient du truc pour rajouter des retours chariots de linuxfr...
        Oui mais mon petit test montre que même si on mets toute la liste sur une ligne (donc sans br ajoutés) ça reste quand même beaucoup trop espacé. Je vais posté ce message en décochant la case voilà ce que ça donne :
        • Element
        • Element
        • Element

  • # Juste pour te féliciter

    Posté par  . Évalué à 1.

    Un superbe travail, c'est beau, ca change et c'est tres lisible.
    La dlfp toolbar qui se reduit et tout et tout, vraiment le soucis du détail.
    \o/ :narta !

  • # roxor :)

    Posté par  . Évalué à 1.

    Ouéééééé \o/ ça claque de plus en plus cette petite css ;)

    Willo président !

    • [^] # Re: roxor :)

      Posté par  . Évalué à 4.

      héhé :)

      Au fait petite précision pour le logo que j'ai présenté en haut, l'idée est abandonnée.

      Ayo prépare ce personnage pour un nouveau site, on ne peut donc pas l'utiliser ici. Je suis en train de voir avec lui pour en utiliser un autre par contre. Wait & see.

      • [^] # Re: roxor :)

        Posté par  . Évalué à 1.

        ah ouki, c'est con j'aimais bien ce ptit pingouin :)

  • # Question Newbie

    Posté par  . Évalué à 1.

    Salut,

    je suis désolé de demander ça, mais... comment fait on pour appliquer cette feuille CSS lorsqu'on a mozilla? Quel menu?

    Merci.

    David.

    • [^] # Re: Question Newbie

      Posté par  (site web personnel) . Évalué à 2.

      Il faut:
      - activer javascript
      - activer les cookies
      - aller activer la toolbar dans les preferences de ton compte linuxfr
      - changer la feuille de style a l'aide de la toolbar.

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.