Changer l'opacité de la boîte de bannière ?

Dev
1

Est-il possible de modifier l’opacité de la boîte de bannière ?

2 « J'aime »
2

@JamesDb

En utilisant le paramètre de thème banner_box_background_color, vous pouvez entrer une valeur rgba(). Vous pouvez utiliser un générateur comme celui-ci et copier-coller la valeur RGBA pour ce paramètre.

Alternativement, vous pouvez ajouter du CSS personnalisé à votre thème pour appliquer la propriété opacity :

.below-site-header-outlet.welcome-link-banner-connector .welcome-wrapper {
    opacity: 0.5; // utilisez une valeur entre 0 et 1
}

Bien que l’approche CSS ci-dessus modifie également l’opacité du contenu (réduisant ainsi l’opacité du texte).

2 « J'aime »
3

Y a-t-il un moyen de conserver la variable, par exemple var(--secondary), mais d’y ajouter une opacité ?

Parce que je veux qu’elle s’adapte aux modes clair et sombre

Modification : J’ai déjà essayé rgba(var(--secondary), 0.5)

2 « J'aime »
4

Je pense que cela devrait fonctionner (bien que je ne l’aie pas testé) :

rgba(--var(--secondary-rgb), 0.5)
1 « J'aime »
5

Ça ne fonctionne pas. Ça enlève complètement la couleur.

1 « J'aime »
6

Hmm, je vois pourquoi. Le code doit utiliser la propriété background-color pour cela, mais il utilise background.

Si vous ajoutez ceci à votre CSS de thème, cela devrait fonctionner :


.below-site-header-outlet.welcome-link-banner-connector .welcome-wrapper {
    background-color: rgba(var(--secondary-rgb), 0.5);
}
3 « J'aime »
7

Génial, ça a fonctionné merci !

3 « J'aime »
8

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.