Change le fond de la partie active du menu

6 posts in this topic

Posted (edited) · Report post

Bonjour.

 

Après de nombreuses recherche je ne sais pas où je dois aller pour modifier la couleur de fond de la partie active du menu.

(home, catégorie 1, catégorie2, etc.

 

Au lancement le menu est actif sur l'icon home sur fond blanc.

Je veux une autre couleur de fond.

Mais je ne veux pas changer le fond du survol onmouseover.

 

Si vous pouviez me dire quoi chercher.

Bonne journée

Edited by anceze

Share this post


: post
Share on other sites

Posted · Report post

Bonjour,

Pour savoir quelle classe CSS s'applique sur un élément HTML, vous pouvez utiliser un outil comme firebug sur Firefox (ou appuyer sur F12 sur Chrome) qui permet de cibler un élément HTML sur la page, et de lister les règles CSS qui s'applique sur l'élément choisi.

En l’occurrence les classes CSS qui semble correspondre à ce que vous souhaitez sont :

.nav-list > li.active > a,
.nav-list > li.open > a,
.nav-list > li > a:hover,
.nav-list > li > a:focus {
    color: #C16D00 !important;
    background-color: #FFFFFF !important;
}
.navbar .nav > li.active > a,
.navbar .nav > li.open > a,
.navbar .nav > li > a:hover,
.navbar .nav > li > a:focus {
    color: #C16D00 !important;
    background-color: #FFFFFF !important;
    border: 0px solid transparent;
    border-color: #AAAAAA #AAAAAA #FFFFFF #AAAAAA;
} 

=> Elles sont défini dans le fichier modeles/peel7/css/screen.css vers la ligne 546.

A vous de modifier ces classes comme vous le souhaitez.

Par ailleurs afin de simplifier les modifications du fichier css, vous pouvez désactiver la minification des fichiers css en modifiant la valeur de la variable minify_css en passant de true à false. Cette variable de configuration est modifiable depuis la page administrer/configuration.php

Share this post


: post
Share on other sites

Posted · Report post

Merci je n'avais pas vu qu'on pouvait ouvrir les codes dans examiner les éléments, dans firefox, pour en voir plus.

Dire que j'ai galéré sans jusque là ...
Merci. J'y retourne.

Share this post


: post
Share on other sites

Posted (edited) · Report post

Bon...

 

Gros souci de mise à jour;

Exemple concret :

- Je supprime tout le contenu de screen.css

- Je fait une modif dans haut.tpl

 

Je place les deux fichiers.

La modification de haut.php est visible

mais quoi que je fasse dans screen.php rien ne se passe.

 

Sauf si je supprime le fichier du serveur.

Je suppose que c'est une histoire de proxy mais je ne comprend pas pourquoi il met à jour le tpl et pas le css :(

 

Je n'ai aucune solution

Edited by anceze

Share this post


: post
Share on other sites

Posted · Report post

Bonjour,

Avez-vous désactivé la minification des fichiers css via la variable de configuration minify_css ? Cela vous permettra de travailler le fichier screen.css plus facilement car ce fichier est mis en cache sur PEEL.Une fois cette modification faite, vous pouvez également vider le cache de votre navigateur et rafraichir la page. A la fin de vos travaux vous pouvez remettre ce paramètre à true, car la minification des fichiers CSS est une optimisation efficace pour accélérer le chargement des pages.

Share this post


: post
Share on other sites

Posted (edited) · Report post

Je viens de le faire

boolean   minify_css  false

 

Je vais voir ce qui se passe maintenant.

Merci de votre aide.

Bonnes journées.

  
Edited by anceze

Share this post


: post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now

Twitter Advisto ecommerce

Facebook PEEL Shopping