Verwendung von Discourse-Thema-Farbvariablen in benutzerdefiniertem Theme-Komponenten?

Ist es möglich, auf Discourse-Theme-Farbvariablen in meiner eigenen Theme-Komponente zuzugreifen?

Ich versuche, Variablen wie --secondary in meinem CSS zu verwenden, und es scheint nicht zu funktionieren.

2 „Gefällt mir“

Ja, Sie sollten über ein Theme oder eine Theme-Komponente auf die native CSS-Variablen von Core zugreifen können :+1:

z.B.

body {
  background-color: var(--secondary);
}

Könnten Sie ein Beispiel teilen, das nicht funktioniert?

5 „Gefällt mir“

Ach! Ich habe var() nicht verwendet

2 „Gefällt mir“

Ich habe ständig Probleme dieser Art. Sicher, es ist „offensichtlich“, var zu verwenden, aber nur, wenn man es weiß und sich daran erinnern kann!

Ich warte auf etwas, das ausgeführt wird, und habe daher aus Neugier https://ask.discourse.com/ überprüft und gefragt: „Ist es möglich, Discourse-Theme-Farbvariablen in meiner eigenen Theme-Komponente abzurufen?“ und siehe da! Ich habe das hier bekommen:

  1. Verfügbare Farbvariablen:
    Discourse bietet mehrere vordefinierte CSS-benutzerdefinierte Eigenschaften für Farben, wie zum Beispiel:

    var(--primary)
    var(--secondary)
    var(--tertiary)
    var(--quaternary)
    var(--header_background)
    var(--header_primary)
    var(--highlight)
    var(--danger)
    var(--success)
    var(--love)
    
    
  2. Beispielverwendung:
    Sie können diese Variablen in Ihrem CSS verwenden, um sicherzustellen, dass Ihr Theme an verschiedene vom Benutzer ausgewählte Farbschemata angepasst wird. Zum Beispiel:

    body {
        background: var(--highlight);
    }
    
1 „Gefällt mir“

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