Gavick Highlight GK5 Couleur lien

Réduire
X
Réduire
 
  • Page sur 1
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages
Précédent template Suivant
  • #1

    Gavick Highlight GK5 Couleur lien

    Hello,

    J'ai installer récemment le Hightlight de chez Gavick (https://www.gavick.com/news-highlighter), je n'ai pas vraiment de soucis, mais j'aimerai changer la couleur des liens mais j'ai beau tout essayer, surement mal, je n'y parviens pas...

    Voici mon site, le Hightlight se trouve juste en-dessous du menu, j'aimerai changer la couleur des liens en blanc:
    DRIVE Radio - The Radical place!
    http://driveradio.be/
    DRIVE Radio is the go-to destination for fans of synthwave, retrowave, and outrun music. Our online radio station delivers a constant stream of nostalgic tunes, perfect for cruising the neon-lit streets of the 80s and beyond. Tune in now for the ultimate retro-futuristic music experience.


    Et voici le CSS du module

    Code:
    /* General */

a:active, a:focus { outline:0; }
.gkHighlighterGK5 { position:relative; width: 100%; }
/* Interface */

.gkHighlighterInterface { float:left; padding: 7px }
.gkHighlighterInterface[data-pos="right"] { float: right; }
.gkHighlighterInterface span.text { display:block; float:left; margin:0 6px 0 7px; font-size: 14px; font-weight: bold; text-transform: uppercase; line-height: 18px; }
.gkHighlighterInterface div { float:left; width:auto; }
.gkHighlighterInterface div a { display:block; float:left; height:13px; width:13px; margin: 2px 0 0 2px; background:transparent url('../images/interface.png') no-repeat 0 0; cursor:pointer; }
.gkHighlighterInterface div a.prev { }
.gkHighlighterInterface div a.next { background-position: right 0; }
.gkHighlighterInterface div a.prev:hover { background-position: 0 bottom; }
.gkHighlighterInterface div a.next:hover { background-position: right bottom; }


/* Items */
.gkHighlighterWrapper { position: relative}
.gkHighlighterWrapperSub {
	position: relative;
	min-height: 30px;
	opacity: 1;
}
.gkHighlighterWrapper .nowrap { width: 100000px; position: absolute; left: -99999em; }
.gkHighlighterWrapper .gkHighlighterItem { position: absolute; top:0; width:100%; left:0;padding-top:3px;text-transform:uppercase;}

.gkHighlighterWrapper a:link {color:#FFF;} .gkHighlighterItem a:link .gkHighlighterItem span {color:#FFF;}

.gkHighlighterWrapper .gkHighlighterItem.gk-active {
	z-index: 100;
}

@-webkit-keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
    
    40% {
        -webkit-transform: perspective(400px) rotateX(-10deg);
    }
    
    70% {
        -webkit-transform: perspective(400px) rotateX(10deg);
    }
    
    100% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}
@-moz-keyframes flipInX {
    0% {
        -moz-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
    
    40% {
        -moz-transform: perspective(400px) rotateX(-10deg);
    }
    
    70% {
        -moz-transform: perspective(400px) rotateX(10deg);
    }
    
    100% {
        -moz-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}
@-o-keyframes flipInX {
    0% {
        -o-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
    
    40% {
        -o-transform: perspective(400px) rotateX(-10deg);
    }
    
    70% {
        -o-transform: perspective(400px) rotateX(10deg);
    }
    
    100% {
        -o-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}
@keyframes flipInX {
    0% {
        transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
    
    40% {
        transform: perspective(400px) rotateX(-10deg);
    }
    
    70% {
        transform: perspective(400px) rotateX(10deg);
    }
    
    100% {
        transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}

.gkHighlighterItem.flipInX {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipInX;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipInX;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipInX;
	backface-visibility: visible !important;
	animation-name: flipInX;
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@-moz-keyframes flipOutX {
    0% {
        -moz-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        -moz-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@-o-keyframes flipOutX {
    0% {
        -o-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        -o-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@keyframes flipOutX {
    0% {
        transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}
.gkHighlighterItem {
	-webkit-animation-fill-mode: both;
	   -moz-animation-fill-mode: both;
	     -o-animation-fill-mode: both;
	        animation-fill-mode: both;
}
.gkHighlighterItem.flipOutX {
	-webkit-animation-name: flipOutX;
	-webkit-backface-visibility: visible !important;
	-moz-animation-name: flipOutX;
	-moz-backface-visibility: visible !important;
	-o-animation-name: flipOutX;
	-o-backface-visibility: visible !important;
	animation-name: flipOutX;
	backface-visibility: visible !important;
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-moz-transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-o-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-o-transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.gkHighlighterItem.fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
	opacity: 1!important;
	filter: alpha(opacity=100)!important;
}
.invisible {
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
@-webkit-keyframes fadeOutLeft {
	0% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
	}
}

@-moz-keyframes fadeOutLeft {
	0% {
		opacity: 1;
		-moz-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateX(-20px);
	}
}

@-o-keyframes fadeOutLeft {
	0% {
		opacity: 1;
		-o-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateX(-20px);
	}
}

@keyframes fadeOutLeft {
	0% {
		opacity: 1;
		transform: translateX(0);
	}

	100% {
		opacity: 0;
		transform: translateX(-20px);
	}
}

.gkHighlighterItem.fadeOutLeft {
	-webkit-animation-name: fadeOutLeft;
	-moz-animation-name: fadeOutLeft;
	-o-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

@-webkit-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@-moz-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@-o-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

.gkHighlighterItem.fadeIn {
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
@-webkit-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-moz-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-o-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

.gkHighlighterItem.fadeOut {
	-webkit-animation-name: fadeOut;
	-moz-animation-name: fadeOut;
	-o-animation-name: fadeOut;
	animation-name: fadeOut;
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

/* 3d rotating bar */ 
.bar {
	width: 100%px;
	height: 40px;
	position: relative;
	     
  -webkit-perspective: 1100px;
     -moz-perspective: 1100px;
     -ms-perspective: 1100px;
       -o-perspective: 1100px;
          perspective: 1100px;
}
.bar .gkHighlighterWrapperSub {
	width: 100%;
	height: 100%;
	position: absolute;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
	
}

.bar .gkHighlighterItem {
	display: block;
	position: absolute;
	width: 100%;
	height: 40px;
	left: 0px;
	top: 0px;
	-webkit-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased
}
.bar .gkHighlighterItem.gkHidden {
	opacity: 0;
	display: none;
}

.bar .gkHighlighterItem.front { 
 -webkit-transform: rotateX(0deg) translateZ(20px); 
	-moz-transform: rotateX(0deg) translateZ(20px); 
	  -o-transform: rotateX(0deg) translateZ(20px); 
	     transform: rotateX(0deg) translateZ(20px);
}
.bar .gkHighlighterItem.bottom { 
 -webkit-transform: rotateX(90deg) translateZ(20px);
	-moz-transform: rotateX(90deg) translateZ(20px); 
	  -o-transform: rotateX(90deg) translateZ(20px); 
	     transform: rotateX(90deg) translateZ(20px); 
}
.bar .gkHighlighterItem.back { 
 -webkit-transform: rotateX(180deg) translateZ(20px); 
	-moz-transform: rotateX(180deg) translateZ(20px); 
	  -o-transform: rotateX(180deg) translateZ(20px); 
	     transform: rotateX(180deg) translateZ(20px); 
}
.bar .gkHighlighterItem.top { 
 -webkit-transform: rotateX(270deg) translateZ(20px);
	-moz-transform: rotateX(270deg) translateZ(20px); 
	  -o-transform: rotateX(270deg) translateZ(20px); 
	     transform: rotateX(270deg) translateZ(20px); 
}
    Merci par avance pour votre aide!

    Bien à vous,
    Nesto
    Mon site (J!3) : http://driveradio.be/
    Tags: Aucun
  • #2
    Re : Gavick Highlight GK5 Couleur lien

    Bonjour,

    Essayez d'ajouter a:hover {color : white; }

    Pascal
    If anything can go wrong, it will...If I can help, I will ..https://conseilgouz.com

    Commentaire

    • #3
      Re : Gavick Highlight GK5 Couleur lien

      Envoyé par pmleconte Voir le message
      Bonjour,

      Essayez d'ajouter a:hover {color : white; }

      Pascal
      C'est un peu vague dit comme ça , puis je veux que le lien devient blanc, pas uniquement au survol.
      Mon site (J!3) : http://driveradio.be/

      Commentaire

      • #4
        Re : Gavick Highlight GK5 Couleur lien

        Bonjour,

        C'est au niveau du template CSS, dans les lignes 1535 et suivantes qu'est définie votre couleur bleue. Je ne sais pas si c'est en dur ou si cela vient d'un paramètre.

        Désolé pour ma 1ère réponse, mais, en regardant votre site, c'était uniquement le rouge qui me gênait.

        Pascal
        If anything can go wrong, it will...If I can help, I will ..https://conseilgouz.com

        Commentaire

        • #5
          Re : Gavick Highlight GK5 Couleur lien

          Re-bonsoir,

          Après un petit test, ces couleurs sont celles communes à tous les liens de votre template. Donc, si vous faites la modification que je vous ai indiqué, cela va être le bazar.

          Donc, un peu de patience, on cherche encore....

          Pascal
          If anything can go wrong, it will...If I can help, I will ..https://conseilgouz.com

          Commentaire

          • #6
            Re : Gavick Highlight GK5 Couleur lien

            Donc, résultat d'un petit test:

            ajouter une ligne du type
            .gkHighlighterGK5 a {color : white}

            dans le fichier modules\mod_highlighter_gk5\interface\css\style.cs s devrait faire l'affaire.

            Pascal
            If anything can go wrong, it will...If I can help, I will ..https://conseilgouz.com

            Commentaire

            • #7
              Re : Gavick Highlight GK5 Couleur lien

              Envoyé par pmleconte Voir le message
              Donc, résultat d'un petit test:

              ajouter une ligne du type
              .gkHighlighterGK5 a {color : white}

              dans le fichier modules\mod_highlighter_gk5\interface\css\style.cs s devrait faire l'affaire.

              Pascal
              J'avais déjà essayer ça mais sa ne changeait rien, du coup j'ai modifier le css du template même, mais merci pour ton aide!
              Mon site (J!3) : http://driveradio.be/

              Commentaire

              • #8
                Re : Gavick Highlight GK5 Couleur lien

                En fait, votre template "reprend la main" sur le paramétrage du Gavick Highlight GK5 au niveau du paramétrage du "a".

                Avez-vous un custom.css dans ce template pour contenir vos spécifiques ? si oui, vous devriez pouvoir y inclure la ligne que je vous proposais. Si non, modification du template.css à faire.

                Bonne continuation,

                Pascal
                If anything can go wrong, it will...If I can help, I will ..https://conseilgouz.com

                Commentaire

                Précédent template Suivant

                Annonce

                Réduire
                Aucune annonce pour le moment.

                Partenaire de l'association

                Réduire
                Hébergeur Web PlanetHoster
                Travaille ...
                X