Tag-Banner-Plugin und Material-Theme im Dark Mode

Unterstützung
1

Hallo,

ich verwende das Tag-Banners-Plugin. Es hardcodiert primary-very-low als Hintergrundfarbe für alle Banner, was im Dunkelmodus derselben Farbe wie der Text entspricht. Das Standard-Material-Theme verwendet korrekt var(--secondary), das im Dunkelmodus auf Dunkel umschaltet. Gibt es eine einfache Möglichkeit, den Hintergrund unserer Tag-Banner zu beheben?

Im Wesentlichen möchte ich, dass der gerenderte CSS-Code Folgendes verwendet:

 .tag-title-header {
-  background: #f8f8f8;
+  background-color: var(--secondary);
 }

Vielen Dank.

2

Wie man den Stil des Tag-Banners ändert, wird hier erklärt: Tag Banners

Sie können den Hintergrund über den CSS-Editor auf Ihrer Website ändern. Gehen Sie zu admin/customize/themes/1/common/scss/edit und fügen Sie dort Ihren CSS-Code hinzu:

Screenshot_2021-05-27 Admin - Constanza Is Testing Hosted Discourse(1)
Screenshot_2021-05-27 Admin - Constanza Is Testing Hosted Discourse(1)1110×263 21.1 KB

Zum Beispiel habe ich Folgendes verwendet:

[class*="tag-title-header"][class*=" tag-banner-"] {
  background-color: var(--secondary);
}

Mit Attributselektoren, sodass der Hintergrund bei allen Tags geändert wird. Sie können jedoch auch einen Tag-Namen in der Klasse angeben, damit der Hintergrund nur für diesen einen Tag geändert wird.

3

Wir sollten das auch im Theme selbst beheben, jetzt wo wir CSS-Variablen unterstützen :slight_smile:

4

Vielen Dank an euch beide! Ich habe eine lokale Theme-Komponente erstellt und dort das CSS geändert!