Barre personnelle sur plusieurs lignes

[Marc Driver]

Bonjour,

Avec les dernières versions de Firefox, les extensions telles que Roomy Bookmark ToolBar ou Multirow Bookmarks + ne fonctionnent plus.
Rien n'a été prévu pour les remplacer !
On m'a bien suggéré de d'écrire des scripts à mettre dans :: chrome.css mais je ne sais pas faire et les quelques exemples trouvés ne collent pas ensemble :
- pouvoir mettre les marque pages sur plusieurs rangs
ET
- ne mettre que leurs favicones

Aujourd'hui peut-être que quelqu'un a la solution ?

[Bob49]

Bonjour

La solution à déjà été donnée depuis un moment, une petite recherche sur le forum t'aurais mené sur ce fil(solution en 2ème page..)

[Anonyme1]

Bonjour,
En plus de la réponse de Bob49 qui te donne le fil pour mettre la barre perso sur plusieurs lignes, tu peut aussi cacher la barre personnelle automatiquement et la faire apparaitre au passage de la souris.
Voir ici: viewtopic.php?f=5&t=138980
A+

[Marc Driver]

@Bob49
@GlopGlop

Bonjour et merci pour vos réponses.
J’avais bien cherché en faisant « Barre personnelle multilignes » mais n’avais rien trouvé de satisfaisant ! Ceci dit j’ai peut-être manqué de persévérance ?

Je suis allé visité les 2 liens et fait des tests ; voici ce que j’ai remarqué :

Avec le viewtopic.php?f=5&t=135488]fil, j’obtiens bien plusieurs rangs, mais si je veux déplacer un favicone, il disparaît !

Avec le viewtopic.php?f=5&t=138980]deuxième lien, en mettant :

Code : Tout sélectionner

#PersonalToolbar { display: none; }
#navigator-toolbox:hover > #PersonalToolbar {display: -moz-box; }

la barre personnelle disparaît et apparaît bien au survol de la souris… avec une barre vide (a été signalé dans le deuxième fil) !
Si je mets ceci :

Code : Tout sélectionner

#PersonalToolbar { display: none !important; }
#navigator-toolbox:hover > #PersonalToolbar {display: -moz-box; }

la barre disparaît mais ne revient pas au survol de la souris !
Alors je supprime le code « Multi Rangs » pour ne garder que celui-ci :

Code : Tout sélectionner

#PersonalToolbar { display: none !important; }
#navigator-toolbox:hover > #PersonalToolbar {display: -moz-box; }

une fois encore la barre disparaît mais ne revient pas au survol de la souris !
Alors j’essaye seul celui-ci :

Code : Tout sélectionner

#PersonalToolbar { display: none; }
#navigator-toolbox:hover > #PersonalToolbar {display: -moz-box; }

A nouveau la barre personnelle disparaît et apparaît bien au survol de la souris… avec une barre vide !
Et sur le deuxième lien, celui qui avait trouvé en bidouillant, n’a pas répondu quand il lui a été demandé ce qu’il avait fait !
Je suis sous Windows 10.
Alors si quelqu’un a des idées sur l’un ou l’autre des sujets je suis preneur car je ne suis pas assez « trapu » pour résoudre cela tout seul !

[pepersan]

Bonjour

n’a pas répondu quand il lui a été demandé ce qu’il avait fait

il y a 2 pages : viewtopic.php?f=5&t=138980&start=15

[Marc Driver]

@pepersan

Bonjour,

J’étais certainement fatigué à l’heure où j’écrivais !

J’ai donc fini la lecture du post sur la barre personnelle cachée. En prenant le code indiqué, à savoir

Code : Tout sélectionner

/* Barre personnelle Cachée */
#PersonalToolbar {
min-height: 1px !important;
max-height: 1px !important;
}

/* Barre personnelle affichée en hover */
#navigator-toolbox:hover #PersonalToolbar {
height: 30px !important;
min-height: 30px !important;
max-height: 30px !important;
}

Cela fonctionne effectivement.

Maintenant mon but étant d’avoir non seulement la barre personnelle qui se cache ou se dévoile selon la position de la souris, mais aussi la possibilité d’avoir plusieurs rangs et seulement des Favicons sans texte j’ai accolé les deux solutions qui fonctionnent chacune de leur côté comme ceci

Code : Tout sélectionner

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
#personal-bookmarks {
display: block;
}

/* Barre sur plusieurs rangs et Favicons sans texte */

#personal-bookmarks #PlacesToolbar {
display: block;
min-height: 0px;
overflow-x: hidden;
overflow-y: auto;
max-height: 999px;
}

#personal-bookmarks #PlacesToolbar > hbox {
display: -moz-stack !important;
left: 0px;
right: 0px;
width: 100%;
}

#personal-bookmarks #PlacesToolbar #PlacesToolbarItems {
overflow-x: visible;
overflow-y: visible;
}

#personal-bookmarks #PlacesToolbar #PlacesToolbarItems > box {
display: block;
}

#personal-bookmarks #PlacesToolbar > .bookmark-item{
visibility: visible !important;
}

#personal-bookmarks #PlacesToolbar .chevron{
display: none;
}

#personal-bookmarks #PlacesToolbar > hbox > hbox{
overflow-x: hidden;
overflow-y: hidden;
}

#personal-bookmarks #PlacesToolbar #PlacesToolbarDropIndicator[collapsed="true"],
#personal-bookmarks #PlacesToolbar #PlacesToolbarDropIndicator{
display: none;
}

#personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item{
padding-top: 2px;
padding-bottom: 2px;
/*margin-left: -4px !important;
padding-right: 9.5px !important;*/
}

#personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item:hover:active:not([disabled="true"]),
#personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item[open="true"] {
padding-top: 2px !important;
padding-bottom: 2px !important;
/*-moz-padding-start: 4px;
-moz-padding-end: 2px;*/
}

#personal-bookmarks #PlacesToolbar toolbarseparator{
-moz-appearance: none !important;
visibility: visible !important;
display: inline;
text-shadow: none !important;
border-left: 3px solid ThreeDShadow !important;
border-right: 3px solid ThreeDHighlight !important;
vertical-align: middle;
}

#personal-bookmarks toolbarbutton.bookmark-item[dragover][open]{
-moz-appearance: toolbarbutton;
}

#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar):not(#TabsToolbar) {
max-height: 999px !important;
}
#personal-bookmarks .toolbarbutton-text {
display: none !important; }

/* Barre personnelle Cachée */
#PersonalToolbar {
min-height: 1px !important;
max-height: 1px !important;
}

/* Barre personnelle affichée en hover */
#navigator-toolbox:hover #PersonalToolbar {
height: 30px !important;
min-height: 30px !important;
max-height: 30px !important;
}

Le résultat est que j’obtiens bien plusieurs rangs et des Favicons sans texte mais la barre cachée et le survol de la souris ne fonctionnent pas, et ce quelque soit la place des codes (en début ou en fin de code) !

Qui peut m’aider à trouver ?

[Mapenzi]

Bonjour,

Le résultat est que j’obtiens bien plusieurs rangs et des Favicons sans texte mais la barre cachée et le survol de la souris ne fonctionnent pas, et ce quelque soit la place des codes (en début ou en fin de code) !

Essaie les codes suivants :

Code : Tout sélectionner

/* Multi-Row Bookmarks Toolbar */

#PlacesToolbarItems > box {
  display: inline-block !important;
}

#PersonalToolbar #PlacesToolbarItems {
  /* Override hiding */
  overflow-x: visible !important;
  overflow-y: visible !important;
  /* Add a little cushion */
  padding-bottom: 1px;
}

/* Affiche les favicons sans texte */
#personal-bookmarks .toolbarbutton-text {
display: none !important; }

/* Espace entre favicons */
toolbarbutton.bookmark-item {
padding: 4px 4px 4px 4px !important;
}

/* Barre personnelle cachée */
#PersonalToolbar {
min-height: 1px !important;
max-height: 1px !important;
}

/* Barre personnelle affichée en hover */
#navigator-toolbox:hover #PersonalToolbar {
height: 95px !important;
min-height: 95px !important;
max-height: 95px !important;
}

Sources :
https://www.reddit.com/r/firefox/commen ... efox_5758/
et
viewtopic.php?p=852990#p852990

Ce code fonctionne chez moi dans un nouveau profil (le cas échéant on doit adapter les pixel de padding et de height/min-height/max-height du dernier code). Ici une copie d'écran faite lors du survol de la barre de navigation ou de la barre des onglets:

[Marc Driver]

@Mapenzi

Bonjour,

Superbe !

J’ai comme tu l’as dit adapté au nombre de lignes nécessaires.

Je vais me permettre de pousser un peu plus loin si c’est possible :
Que ce soit pour le jour où je dépasse le nombre de lignes, ou mieux quand je minimise ma fenêtre, serait-il possible d’adapter cette hauteur dynamiquement au nombre de lignes ?

[EDIT]
En jouant sur la "maximum height" j'ai réussi à à résoudre manuellement la hauteur en fenêtre minimisée

[Mapenzi]

Je n'ai pas trouvé un code pour une hauteur flexible (et adaptative) pour la hauteur de la barre personnelle.
Mais on peut garder une hauteur fixe diminuée de la barre personnelle lors de son affichage par le survol avec la souris tout en introduisant un ascenseur qui permet de faire défiler les lignes des marque-pages (source https://support.mozilla.org/fr/questions/1184695).

Essaie les codes suivants modifiés :

Code : Tout sélectionner

/* Multi-Row Bookmarks Toolbar */

#PlacesToolbarItems > box {
  display: inline-block !important;
}

#PersonalToolbar #PlacesToolbarItems {
  /* Override hiding */
  overflow-x: visible !important;
  overflow-y: visible !important;
  /* Add a little cushion */
  padding-bottom: 1px;
}

/* Reduce padding on individual bookmarks to fit rows closer together */
#PersonalToolbar #PlacesToolbarItems .bookmark-item {
  padding-top: 1px !important;
padding-bottom: 1px !important; }

  /* --- [2] --- */
toolbarbutton.bookmark-item[type="menu"]{
    margin-right: .5em !important
}
/* --- [/2] --- */
	
/* Scrollable Bookmarks Toolbar 
   (displayed scroll bar nonfunctional) */
#PersonalToolbar #PlacesToolbarItems {
  overflow-y: auto !important;
}

#PersonalToolbar #PlacesChevron {
  display: none !important;
}

/* Affiche les favicons sans texte */
#personal-bookmarks .toolbarbutton-text {
display: none !important; }


/* Barre personnelle cachée */
#PersonalToolbar {
min-height: 1px !important;
max-height: 1px !important;
}

/* Barre personnelle affichée en hover */
#navigator-toolbox:hover #PersonalToolbar {
height: 80px !important;
min-height: 50px !important;
max-height: 60px !important;
}

Ça se présente comme ça chez moi :



Si ça t'intéresse il y a d'autres astuces de personnalisation de Firefox via le userChrome.css
http://www.easy-pc.org/2017/11/astuces- ... sions.html

[Marc Driver]

@Mapenzi

La dernière proposition ne marche pas du tout sur mon appareil !
Voici ce que j’obtiens :
Comme s’il n’y avait pas de userChrome.css qui est bien là pourtant !

[EDIT] Je n'avais pas enregistré le fichier en format texte ! Cependant j'obtiens seulement qu'une barre perso avec une ligne de Favicons sans texte et pas d'ascenseur !
J’avais en même temps une autre question car je viens de m’apercevoir que dans les dernières solutions qui fonctionne plutôt bien il manque tous mes dossiers et sous dossiers comme ci-dessous et qui étaient présents avec l’ancienne extension « MultiRow Tollbar Bookmarks » :

Encore un problème à résoudre !

Si tu as la solution, je la veux bien !

Mais je vais aussi aller voir ton lien sur les personnalisations de Firefox.

[Marc Driver]

J'ai essayé de bricoler la dernière version (max height 195, mini 45, maxi 95) mais cela donne seulement ceci :

Sans survol (barre théoriquement cachée)


et avec survol


Je peine !

[Mapenzi]

J'ai essayé de bricoler la dernière version (max height 195, mini 45, maxi 95) mais cela donne seulement ceci :

Je ne sais pas ce que tu fabriques mais d'après la deuxième copie d'écran tu n'as pas beaucoup de favoris qui occupent à peine deux lignes, donc pas la peine d'avoir une barre personnelle très haute.

Toujours dans le même profil neuf, sans aucune extension et avec le même code que j'avais proposé ci-dessus, j'ai fait un nouveau test en donnant une hauteur fixe - limitée à deux lignes visibles au survol - de la barre personnelle par une modification de la fin du code :

Code : Tout sélectionner

/* Barre personnelle affichée en hover */
#navigator-toolbox:hover #PersonalToolbar {
height: 40px !important;
min-height: 40px !important;
max-height: 40px !important;
}

Sans survol cela donne ça chez moi (barre cachée) :



Et avec survol on voit la barre personnelle avec deux lignes et l'ascenseur à droite
(au total j'ai mis environ 170 éléments dans ma barre personnelle pour la "gonfler", ces 170 éléments occupent quatre lignes et demie) :

[Freddy]

Bonjour,

Je m'incruste juste pour faire part de ce qu'il en est chez moi, car je m'étonne des problèmes pour adapter la hauteur de la barre.
En effet en ce qui me concerne il n'y a rien à ajouter pour que la taille de la barre s'adapte automatiquement au contenu:
le nombre de lignes s'adapte automatiquement si j'ajoute ou supprime des m-p
idem dans le cas du redimensionnement de la fenêtre
Et ceci rien qu'avec ce code:

Code : Tout sélectionner

#PlacesToolbarItems > box {
  display: inline-block !important;
}

#PlacesToolbarItems {
  overflow: visible !important;
}

comme je ne m'en sert pas, y a peut-être eu des changements par une période, mais je me rappelle avoir déjà eu ça à bricoler fut un temps et le code était déjà celui-ci (viewtopic.php?f=5&t=91742&start=15)

Et j'en profite pour préciser des petits ajouts pour ceux que ça intéresserait:
comme supprimer le texte ok, mais pas pour les Dossiers, car si on en a plusieurs, du coup on se retrouve avec tous leur même icône sans pouvoir les différencier (même si y aurait bien d'autres moyens de les distinguer).
Par contre tout en conservant le texte des m-p contenu dans ces dossiers.

et pas obligatoire mais que je trouve plus confortable, un ptit ajout pour la fluidité de l'animation, un peut de douceur dans le geste
(et ça permet aussi d'éviter le sursaut, voir la disparition, de la barre quand on se retrouve entre 2 m-p ou qu'on déplace le curseur trop lentement, en tout d'après mes tests chez moi)
Au final ça donne ça:

Code : Tout sélectionner

/*===== Barre personnelle multilignes =====*/

#PlacesToolbarItems > box {
  display: inline-block !important;
}

#PlacesToolbarItems {
  overflow: visible !important;
}


/* Barre personnelle cachée */
#PersonalToolbar {
min-height: 1px !important;
max-height: 1px !important;  transition-duration: 1s !important; 
}

#navigator-toolbox:hover #PersonalToolbar { 
  max-height:200px !important; transition-duration: 3s !important; 
}


/* Affiche les favicons sans texte (sauf pour les Dossiers) */
/*(car aussi bien pour reconnaitre quel dossier, que pour lire les m-p qu'il contient)*/
#personal-bookmarks .bookmark-item:not([container="true"]) .toolbarbutton-text {
display: none !important; }

/*===== fin Barre personnelle multilignes =====*/

On pourrait aussi ajouter un ptit delay au survol-souris avant de faire apparaitre la barre pour le cas où ça gène le décalage à chaque passage dans la barre d'outils sans avoir besoin d'aller dans la barre-perso, mais bon ça se discute...

[Marc Driver]

@Mapenzi

Je ne sais pas ce que tu fabriques …

Eh bien quelques fois moi non plus !

… d'après la deuxième copie d'écran tu n'as pas beaucoup de favoris qui occupent à peine deux lignes, donc pas la peine d'avoir une barre personnelle très haute

En fait, et c’est quelque chose dont je ne me suis pas aperçu tout de suite, c’est que quelque soit la proposition de code faite je suis limité dans l’affichage de mes dossiers et adresses !

Ma barre personnelle est composée de :
• 37 dossiers
• 134 adresses
soit un total de 171 éléments visibles (sans les sous-dossiers donc).

Ayant fait une mauvaise manipulation, mon Firefox est refait avec un profil neuf, voici ce que j’obtiens :

Barre personnelle cachée


Barre personnelle en survol


Donc, mon premier problème est de passer outre cette limitation à 128 éléments !

@Freddy,

Merci pour ton incrustation, j’ai bien lu tout ce que tu as écrit ; cependant, je ne vois rien qui enlève ma limite d’éléments à afficher !

[Marc Driver]

Des idées ?