Page 1 sur 1

Modification d'un thème

Publié : 29 mars 2018, 11:33
par Tournicotis
Bonjour,

Je suis sous Xubuntu 16.04, Firefox 59.0.2 64 bits.
J'ai pour thème "Green light and Kolibri", et j'aimerais pouvoir modifier ce thème.
En effet, l'image de fond est constituée d'un dégradé de vert qui va de foncé (à gauche) à très clair (à droite), de sorte que le texte et la croix de fermeture (en blanc) ne sont que très peu visibles sur les onglets situés à droite.

Avec quel outil ou quelle méthode puis-je modifier ce thème (ou un autre)? A savoir changer la couleur des onglets ou bien la couleur de la police, ou bien le dégradé de l'image?

Merci d'avance,

Ph.

Re: Modification d'un thème

Publié : 29 mars 2018, 15:22
par Cucurbitacé
Bonjour Tournicotis,

Avec ces 2 fichiers usercontent.css et userchrome.css ; ce qui est chiant, c’est qu’il faut donc savoir programmer.
==> viewtopic.php?f=5&t=55281 <==

Ou alors repiquer le code de personnes qui savent programmer et qui ont déjà créé ces 2 fichiers : https://userstyles.org/styles/browse/browser

Ou encore utilisez une extension telle que Stylich : https://addons.mozilla.org/en-US/firefo ... sh/?src=ss

Il a aussi Stylus : https://addons.mozilla.org/en-US/firefox/addon/styl-us/

Voire changer de Thèmes : https://addons.mozilla.org/en-US/firefox/themes/

Bien à vous.

Re: Modification d'un thème

Publié : 29 mars 2018, 15:42
par Tournicotis
Bonjour, et merci :)
Vais regarder ça.
En attendant, je bricole (après sauvegarde) le fichier userChrome.css en me basant sur des infos trouvées ici http://j2m-06.pagesperso-orange.fr/faq_ ... hrome.html et ici http://www.easy-pc.org/2017/11/astuces- ... sions.html

Résultats intéressants, même si je n'ai pas encore trouvé comment gérer la transparence.

Re: Modification d'un thème

Publié : 29 mars 2018, 15:49
par Cucurbitacé
Bonjour Tournicotis,

Le 1er lien (J2M-06) est le site du modérateur du Forum, il est aussi le traducteur de l'aide sur le site Mozilla.
==> memberlist.php?mode=viewprofile&u=10530 <==

Bien à vous.

Re: Modification d'un thème

Publié : 29 mars 2018, 15:51
par Tournicotis
:) eh bien super boulot!

Merci beaucoup

Re: Modification d'un thème

Publié : 01 avr. 2018, 19:05
par Freddy
Bonjour,

Je sais pas où tu en es dans ta déco d'intérieure, mais au cas où, ptêt qu'avec une ptite base comme celle-ci ça pourrait t'aider :wink:

Code : Tout sélectionner

/*---couleur texte onglets---*/
tab.tabbrowser-tab {
  color: gold !important;
  text-shadow: 1px 2px 1px red, 3px -1px 3px black, -1px -2px 3px black, 3px 3px 3px black !important;
}

/*---couleur bouton fermeture---*/
.tab-close-button {
  color: black !important;
 filter: drop-shadow(1px 2px 0px  white ) !important;
}

/*---couleur boutons "nouvel onglet" & "liste des onglets"---*/
#new-tab-button,
#alltabs-button {
  filter: drop-shadow(1px 2px 1px black) !important;
}
C'est un exemple parmi d'autres, mais je pense que c'est mieux d'agir sur la couleur du texte que sur le dégradé de l'image, qui risquerait de faire que du sombre partout. (et bien sûr tu peux changer les valeurs)

Re: Modification d'un thème

Publié : 04 avr. 2018, 11:32
par Tournicotis
Merci beaucoup!

J'avais dans un premier temps ajouté:

Code : Tout sélectionner

/* Couleur de la croix et du fond du bouton nouvel onglet */
.tabs-newtab-button {
color: red !important;
background: lavender !important; }
mais curieusement la modif restait valable seulement jusqu'au treizième onglet. A l'ouverture du suivant, le bouton "nouvel onglet" disparaissait.
J'ai transigé en choisissant un autre thème qui me convient (2 Kolibri) avec la configuration suivante:

Code : Tout sélectionner

  /* --- Made by Trustadz --- */
    @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once in userChrome.css */
.bookmark-item{
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important; 
}
toolbarbutton.bookmark-item .toolbarbutton-text{
    display: none !important;
}
toolbarbutton.bookmark-item .toolbarbutton-icon{
    margin-left: 2px !important;
}
#PlacesToolbarItems > .bookmark-item > .toolbarbutton-icon[label]:not([label=""]) {
    margin-inline-end: 2px !important;
}
toolbarbutton.subviewbutton.subviewbutton-iconic .toolbarbutton-text{
    display: -moz-box !important;
}
/* --- [1] --- */
toolbarbutton.bookmark-item:hover:not(.subviewbutton):not([disabled="true"]):not([open]) .toolbarbutton-text{
    display: -moz-box !important;
}
/* --- [/1] --- */
/* --- [2] --- */
toolbarbutton.bookmark-item[type="menu"]{
    margin-right: .5em !important
}
toolbarbutton.bookmark-item[type="menu"] .toolbarbutton-text{
    display: -moz-box !important;
}
/* --- [/2] --- */
/* --- [4] --- */
#PlacesToolbarItems{
    opacity: 0.3;
    transition-delay: 3s; 
    transition-duration: .5s;
}
#PlacesToolbarItems:hover{
    transition-delay: 0s;
    opacity: 1;
}
/* --- [/4] --- */
/* --- [5] --- */
#PersonalToolbar{
    height: 3px !important;
    min-height: 3px !important;
    max-height: 3px !important;
    padding:0;
}
#PersonalToolbar #personal-bookmarks{
    opacity: 0;
}
#PersonalToolbar:hover{
        height: 2em !important;
    min-height: 2em !important;
    max-height: 2em !important;
    padding: 0 6px 2px;
}
#PersonalToolbar:hover #personal-bookmarks{
    opacity: 1;
}
#PersonalToolbar, #PersonalToolbar #personal-bookmarks{
    transition-delay: 1s !important; /* Change the 1s to change how long the bookmarkbar stays visible */
}
#PersonalToolbar:hover, #PersonalToolbar:hover #personal-bookmarks{
    transition-delay: 0s !important;
}
  /* changer la couleur de la croix de fermeture de l'onglet (ok FF58) */
  .tab-close-button     {
      color: red !important;
    }
  .tab-close-button:not([selected])     {
      color: white !important;
    } 
 /* changer la police (taille/couleur...) des onglets (ok FF58) */
  .tab-text   {
    font-size: 120%; font-style: italic; color:e4f9c3
  } 
 /* remettre l'arrondi des onglets (ok FF57) */
  .tab-background {
    border-radius: 8px 8px 0px 0px !important; border-image: none !important;
  }
  .tab-line {
    display: none;
  } 
  
/* --- [/5] --- */
et tout va bien pour le moment. Je vais néanmoins étudier ta proposition.

Merci encore!

Re: Modification d'un thème

Publié : 08 juin 2021, 15:43
par lool_lauris
[modération]
Le post de Xzu a été déplacé vers cette nouvelle discussion.
[/modération]lool-lauris