personnaliser Firefox avec le userChrome.css

[Freddy]

Bonjour,

1- Tu peux placer le bouton "Marque-pages" (le simple, pas celui qui a le dropmarker -petite flèche-) dont le rôle est justement d'ouvrir la barre latérale, un clic → ouverture, reclic → fermeture.
Tu peux le positionner où tu veux, même dans la barre d'onglets et même la barre des modules si tu l'as d'affichée.

A moins que ce soit pas le panneau des M-p que tu utilises pour lire tes flux, mais dans ce cas faudrait préciser avec quoi (quelle extension) ?


2- Par exemple:

Code : Tout sélectionner

    #back-button[disabled="true"],
    #forward-button[disabled="true"]
    {
       visibility: hidden !important;
    }

ou encore, pour les laisser apparaitre plus ou moins:

Code : Tout sélectionner

    #back-button[disabled="true"],
    #forward-button[disabled="true"]
    {
       opacity: 0.3 !important; /*** valeur de 0 à 1 ou 100% ***/
    }

3- C'est même bizarre que ça marche chez toi; ça doit plutôt arrondir le contour des barres (et c'est ce qui passe chez moi)
Ça devrait être bon avec ça:

Code : Tout sélectionner

 toolbarbutton:hover
{ 
  -moz-appearance: none !important;
  -moz-border-radius: 20px !important; 
}

Voilà

[Invité]

bonjour Freddy,
waouh, tout ça pour moi, merci

2 c'est ok

1 ça marche pô, le bouton permet juste de pouvoir dérouler le panneau :
-je clique sur le bouton, rien ne se passe, mais en survolant le bord de la fenêtre, le panneau se déplie,
-je re clique sur le bouton, le panneau reste fermé, même en survolant
même comportement avec le bouton de l'extension qui est sage : [url]https://addons.mozilla[point]org/fr/firefox/addon/sage/[/url]

3 (et la je suis pas fier fier : erreur au copiage/collage ) c'était ça, (enfin une partie de ça) :

Code : Tout sélectionner

/*
 _______________________________________________________________________
|                  |                                                    |
|          Title:  |  Rounded Menus Popups (WellRounded) Firefox 3      |
|    Description:  |  Rounded Edges on all menus WOW                    |
|         Author:  |  -=Ben=-                                           |
|   Date Created:  |  June 27, 2008                                     |
|   Last Updated:  |  December 16, 2008                                 |
|        Version:  |  1.0.0.5                                           |
|__________________|____________________________________________________|

*/





@namespace url(http://www.mozilla[point]org/keymaster/gatekeeper/there[point]is.only.xul);




popup:not(#autoscroller), menupopup 
{
  -moz-border-radius: 19px !important;
  border-collapse: separate !important;
  -moz-appearance: none !important;
}


menubar > menu, menupopup > menu, popup > menu, menuitem, toolbarbutton,popup:not(#autoscroller)
{ 
  -moz-border-radius: 19px !important;
  border-collapse: separate !important;
  /* Remove the following comment to revert back to tiny menus: */
  /* -moz-appearance: none !important; */
}



#contentAreaContextMenu menuitem[disabled="true"],
#contentAreaContextMenu menuitem[disabled="true"] + menuseparator,
menuitem[disabled="true"]
{ 
  /* display: none !important; */
  -moz-border-radius: 19px !important;
  border-collapse: separate !important;
}



menupopup > menu[_moz-menuactive="true"],
menupopup > menuitem[_moz-menuactive="true"],
popup > menu[_moz-menuactive="true"],
popup > menuitem[_moz-menuactive="true"] 
{
  -moz-border-radius: 19px !important;
  border-collapse: separate !important;
  /* -moz-appearance: none !important; */
}

bon je l'ai désactivé, j'ai essayé que le tien, les deux ensemble : toujours pareil, ça ne fonctionne que dans la barre de navigation et que avec les boutons "d'origine", ça n'affecte aucun de ceux de toolbar buttons ni de ceux des autres extensions...

4 un petit bonus, tant que je tiens un spécialiste: ce background, c'est impossible de lui dire de prendre carrément la forme du bouton, au lieu de lui donner une forme??? bah, quoi? j'aurais essayé

encore merci...

[Freddy]

- pour le 1° désolé j'avais même testé avec le code en service
Le comportement que tu décris est normal pcq en fait pour que le code fonctionne il faut que la sidebar soit activée/ouverte, et c'est la même commande qu’exécute le bouton, donc du coup si on demande la fermeture par le bouton → et ben le code ne peut plus agir, et si on demande l'ouverture → la sidebar s'ouvre bien mais avec les propriétés du code.
En résumé j'ai bien peur (mais pas plus que ça non plus ) que ce ne soit pas possible, en tout cas d'après mes connaissances actuelles (j'suis p't'être plus débutant, mais dans la catégorie spécialiste, si )


- 3°: ben chez moi çà à l'air ok.
Ce que tu veux, c'est bien qu'au survol du pointeur les boutons prennent la forme arrondie ?
Pour moi ça marche pour tous les boutons, même ceux des extensions, ceux de la barre perso, ceux de la barre de modules.

mais ça ne fonctionne que sur certains : précédent, suivant, actualiser dans la barre de navigation, et sur aucun dans la barre personnelle

ça n'affecte aucun de ceux de toolbar buttons

"toolbar buttons" pour toi c'est bien la même chose que "barre personnelle"


- 4°: euuuh ben pis là,

ce background, c'est impossible de lui dire de prendre carrément la forme du bouton, au lieu de lui donner une forme???

j'ai pas trop du tout saisi. Si tu peux être (beaucoup) plus précis...

[lucette]

bonjour et merci,
dsl, c'était moi au dessus (mais tu avais dû reconnaitre la touche de "choupinages man" )

pour 1 : pas grave, pour le coup c'était vraiment du choupinage...

"toolbar buttons" pour toi c'est bien la même chose que "barre personnelle"

non, c'est l'extension qui ajoute des boutons : https://addons.mozilla.org/fr/firefox/a ... r-buttons/

ton code marche bien... sauf pour noia 4 (celui que je voudrais utiliser, bien sur! ) :
c'est étrange, mais si j'ai bien fais mes tests, les boutons de toolbar buttons (l'extension), et ceux des autres extensions on un comportement bizarre, (avec noia4) :
-s'ils sont dans la barre de navigation, il restent carrés, mais si je les déplace dans la barre perso, ils sont tous bien ronds!
-les boutons "par défaut" de ff, sont ronds dans les deux barres sauf le "afficher les marque-pages" (déroulant) qui n'est rond que dans barre perso
-afficher le panneau des marque-pages (latéral), lui, est rond dans les deux cas!

- 4°: euuuh ben pis là,

a écrit:ce background, c'est impossible de lui dire de prendre carrément la forme du bouton, au lieu de lui donner une forme???

j'ai pas trop du tout saisi. Si tu peux être (beaucoup) plus précis...

y'a eu mélange de ma part car il y a des thèmes ou on voit que l'icone du bouton (yogurtree, noia 4) et d'autre ou on voit le bouton entier (défaut, bloomind ft graphiteglow). plus clair?

donc, ce que je voudrais, c'est, les icônes des boutons sans fond (noia par défaut) et au survol, le fond des icônes des boutons :
-"s'allume", apparait
-est rond, ou mieux, a la forme de l'icône (le point 4 )
-est dégradé (dense au centre et plus clair vers bords)
-a une couleur (pour le choix de la couleur, ça je devrais y arriver... )
-a tous ces comportements dans toutes les barres

pfouiouiou, que c'est compliqué d'exposer simplement des choses simples, quand on a pas le bon vocabulaire, dsl, j'ai fais de mon mieux

après quelques minutes heures de recherches j'ai trouvé des bouts de ça, mais je suis incapable d'arriver à faire faire tout ça en même!

encore, et d'avance, merci

[Freddy]

re,

Voilà qui est plus clair en effet.
Quoique... avec toutes les extensions-options-thèmes que tu dois avoir je sais pas si ça va encore être bon, ...verra bien.

Déjà, moi avec Noia4 j'ai rien de "carré" au survol des boutons
Bon enfin j'ai pondu qqchose d'après ce que tu demandes, mais je précise que c'est fait avec aucune option d'activée dans l'extension "Noia4 theme configurator" (qui as due venir se coller là avec l'installation du thème, en tout cas je me rappelle pas l'avoir fait manuellement)

Donc voilà l'affaire:

Code : Tout sélectionner

/* pour que le background soit rond pour tous les boutons */
/* car certains sont moins larges par défaut */
/*!!! c'est pas obligatoire !!!*/

#nav-bar[iconsize="large"] toolbarbutton[removable="true"]
{ min-width: 35px !important; }

#nav-bar[iconsize="small"] toolbarbutton[removable="true"]
{ min-width: 26px !important; }

#PersonalToolbar toolbarbutton[removable="true"]
{ min-width: 24px !important; }



/*====== Background Rond au survol des boutons ======*/
toolbarbutton:hover
{
 -moz-appearance: none !important;
 -moz-border-radius: 100px !important;

 background-image: -moz-radial-gradient( hsla(210,100%,40%,0.9) 10%, hsla(210,100%,75%,.9) 65%, hsla(200,100%,75%,.9) ) !important;


 box-shadow: 0px 0px 1px 1px hsla(210,100%,70%,0.8),
             0px 0px 2px 2px hsla(200,100%,68%,0.5),
             0px 0px 6px 5px hsla(200,100%,70%,0.4) !important;

/*** autre choix possible ***/
/*
box-shadow:  0px 0px 1px 1px hsla(210,100%,75%,0.7) inset,
             0px 0px 4px 3px hsla(200,100%,75%,0.9) inset,
             0px 0px 8px 5px hsla(190,100%,80%,0.5) !important;
*/

/*** Effet à l'affichage du background ***/
/*!!! Pas obligatoire !!!*/
 -moz-transition: background-image 0.4s ease-in,
                  box-shadow 0.1s ease-in !important;
           

}

Chez moi c'est ok qqsoit la barre.
Pour le fond qui prend la forme de l'image je sais pas faire, et je suis pas du tout certain que ça puisse se faire

Pour le bouton "afficher les marque-pages" (déroulant), je sais pas comment t'arrives à le caser ailleurs que dans la barre-perso, en ce qui me concerne ça se peut pas...

Bien entendu pour la couleur c'est qu'un exemple (l'a bien fallu en mettre une ) ,j'ai utilisé la méthode "hsl" pcq c'est peut-être plus pratique pour travailler un dégrader, mais c'est faisable aussi avec "rgb" si t'as plus l'habitude.
Tu peux évidemment ajouter ou supprimer des valeurs aussi bien pour la propriété "background-image: -moz-radial-gradient" que pour "box-shadow:".


Si c'est pas bon, faudrait p'têt voir avec les différents bouts de codes que tu dis avoir essayé mais qui marchent pas ensemble.

[Romaric]

Bonjour,

J'ai déjà posé la question ici : http://www.geckozone.org/forum/viewtopi ... =5&t=97189 mais sans réponse…

Bonjour

Pour régler le nombre de résultats de la barre d’adresse intelligente de Firefox, about:config puis le nombre que l’on veut ici : browser.urlbar.maxRichResults.

Mais pour le nombre de résultats affichés… je n’ai trouvé qu’avec userChrome.css et ce code :

Code : Tout sélectionner

#PopupAutoCompleteRichResult[type="autocomplete-richlistbox"]{
height: 531px !important;
}

Ça affiche la place à 14 résultats (ce que je veux ) mais... ça affiche aussi la place à 14 résultats quand il y en a que 2, 3...(ce que je ne veux pas...)

Exemple :
Image 1 : http://min.us/inCovzW3WVzvf.png
Image 2 : http://min.us/ibyZA7NPSUeKZE.png

Donc, je me « permet » de la reposer ici…

Comment régler le nombre de résultats affichés dans la barre d’adresse « intelligente » de Firefox ?

Merci !

[Pastisman]

Salut,

Et si tu mets max-height à la place de height ?

[Romaric]

Et bien ça ne marche pas
J'ai essayé :
max-height: none !important;
max-height: 531px !important;
height: 100% !important;
…
mais non…

[pmic]

Bonjour Romaric

Je recherche justement la même chose

Je me suis servi de ton code avec les mêmes conséquences
Mais je préfère quand même cela, plutôt que d'avoir que 6 adresses de visible

Si tu trouve la solution pour ce problème, je suis preneur

[Invité]

Possedant un ecran 10" l'espace disponible est important j'utilisais donc régulièrement le mode plein écran de FF 7
mais celui ci me pose différents problèmess:
-pas de visualisation de la barre perso par survol des outils
-onglets non visibles ce qui perturbe lors d'un clic sur un lien ouvrant un nouvel onglet (on a l'impression qu'il ne se passe rion d'ou souvent un second clic sur le lien...)

ayant découvert récement userChrome.css, j'ai écrit le code suivant qui avec la barre de menu cachée et les onglets au dessus me donne un bon compromis visibilité-accessibilité

voici le code:

Code : Tout sélectionner

/* Cacher barre de navigation */
#nav-bar {-moz-transition-delay: 1s;visibility:collapse;}
#navigator-toolbox:hover  #nav-bar {  visibility:visible;}

/* Cacher barre personnelle */
#PersonalToolbar  {-moz-transition-delay: 1s;visibility:collapse;}	
#navigator-toolbox:hover  #PersonalToolbar { visibility:visible;}

(Je vous aurais bien mis des copie d'écran pour visualisation mais je ne sais pas comment les inserer )

le seul point noir que je vois encore est le fait que le contenu de l'onglet descend lorsque les barres d'outils apparaissent.

j'ai donc essayé différentes choses:

Code : Tout sélectionner

#navigator-toolbox:hover #appcontent {margin-top:100px;!important}

là la 2eme partie du code fonctione (#appcontent {margin-top:100px;!important}) mais elle ne fonctionne plus avec le hover
d'autre part si je met une valeu négative (margin-top:-100px) le contenu de l'onglet s'affich par dessus les barres d'outil.

Comme il s'agit de travailler sur le contenu de l'onglet j'ai également tenté de modifier userContent.css

Code : Tout sélectionner

#phpbb {top:100px;!important;  margin:100 !important;  padding:100 !important;}

mais là il ne se passe rien...

donc pour l'instant je seche sur ce point

[Pastisman]

Bonjour,

Je n'ai pas testé tous tes codes, mais pour l'avant dernier, #appcontent n'étant pas inclus dans #navigator-toolbax, il est normal que cela ne fonctionne pas.
Essaies plutôt ceci :

Code : Tout sélectionner

#navigator-toolbox:hover + #browser #appcontent {margin-top:100px;!important}

[jmlat]

Bien vu,

effectivement ça fonctionne avec ta modif !

Par contre si on met une valeur négative (puisque je veux faire remonter le contenu de l'onglet de la hauteur des barres d'outil) le contenu de l'onglet s'affiche par dessus les barres d'outil et non en dessous...

je n'obtiens donc pas le résultat escompté

Je vois donc 2 pistes de recherche:
- soit arriver à afficher le contenu de l'onglet sous les barres d'outil
- soit utiliser les scrollbars pour modifier la position de la zone affichée (mais ne marchera pas si la page n'est pas plus grande que l'écran

pour l'instant je seche...

[Pastisman]

Et en mettant une propriété z-index qui va bien sur ton contenu et ta barre d'outil ?

[jmlat]

merci Pastiman

Effectvement j'obtiens une amélioration avec le code ci dessous:

Code : Tout sélectionner

#browser #appcontent {-moz-transition-delay: 1s;margin-top:0px;!important}
#navigator-toolbox:hover + #browser #appcontent {margin-top:-52px;!important}

/* Cacher barre de navigation */
#nav-bar {-moz-transition-delay: 1s;visibility:collapse;position: relative; z-index: 8;}
#navigator-toolbox:hover  #nav-bar {-moz-transition-delay: 0.3s;  visibility:visible;}

/* Cacher barre personnelle */
#PersonalToolbar  {-moz-transition-delay: 1s;visibility:collapse;position: relative; z-index: 8;}	
#navigator-toolbox:hover  #PersonalToolbar {-moz-transition-delay: 0.3s; visibility:visible;}

lorsque mes barres d'outils disparaissent je n'ai plus de déplacement visible du contenu de l'onglet.
par contre lorsqu'elles apparaissent le contenu de l'onglet descend avec les barres d'outil avant de remonter derriere.

je ne sais pas pourquoi cela se fait en 2 temps !

[jmlat]

Ca y est je l'ai:

en fait il fallait utiliser hidden et ne collapse

voici donc le code qui fonctionne:

Code : Tout sélectionner

#browser #appcontent {margin-top:-52px;!important}


/* Cacher barre de navigation */
#nav-bar {-moz-transition-delay: 1s;visibility:hidden;position: relative; z-index: 8;}
#navigator-toolbox:hover  #nav-bar {  visibility:visible;}

/* Cacher barre personnelle */
#PersonalToolbar  {-moz-transition-delay: 1s;visibility:hidden;position: relative; z-index: 8;}	
#navigator-toolbox:hover  #PersonalToolbar { visibility:visible;}  

le seul petit problème qui reste est la réactivité de l'apparition des barres au survol de la zone outil (il y a un patit délai non désiré .