Personnalisation de l'interface public du module ticket

Bonjour à tous,
Je suis tout nouveau sur le forum, j’espère avoir mis ma question dans la bonne catégorie.

Alors voilà, j’ai configuré mon dolibarr sur un hébergement mutualisé chez hostinger et j’ai installé la version 19.0.2.
Tous fonctionne parfaitement bien.

Ma question concerne l’interface public du module Ticket. J’aimerais pouvoir modifier l’apparence de la page pour que ça puisse ressembler le plus possible aux couleurs de mon site internet.
Est-ce que c’est possible ?
J’avais pour piste de modifier le fichier CSS de la page mais je ne le trouve pas :sweat_smile:

Si quelqu’un a des pistes ou des solutions je suis preneur :grin:

Bonjour
…/htdocs/ticket/css/style.css.php
Cdt

Merci pour la réponse.
Je vais tester de modifier ce fichier et je vous tiens au courant.

attention, si on modifie …/htdocs/ticket/css/style.css.php, à la prochaine mise à jour de Dolibarr, tout saute …

Il y a peu être moyen de faire autrement alors ?

Le fait de modifier le fichier CSS à cette adresse ne change rien …htdocs/ticket/css/style.css.php

Cependant après plusieurs heures de recherche j’ai trouvé la solution, les couleurs sont référencée dans le dossier du thème qui est actif. Donc pour réussir a modifier les couleurs de l’interface public. Il faut modifier le thème de dolibarr.

Donc problème résolu pour l’instant.
Je pense qu’il doit y avoir des tuto ou des sujets qui traite de ça.

Merci de m’avoir mis sur la piste en tout cas :grin:

Bonjour,
Y-a-t’il une façon simple de passer la fenêtre de saisie en mode sombre aussi ?


merci

Bonjour, oui il suffit de mettre dolibarr en mode sombre pour que l’interface public passe aussi en mode sombre.
Voilà ce que ça donne en modifiant le style css :

Merci,
mais l’interface sombre est bien activée, c’est dans l’interface ‹ créer ticket › et les autres que l’espace de saisie est blanc, j’aimerais inverser.


Alors là j’admets j’ai galéré à trouver la solution, mais en observant les variables utiliser (avec la touche F12).
Jai pu faire ce code dans :

Configuration > Affichage > Style CSS

Colle ça et change les couleurs pour que ça colle avec ton design

:root {
    --butactionbg: rgba(15,155,0,1);
    --fieldrequiredcolor: rgba(15,155,0,1);
}
.badge-status7 {
    color: #999999 !important;
}
#form_create_ticket, #form_view_ticket {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 1em;
    padding-right: 1em;
    padding-top: 1.5em;
    padding-bottom: 12px;
    border: 1px solid #1d1e20 !important;
    background-color: #1d1e20 !important;
    -moz-box-shadow: 4px 4px 4px #1d1e20 !important;
    -webkit-box-shadow: 4px 4px 4px #1d1e20 !important;
    box-shadow: 4px 4px 4px #1d1e20 !important;
    border-radius: 8px;
    border: solid 1px #1d1e20 !important;
    border-top: solid 1px #1d1e20 !important;
    background-color: #1d1e20 !important;
}
1 « J'aime »

excellent !
merci beaucoup :slight_smile:

1 « J'aime »

Hey, bravo ! Je suis vraiment content de voir que ça sert :slight_smile:

1 « J'aime »

N’hésite pas a publier le résultat quand tu auras fini :grin:


le code CSS (pour info tout le monde : il s’agit de 2 tirets - - sans espace):
:root {
–butactionbg: rgba(0,153,51,1);
–fieldrequiredcolor: rgba(0,153,51,1);
}
.badge-status7 {
color: #999999 ;
}
#form_create_ticket, #form_view_ticket {
margin-left: 10px;
margin-right: 10px;
padding-left: 1em;
padding-right: 1em;
padding-top: 1.5em;
padding-bottom: 12px;
border: 1px solid #1d1e20 ;
background-color: #1d1e20 ;
–moz-box-shadow: 4px 4px 4px #1d1e20 ;
–webkit-box-shadow: 4px 4px 4px #1d1e20 ;
box-shadow: 4px 4px 4px #1d1e20 ;
border-radius: 8px;
border-top: solid 1px #1d1e20 ;
}

Bonjour,

Il faut utiliser la balise « texte préformaté » </> pour publier du code

:root {
    --butactionbg: rgba(15,155,0,1);
    --fieldrequiredcolor: rgba(15,155,0,1);
}
.badge-status7 {
    color: #999999 !important;
}
#form_create_ticket, #form_view_ticket {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 1em;
    padding-right: 1em;
    padding-top: 1.5em;
    padding-bottom: 12px;
    border: 1px solid #1d1e20 !important;
    background-color: #1d1e20 !important;
    -moz-box-shadow: 4px 4px 4px #1d1e20 !important;
    -webkit-box-shadow: 4px 4px 4px #1d1e20 !important;
    box-shadow: 4px 4px 4px #1d1e20 !important;
    border-radius: 8px;
    border: solid 1px #1d1e20 !important;
    border-top: solid 1px #1d1e20 !important;
    background-color: #1d1e20 !important;
}
2 « J'aime »

merci @Eve63 je modifie de suite :slight_smile:

:root {
--butactionbg: rgba(0,153,51,1);
--fieldrequiredcolor: rgba(0,153,51,1);
}
.badge-status7 {
color: #999999 ;
}
#form_create_ticket, #form_view_ticket {
margin-left: 10px;
margin-right: 10px;
padding-left: 1em;
padding-right: 1em;
padding-top: 1.5em;
padding-bottom: 12px;
border: 1px solid #1d1e20 ;
background-color: #1d1e20 ;
--moz-box-shadow: 4px 4px 4px #1d1e20 ;
--webkit-box-shadow: 4px 4px 4px #1d1e20 ;
box-shadow: 4px 4px 4px #1d1e20 ;
border-radius: 8px;
border-top: solid 1px #1d1e20 ;
}

Bonjour,
désolé je reviens à nouveau car j’aimerais modifier le « .badge-status3 ».
Il s’agit de la couleur de police de « Attente retour demandeur » ou de la couleur de surlignage. Car pour le moment la police est sombre sur fond sombre.
image
image
La couleur de l’encadrement est #bca52b (rgb(188,165,43)) et la police #202327 (rgb(32, 35, 39)) si ça peut aider.
Ce n’est pas urgent ni primordial…

merci :slight_smile:

Bonjour,

il suffit juste de rajouter dans Configuration > Affichage > Style CSS

.badge-status3 {
    color: #dcdcdc !important; /*Couleur du texte*/
    border-color: #bca52b !important; /*Couleur de l'encadrement*/
}

dans le mode sombre du thème Eldy il y a plein de petit bug visuel comme celui la que je découvre au fur et à mesure. Donc il faut juste rajouter des petites lignes dans le style css pour les corriger.

1 « J'aime »

Merci encore @argoufra,
c’est aussi ce que j’avais fait mais cela ne change rien. J’ai mis ces lignes avant le badge-status7, je n’ai pas d’erreur dans la fenêtre de saisie CSS.
Tu arrives à modifier la couleur de la police du badge-status3 toi ?

edit : quand je copie colle ton code cela fonctionne, je n’avais pas mis « !important »
Donc ça fonctionne, merci !

1 « J'aime »

Super ! je suis content de voir que ça fonctionne :grinning:

je ne mis connait pas du tout en CSS mais en observant avec la fonction F12 j’ai cru comprendre que !important permet de prioriser la couleur par rapport aux autres fichiers CSS. Donc si on ne l’ajoute pas c’est la couleur par défaut qui est prioritaire.

1 « J'aime »