RÉSOLU Comment modifier le style par défaut d'un bouton

Olivier Le Boulch

Bonjour,

Quelle est la méthode la plus simple pour modifier le style d'un bouton (Type de visualisation = Bouton)? (Par exemple la couleur de fond)

En positionnant un bouton via l'éditeur, je peux en théorie modifier son style (Arrière plan, classe CSS, styles CSS), mais cela reste pour l'instant sans effet.

Merci

basile

Bonjour @olivier-le-boulch,

Il est possible d'effectuer l'application de tels styles via l'éditeur de styles depuis l'éditeur de tableau de bord.

dans l'élément bouton, ajouter une classe CSS, par exemple : bouton-couleur
dans l'éditeur de tableau de bord, en haut à droite, cliquer sur votre nom d'utilisateur, puis successivement dans les menus contextuels s'affichant : Propriétés et Editeur de styles
dans la feuille de style qui s'affiche, vous pouvez saisir les propriétés CSS suivantes pour configurer la couleur du bouton :

.bouton-couleur input[type=button]{
    /** remplacez ici le code couleur par la couleur souhaitée*/
    background-color: #f06722 !important; 
}

À noter également :

vous pouvez modifier la couleur d'accentuation du tableau de bord (pas seulement les boutons) à l'aide de la règle CSS suivante (voir la documentation à ce sujet)

:root{
     /** remplacez ici le code couleur par la couleur souhaitée*/
    --background-color-select:#f06722 ;
}

vous pouvez modifier l'apparence par défaut de tous les boutons de votre tableau de bord à l'aide la règle CSS suivante :

.dashboard_viewer input[type=button]{
     /** remplacez ici le code couleur par la couleur souhaitée*/
    background-color: #f06722 !important;
}

Basile

basile

Bonjour @olivier-le-boulch,

Il est possible d'effectuer l'application de tels styles via l'éditeur de styles depuis l'éditeur de tableau de bord.

dans l'élément bouton, ajouter une classe CSS, par exemple : bouton-couleur
dans l'éditeur de tableau de bord, en haut à droite, cliquer sur votre nom d'utilisateur, puis successivement dans les menus contextuels s'affichant : Propriétés et Editeur de styles
dans la feuille de style qui s'affiche, vous pouvez saisir les propriétés CSS suivantes pour configurer la couleur du bouton :

.bouton-couleur input[type=button]{
    /** remplacez ici le code couleur par la couleur souhaitée*/
    background-color: #f06722 !important; 
}

À noter également :

vous pouvez modifier la couleur d'accentuation du tableau de bord (pas seulement les boutons) à l'aide de la règle CSS suivante (voir la documentation à ce sujet)

:root{
     /** remplacez ici le code couleur par la couleur souhaitée*/
    --background-color-select:#f06722 ;
}

vous pouvez modifier l'apparence par défaut de tous les boutons de votre tableau de bord à l'aide la règle CSS suivante :

.dashboard_viewer input[type=button]{
     /** remplacez ici le code couleur par la couleur souhaitée*/
    background-color: #f06722 !important;
}

Basile

Olivier Le Boulch

@basile Parfait merci