personnaliser Firefox avec le userChrome.css

[Invité]

hi-han 2 http://www.geckozone.org/forum/viewtopi ... 286#297286 du 9 janvier 2005

Code : Tout sélectionner

/* ====== BARRE PERSO SUR PLUSIEURS NIVEAUX ====== */
#bookmarks-ptf
{
	display: block;
	background-image: url("/home/ottomar/images/gnomeCanyon/fondOpera4.png") !important;
	border: 0 !important;
	padding: 0 !important;
	line-height: 0.9em !important;
}
#bookmarks-ptf toolbarseparator
{
	display: inline;
}
/* === /// BARRE PERSO SUR PLUSIEURS NIVEAUX ====== */


/* ====== REGLAGES ICONES - TEXTE - BOUTON  */
#bookmarks-ptf .bookmark-item .toolbarbutton-text
{
	padding: 0 2px 0 2px !important;
	font-size: 10px !important;
	font-weight: bold !important;
}
#bookmarks-ptf .bookmark-item .toolbarbutton-icon
{
	padding: 0 1px 0 2px !important;
	margin : 0 !important;
	border: 0 !important;
}
#bookmarks-ptf toolbarbutton
{
	padding: 0 !important;
	margin : 0 !important;
	border: 0 !important;
}
/* === /// REGLAGES ICONES - TEXTE - BOUTON  */

[/quote]

bonsoir 

bien que le sujet soit ancien, il m'est utile pour moi juste pour ce qui concerne la barre sur 2 lignes !

sur 1 PC Firefox 2 linux ubuntu ça fonctionne 

sur 1 PC Firefox 2 winXP ça fonctionne aussi

sur 1 PC Firefox 2 winXP ça ne fonctionne pas la barre s'affiche un instant sur 2 lignes puis revient sur une ligne

auriez-vous une astuce ? 

merci

[size=75]Message envoyé avec : [color=olive]Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.11) Gecko/20071127 Firefox/2.0.0.11[/color][/size]

[sub13]

bon je suis l'invite de ci dessus en fait en changeant le thème ça remarche !

bye

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.11) Gecko/20071127 Firefox/2.0.0.11

[ottomar]

saluts
c'est juste une histoire d'espacement ou de caractère de police : enlever une espace ou simplement une apostrophe à un marque-page doit remettre d'aplomb la barre : c'est du réglage fin (parfois)

[ottomar]

q'soul & javel-script en travers du boilleau de la tête qu'elles l'ont, les gamines adonnées et mozillées... suivez mes regards





Cascading-oTTomar a encore frappé !

ColumnBookmarks oTTo 1.9.3.1
vos marque-pages sur plusieurs colognes, si !







mon dossier 'Extensions' ? 230 mp, entassés depuis la 1.0.0.
2 solutions mais préférez la seconde





parce que vous ne croyiez pas que j'allais vous le donner gratos, hein !

ColumnBookmarks oTTo 1.9.3.1v2 et code clair
ici

Zrffntr raiblé nirp : Zbmvyyn/5.0 (K11; H; Yvahk v686; se; ei:1.9.0.3) Trpxb/2008092416 Sversbk/3.0.1931




☎ Edith et je le lui trouve le triumph pédestre

[pirlouy]

Ah le gros chien !
Bon d'accord, c'est pas trop dur à recopier, ça va !

[ottomar]

moqueur et querelleur comme d'habitude
mais point peine d'éditer le bla :
Ah le gros chien ! suffisait

bien sûr, il vous faut adapter le code : résolution d'écran, largeur pour nombre de colonnes
reste quelques petits progrès à faire

saluts

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.17) Gecko/20080829 Firefox/2.0.0.17

[ottomar]

quoique ahhhh ! le grand chien eût été plus correspondant, mais ce la me gonfle ma satisfaction, c'est de te l'avoir fait recopié

mise en garde
bug en passant par le menu marque-pages, en fait pas d'affichage du tout (menu vide mais ouvert) après le 2eme essai, un retour ?
par contre ça roule avec le dossier (ou sous-dossier) dans la barre perso
ColumnBookmarks oTTo 1.9.3.1 v2
dossier dans barre personnelle
si vous voulez essayer dans le menu marque-pages : supprimer #bookmarksBarContent dans le code

Code : Tout sélectionner

#bookmarksBarContent .bookmark-item[container="true"][label="NOM-DE-VOTRE-DOSSIER"] .bookmark-item 
{
/* si vous ne l'avez pas déjà */
-moz-appearance: none !important;
	min-width: 200px !important;
	max-width: 200px !important;
	/* pour faire beau */
	margin-left: 8px !important;
	/* pour faire encore plus beau */
	background: #181818 !important;
}
/* de 'none' à... rien ! arf ! */
/* ça, c'est carré */
/* mais un à peine plus multiple de la largeur du marque-page */
/* si vous mettez tout à 'none' s'adapte à l'écran */
#bookmarksBarContent .bookmark-item[container="true"][label="NOM-DE-VOTRE-DOSSIER"] menupopup .popup-internal-box 
{ 
	min-width: 650px !important; 
	max-width: 650px !important;
	min-height: 650px !important; 
	max-height: 650px !important; 
}
/* zone d'affichage */
#bookmarksBarContent .bookmark-item[container="true"][label="NOM-DE-VOTRE-DOSSIER"] menupopup .scrollbox-innerbox 
{ 
	width: auto !important;
	/* ni "block", ni 'inline' */ 
	display: table !important;
}
/* si vos marque-pages sont classés ou par rubrique ou par alphabètisme */
/* et que vous avez pris le soin de séparer par un... separator*/
/* profitez-en pour séparer les rubriques ou les majuscules */
/* pour y voir plus clair dans votre le foutras qu'est votre dossier */
#bookmarksBarContent .bookmark-item[container="true"][label="NOM-DE-VOTRE-DOSSIER"] menupopup menuseparator
{
	display: block !important;
	/* pour séparer encore plus, selon la saveur */
	margin-bottom: 24px !important;
	border-color: transparent !important;
}
/* celui-la, je le laisse parce que le scroll... */
#bookmarksBarContent .bookmark-item[container="true"][label="NOM-DE-VOTRE-DOSSIER"] menupopup autorepeatbutton
{
/*	display: none !important;*/
}
/* installation d'une barre de défilement, si vous le voulez bien */
/* ... le scroll, c'est le hic : la barre s'affiche bien, mais scrolle mal à la roulette' */
/* mais réagit bien au clic et au glissage */
/* j'aimerais bien un retour à ce sujet */
#bookmarksBarContent .bookmark-item[container="true"][label="NOM-DE-VOTRE-DOSSIER"] scrollbox
{
	overflow-y: auto !important;
}

Zrffntr raiblé nirp : Zbmvyyn/5.0 (K11; H; Yvahk v686; se; ei:1.9.0.3) Trpxb/2008092416 Sversbk/3.0.1931

Edithé : NOM-DE-VOTRE-DOSSIER

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9.0.3) Gecko/2008092416 Firefox/3.0.3

[ottomar]

fx3
comme d'hab : ça ne sert strictement à rien, juste à se faire plaisir d'avoir un firefox pas comme les autres, et vaut mieux se sentir bien dans son canapé, hein !


mise à jour pour fx3
horizons nouveaux au delà de la ligne bleue des Vosges :
Maginot-Line & Camping-Table

Moteurs de recherche
(search-plugins)

je vous mets les principes,
après... vous vous dépampersez tout seul, sissi !

au départ, est ceci



La mise à jour :
Standard Pack
voir :
http://www.geckozone.org/forum/viewtopi ... 170#259170
http://www.geckozone.org/forum/viewtopi ... 610#259610

essayez de les avoir de la même largeur,
la même hauteur, c'est pas nécessaire, ça se rectifie
faites un petit :hover, c'est plus sympa
les couleurs à votre goût, bien sûr

Code : Tout sélectionner

/* === moteurs de recherche === */
/* ====== standard pack ======= */

#searchbar scrollbox .box-inherit
{
-moz-appearance: none !important;
	background-color: #424242 !important;
	/* largeur de l'image */
	max-width: 140px !important;
	min-width: 140px !important;
}
/* suppression de l'icône normale */
.menuitem-iconic.searchbar-engine-menuitem image
{
	display: none !important;
}
.menuitem-iconic.searchbar-engine-menuitem
{
-moz-appearance: none !important;
	margin-top: 2px !important;
	background-image: none !important;
	background-repeat: no-repeat !important;
	/* 'effacer' le label */
	color: transparent !important;
	/* la hauteur 'standard' de l'image */
	height: 65px !important;
}
.menuitem-iconic.searchbar-engine-menuitem:hover
{
	background-color: #000000 !important;
}
/* les searchplugins en spécifiant la hauteur pour les ceusses que  */
/* la hauteur est plus ou moins pas égale à la hauteur spécifiée plus haut */
#Google
{
        background-image: url("http://www.izipik.com/images/20081026/tbnjqha9shn2fphih8knj-google-ambu-glow-140.png") !important;
}
#Google:hover
{
        background-image: url("http://www.izipik.com/images/20081026/tbnkmo6ckhdyvc5jtt8if-google-ambu-glow-color-140.png") !important;
}
#Yahoo
{
        background-image: url("http://www.izipik.com/images/20081026/tbnjfk536m78hgkj988t0-yahoo-glow-140.png") !important;
}
#Yahoo:hover
{
        background-image: url("http://www.izipik.com/images/20081026/tbnjc3nz5mpkebcj7sy9b-yahoo-glow-color-140.png") !important;
}
/* pourquoi un menuitem ? */
menuitem[label="Google Images"][class="menuitem-iconic searchbar-engine-menuitem"]
{
        background-image: url("http://www.izipik.com/images/20081026/tbngtcybth1z5u4ig6u41-google-moto-glow-140.png") !important;
/* rectification de la hauteur */
/* 45, c'est pas 65 ! */
        height: 45px !important;
}
menuitem[label="Google Images"][class="menuitem-iconic searchbar-engine-menuitem"]:hover
{
        background-image: url("http://www.izipik.com/images/20081026/tbnlzdfzzid68u5klwtk6-google-moto-glow-color-140.png") !important;
}
/* gérer les moteurs de recherche */
.open-engine-manager
{
-moz-appearance: none !important;
	background-image: url("http://www.izipik.com/images/20081026/tbnlzmcb7miul2qlfmneg-fire-cap-inline.png") !important;
	background-repeat: no-repeat !important;
	height: 45px !important;
	color: transparent !important;
}
.open-engine-manager:hover
{
	background-image: url("http://www.izipik.com/images/20081026/tbnitnovbmy07mwj9yqz6-fire-cap-inline-hover.png") !important;
}

/* ==/ moteurs de recherche === */

Nouvel horizon :
Maginot-Ligne

ça va bien si vous n'en avez pas beaucoup
si vous en avez des grosses, apparait le petit machin de défilement
(comme dans les gros dossiers de marque-pages)
la même largeur, c'est mieux
la même hauteur, c'est très conseillé par Edith
faites un petit :hover, c'est plus sympa
les couleurs à votre goût, bien sûr

Code : Tout sélectionner

/* === moteurs de recherche === */
/* ======= maginot-line ======= */
#searchbar scrollbox
{
	background: #424242 !important;
}
#searchbar scrollbox .box-inherit
{
-moz-appearance: none !important;
	max-width: none !important;
	min-width: none !important;
	display: inline !important;
	/* hauteur de l'image */
	max-height: 45px !important;
	height: 45px !important;
}
/* suppression de l'icône normale */
.menuitem-iconic.searchbar-engine-menuitem image
{
	display: none !important;
}
.menuitem-iconic.searchbar-engine-menuitem
{
-moz-appearance: none !important;
	margin-right: 6px !important;
	background-image: none !important;
	background-repeat: no-repeat !important;
	color: transparent !important;
	/* dimensions des images */
	height: 45px !important;
	max-width: 100px !important;
	width: 100px !important;
}
.menuitem-iconic.searchbar-engine-menuitem:hover
{
	background-color: #000000 !important;
}
/* les searchplugins */
#Google
{
background-image: url("http://www.izipik.com/images/20081026/tbniooe1lkq5nsukufzz8-google-ambu-glow-101.png") !important;
}
#Google:hover
{
background-image: url("http://www.izipik.com/images/20081026/tbnhj8f6rlxu04lgt10ya-google-ambu-glow-color-101.png") !important;
}
#Yahoo
{
background-image: url("http://www.izipik.com/images/20081026/tbnmam7gvn65rztlhvhfv-yahoo-glow-101.png") !important;
}
#Yahoo:hover
{
background-image: url("http://www.izipik.com/images/20081026/tbnl79nc4jnwgvnjlfgjk-yahoo-glow-color-101.png") !important;
}
/* pourquoi un menuitem ? */
menuitem[label="Google Images"][class="menuitem-iconic searchbar-engine-menuitem"]
{
background-image: url("http://www.izipik.com/images/20081026/tbnhvgf41jrubi9l4mtf3-google-moto-glow-101.png") !important;
}
menuitem[label="Google Images"][class="menuitem-iconic searchbar-engine-menuitem"]:hover
{
background-image: url("http://www.izipik.com/images/20081026/tbnn1xtqmk5opoek46c5p-google-moto-glow-color-101.png") !important;
}
/* gérer les moteurs de recherche */
.open-engine-manager
{
-moz-appearance: none !important;
	background-image: url("http://www.izipik.com/images/20081026/tbnlzmcb7miul2qlfmneg-fire-cap-inline.png") !important;
	background-repeat: no-repeat !important;
	height: 45px !important;
	width: 10px !important;
	color: transparent !important;
}
.open-engine-manager:hover
{
	background-image: url("http://www.izipik.com/images/20081026/tbnitnovbmy07mwj9yqz6-fire-cap-inline-hover.png") !important;
}

/* ==/ moteurs de recherche === */

Nouvel horizon :
Camping-Table

ça, c'est à l'aise, coule comme un pot de cancoille par un fraise ensoleillé matin de printemps
compact et pratique, sans fatigue
la même largeur d'image, c'est mieux
la même hauteur d'image, c'est mieux
faites un petit :hover, c'est plus sympa
les couleurs à votre goût, bien sûr

Code : Tout sélectionner

/* === moteurs de recherche === */
/* ======= camping table ====== */

#searchbar menupopup[class="searchbar-popup"] scrollbox
{
	background: #424242 !important;
	height: auto !important;
}
#searchbar menupopup[class="searchbar-popup"] scrollbox .box-inherit
{
-moz-appearance: none !important;
	/* multiple de la largeur de vos images */
	max-width: 200px !important;
	min-width: 200px !important;
	/* cancoillotte */
	display: table !important;
	max-height: auto !important;
}
/* suppression de l'icône normale */
.menuitem-iconic.searchbar-engine-menuitem image
{
	display: none !important;
}
.menuitem-iconic.searchbar-engine-menuitem
{
-moz-appearance: none !important;
	background-image: none !important;
	background-repeat: no-repeat !important;
	color: transparent !important;
	/* dimensions des images */
	height: 45px !important;
	max-width: 100px !important;
	width: 100px !important;
}
.menuitem-iconic.searchbar-engine-menuitem:hover
{
	background-color: #000000 !important;
}
/* les searchplugins */ 
#Google
{
	background-image: url("/home/ottomar/images/gmail/google-ambu-glow-101.png") !important;
}
#Google:hover
{
	background-image: url("/home/ottomar/images/gmail/google-ambu-glow-color-101.png") !important;
}
#Yahoo
{
	background-image: url("/home/ottomar/images/gmail/yahoo-glow-101.png") !important;
}
#Yahoo:hover
{
	background-image: url("/home/ottomar/images/gmail/yahoo-glow-color-101.png") !important;
}
/* pourquoi un menuitem ? */
menuitem[label="Google Images"][class="menuitem-iconic searchbar-engine-menuitem"]
{
	background-image: url("/home/ottomar/images/gmail/google-moto-glow-101.png") !important;
}
menuitem[label="Google Images"][class="menuitem-iconic searchbar-engine-menuitem"]:hover
{
	background-image: url("/home/ottomar/images/gmail/google-moto-glow-color-101.png") !important;
}
/* gérer les moteurs de recherche */
.open-engine-manager
{
background-image: url("/home/ottomar/images/firefox/fire-cap-inline.png") !important;
background-repeat: no-repeat !important;
width: 10px !important;
height: 45px !important;
color: transparent !important;
}
.open-engine-manager:hover
{
background-image: url("/home/ottomar/images/firefox/fire-cap-inline-hover.png") !important;
}

/* ==/ moteurs de recherche === */

/* pourquoi un menuitem ? */
c'est pas compliqué mais faut suivre
même pas besoin du dom inspector pour trouver les id (#) des moteurs : tout simplement leur id, c'est leur label exact, !exact le label (Google, c'est #Google)
donc l'id de Google Images, c'est #Google Images mais le code ne pige pas donc c'est pourquoi menuitem[label="Google Images"] est sur le pont, vous pouvez faire aussi menuitem[id="Google Images"] c'est comme vous voulez mais que quand j'ai gratté mon poil de ma l'auriculaire narine, j'ai fait avec label et pas l'idée. c'est tout que s'applique aux moteurs type que ça se close par (fr) vu ?

franchement ?
ça sert à rien (bis)

Zrffntr raiblé nirp : Zbmvyyn/5.0 (K11; H; Yvahk v686; se; ei:1.9.0.3) Trpxb/2008092416 Sversbk/3.0.1931

☎ Edith
toutes images avec
Gimp,
yes !

[ottomar]

ce post est un grand bordin !
Edithé et édithé, c'est pas ma tasse

ou on le blogue
ou on le wikite
ou on refait un post firefox3 en post-it
nan... je me marre

le blogue, ça irait bien : pas de mélange, sujet par sujet, mais pas un blog perso : un blog official geckozone : je tiens formellement et physiologiquement au partage libre (et bêtement)

vos éternuements ?


Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9.0.3) Gecko/2008092416 Firefox/3.0.1931

openbox
Edith : openbox, jamais rien vu d'aussi rapide, t'as même pas le temps de cliquer

[pirlouy]

Un sujet post-it pour Firefox 3.1+ ? avec des screenshots pris par-ci par là ?
Mais ça vaut le coup d'orienter vers certains styles de userstyles.org, non ?

[myahoo]

vos éternuements ?

'Tchoum cher bestiau

Il y a de l'idée avec une page type blog, puisqu'au moins, il y aurait un bon sommaire.
Mais après tout, couïde d'une nouvelle Rubrique ?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.3) Gecko/2008092417 Firefox/3.0.3

[nico@nc]

Voire un sous-forum si on a un jour droit à phpbb3 (ce qui mettra peut-être moins de temps à arriver qu'il n'en faudra pour mettre en place un blog "officiel"... ah l'administration ! ) ?

[bormat]

une petite question les code userchrome marche t'il dans les thème

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.3) Gecko/2008092417 Firefox/3.0.3 ImageShackToolbar/5.0.0

[myahoo]

(Désolé, c'est plus fort que moi, mais je traduis puisqu'ici c'est un forum et pas du tchattte : )

Une petite question : les codes userchrome marchent-ils dans les thèmes ?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.9.0.3) Gecko/2008092417 Firefox/3.0.3

[pirlouy]

Une petite question : les codes userchrome marchent-ils dans les thèmes ?

Qu'est-ce que tu veux dire ? Oui, tu peux utiliser du css dans un thème, mais le fichier userchrome ne sert pas pour créer un thème (à part si tu veux faire des essais).