Suite de : Une peau neuve pour Shaarli de sebsauvage

[EDIT 22/11/2011 : Customisation des liens privés + Unification des boutons]

Dans la série customisons shaarli, mise à jour du pack graphique avec résolutions de nombreux petits bugs énervants (les liens qui se chevauchent, le nuage de tag qui empiète sur le header …):

 

Ainsi qu’un ptit plus pour le fun, un remodelage du bookmarklet « à la firefox » qui agit en popin (parce que tous nous avons un jour été traumatisé par les popup, plus jamais ça! :p )

Customisation des liens privé et unification des boutons de contrôles.

Pour voir ce que ça donne, rendez vous sur mon shaarli : http://link.idleman.fr (pour voir la partie admin et bookmarklet, je vous invite à télécharger le thème et à le tester en local)

Pour obtenir ce thème sur votre shaarli, voici le dossier avec les 2 fichiers et le dossier à remplacer pour obtenir ce thème : Télécharger shaarli-IdleTheme.zip

Article rédigé par Idleman

13 réflexions au sujet de « Suite de : Une peau neuve pour Shaarli de sebsauvage »

  1. jerrywham

    Bonsoir,

    Sympa cette skin pour shaarli. Juste pour info, la barre de scroll apparait toujours en bas de page. J’ai proposé de modifier 3 lignes de css afin de la faire disparaitre sur le site de sebsauvage. Pourquoi ne pas les utiliser ?

    Répondre
    1. Idleman Auteur de l’article

      Hé bien pour être honnête je pensais que sebsauvage l’avait fait puisqu’il l’a dis dans son commentaire :

      17 novembre 2011 à 13 h 28 min (Modifier)

      bon j’ai intégré ton thème (légèrement modifié) à la version 0.0.28 de Shaarli (avec les suggestions de jerrywham).
      Avant de le publier, je vais probablement encore ajouter d’autres choses (j’ai encore un paquet de TODO sous le bras).

      Et étant donné que j’ai repris sa version et que la scroll ne m’a pas tapé dans l’œil je n’y ai pas fait attention :) je réglerais ça a la prochaine release promis :) merci pour le correctif.

      Répondre
  2. sebsauvage

    Arg… je pensais avoir fait la correction: je fais re-vérifier.

    Idleman, pour ton patch, j’aime moyen le truc inclu dans la page pour 3 raisons:
    1) les champs ne sont pas assez larges.
    2) ça masque une partie de la page (parfois j’ai besoin de relire la page pour noter des chose dans la description)
    3) ça passe mal sur certains sites (exemple:

    Pour ces raisons, je vais garder le mode « popup », désolé.

    Répondre
    1. Idleman Auteur de l’article

      Pas de soucis, rien ne t’oblige a prendre tous en bloc c’est ton programme ^^, en revanche je me permet de te conseiller de prendre les autres modifs de la dernière version du zip en ligne puisqu’elles corrigent les anciens bugs visuels (chevauchement de boutons,vieux contrastes de boutons… qu’on peux voir sur ton screenshot par exemple) et ajoute un ptit pic sympa pour les liens privés (mais encore une fois ça n’est qu’une suggestion).

      Pour ce qui est de la popin je pense pouvoir l’améliorer de façon à ce qu’elle « repousse » la page sur le côté plutôt que de se superposer maladroitement dessus ce qui résoudrais les point 2) et 3). pour les champs trop petits c’est une autre histoire, mais est ce si gênant à partir du moment ou l’on peux prendre son aise sur la hauteur? De plus cette présentation permettrais, à terme d’afficher des catégories ou des tags sélectionnables (toujours dans l’optique « d’émuler » un bookmark de browser) non? :)

      Répondre
    1. Identitools

      Un z-index sur la div du pop-in ça aiderai peut-être ?

      Sinon je suggère de mettre le pop-in en bas de page, sur 100% de la largeur et 300px de hauteur. Au moins il suffira de scroller pour voir les infos masquées.

      Répondre
      1. Idleman Auteur de l’article

        J’y ai pensé, mais cela continuerais de cacher le contenu, je pense que la meilleur solution est de faire comme ce qui existe déjà pour les bookmarklet de firefox & Cie a savoir un bookmarklet qui repousse tous simplement le reste du site. Donc je pense qu’il faut abandonner la position absolute.

        Pour ce qui est de la mettre a l’horizontale, j’y ai pensé aussi (c’était même la première version modifiée de la popin de mon côté, sauf que je l’avais mise en haut) seulement je trouve que ça fait trop linéaire et que c’est peu ergonomique, surtout par rapport au textarea et aux menus. :)

        Répondre
        1. Identitools

          Ok.
          Dernière suggestion, si c’est possible pourquoi pas une boite modale ? Avec possibilité de la déplacer. Ça devrait demander plus de temps niveau développement mais ça aurai son petit charme (même si je sais que Seb déteste ces trucs là :D)

          Répondre
          1. Idleman Auteur de l’article

            C’est une idée intéressante (et j’espère sincèrement que ce n’est pas la dernière :p ) et c’est tous à fait faisable mais en effet si on applique le principal du modal ( c’est a dire qui empêche toute action à l’utilisateur en dehors de cette fenêtre ) ça risque de plus gonfler l’utilisateur qu’autre chose,donc à la rigueur autant rester sur un principe de popin en forme de fenêtre plutôt que de réelle fenêtre modale.

            Après il faut aussi voir que les possibilités sont limité dans un bookmarklet et donc qu’il est difficile de faire quelque chose d’aussi complexe que les pluging jquery que l’ont voir pousser de partout genre lightbox :) .

          2. Identitools

            Oh bah si tu y tiens à mes suggestions je vais me gêner :D

            (hmmm je crois qu’on a atteint la limite de messages imbriqués…)

            Que pense tu de cette intégration pour une modal ?
            http://themeroller.nitric.co.za/
            On peut interagir en dehors de la boite, ça bouge, c’est good ! :)

          3. Idleman Auteur de l’article

            Si tu parle de la fenêtre qui s’ouvre a droite quand on clique sur themeroller dev tool, effectivement je la trouve pas mal c’est un bon compromis, mais dans un bookmarklet c’est chaud à intégrer, on n’a pas accès a des librairies comme jquery et je pense (à vérifier) qu’on a une limite en nombre de caractères.

            Dans tous les cas c’est l’avis de sebsauvage qui compte :) et je suis pas sûr que ça l’emballe nos histoires de popin (il préfère sa popup le vieux chnok :D )

          4. Identitools

            1% des utilisateurs de shaarli prennent 99% des décisions relatives à son fonctionnement. #occupons-sebsauvage.

            (je sors :D)

          5. Idleman Auteur de l’article

            1% t’es gentil ^^ je suis pas sûr qu’on représente une si grosse part :p

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Xo ^_^ :siffle: :p :-( :evil: oO :) T_T <3 :D more »