GuppY, the benchmark database free CMS

telecharger01.png


You are here :   Welcome » Forum » GuppY 6 » Style texte changement de langue
    Print this page...

Warning: GuppY 6.00.18

GuppY release 6.00.18 : pack, cumulative and non-cumulative patch

To upgrade from 6.00.17 to 6.00.18, you apply the non-cumulative GuppY 6.00.18 patch.

To upgrade from version 5.03.03 to version 6.00.18, you must follow the migration procedure described in this article.


For plugins and skins, please post on the author's website.

The skins and plugins of our friend Saxbar are available for download on this site.


 

Forum - GuppY 6 - Style texte changement de langue


Connected : (nobody)

14/08/2022 @ 18:40
by smr78

Bonsoir,

Je cherche à diminuer la taille de police pour le texte affiché lorsque l'on survole le bord du drapeau de langue, par exemple, lorsque le drapeau français est affiché, le texte est : Le site sera traduit dans la langue secondaire :en

J'ai noté le script qui gère ce texte :

mais je n'arrive pas à repérer dans le code Html des noeuds autour de ce script, dans quel noeud ce texte s'affiche, et donc je ne sais pas modifier son style.

Au minimum, je cherche quelle feuille de style et à quelle ligne je dois faire la modification de police.

Merci beaucoup par avance

  

Answer n° 1
--------
18/08/2022 @ 11:10
by smr78

Bonjour,

J'ai progressé dans mes tests et vu que c'est le script

$(document).ready(function(){           $('.menuiconflag').popover({             title:"Langue",             content:"Le site sera traduit dans la langue secondaire: en",             trigger:"hover",             placement:"auto",             html:true           });         });

qui déclenche l'affichage du texte en question, lorsque l'on survole le drapeau :

En fait, grâce à ce site :

https://getbootstrap.com/docs/5.0/components/popovers/

je vois que le script déclenche un popover et le positionne. Sur le site popovers, je note que l'on peut utiliser des paramètres pour styler le popover :

$popover-font-size

$popover-max-width etc

Je voudrais donc savoir quel est le fichier qui contient le script ci-dessus, et comment lui ajouter les paramètres de largeur, taille de police etc.

Merci par avance

  
Answer n° 2
--------
19/08/2022 @ 10:30
by linuxmr
Administrator
visitor

Bonjour,

il serait bien de cliquer "<>" au niveau de l'éditeur de texte pour ajouter le code.

Maintenant, il faut ajouter dans le styleplus.css de la skin concernée ceci, il faut personnaliser les couleurs, la font et la taille

.popover {
    color: #404040 !important;
    background-color: #FFFFFF !important;
    border-radius: 6px !important;
}
.popover-header {
    color: #000000 !important;
    background-color: #DCD9E0 !important;
    font: normal 14px Verdana, "Bitstream Vera Sans", sans-serif !important;
}
.popover-body {
    color: #404040 !important;
    background-color: green !important;
    font: normal 18px Verdana, "Bitstream Vera Sans", sans-serif !important;
    border-radius: 0 0 6px 6px !important;

Bonne journée.

Linuxmr

  
Answer n° 3
--------
19/08/2022 @ 17:34
by smr78

Bonjour,

pardon pour le "<>" dans l'éditeur du texte ; petit manque dans votre message, il faut terminer la dernière règle par un }

Merci pour votre message qui m'a conduit vers la solution qui me convient ; je cherchais en vain avec le style du lien menuiconflag, en fait le lanceur du message qui apparaît, est bien le popover, et pas besoin de savoir où il est, les règles css que vous donnez, se chargeront de le trouver.

Voici ce que j'ai écrit pour diminuer les polices et la grandeur du message :

.popover {
    position:relative;
    top:0px !important;
    left:-10px !important;
    color: #404040 !important;
    height:25px;
    background-color: lightgrey !important;
    border-radius: 6px !important;
}
.popover-header {
    position:relative;
    top:-10px !important;
    left:0px !important;
    color: #000000 !important;
    font: normal 10px Verdana, "Bitstream Vera Sans", sans-serif !important;
}
.popover-body {
    position:relative;
    top:-20px !important;
    left:0px !important;
    color: #000000 !important;
    background-color: lightgrey !important;
    font: normal 10px Verdana, "Bitstream Vera Sans", sans-serif !important;
    border-radius: 0 0 6px 6px !important;
}

Mille fois mercis

  
Answer n° 4
--------
19/08/2022 @ 20:14
by linuxmr
Administrator
visitor

Cette possibilité de popover est gérée par le plugin de jquery

Le positionnement est mis en auto dans son appel, il ne sert à rien de mettre ces lignes

position:relative;
top:-20px !important;
left:0px !important;

En plus, l"affichage est tronqué d'apres mes tests

  
Answer n° 5
--------
19/08/2022 @ 20:20
by linuxmr
Administrator
visitor

Re,

un oubli de préciser aussi

La ligne conter contenant Border-radius également

  
topic active   topic closed   Important!   New  
Correct message   Close topic   Make sticky topic