Mein Theme-Komponente verwendet Objekte für die Einstellungen und bietet eine ganze Reihe von Feldern.
Die aktuell auf die Objekt-Einstellungen angewendeten Rasterstile verwenden sehr schmale Spalten für die Spalte der vertikalen Tabs und die Schemafelder.
Ich wollte eine alternative Anzeige für die Objekt-Einstellungen anbieten, konnte aber keinen Weg finden, eine Möglichkeit einzuführen, Einstellungen nur für meine Theme-Komponente zu ändern; ich möchte meine CSS-Überschreibungen nicht global für alle Themes anwenden.
Könnte Discourse möglicherweise einen CSS-Bezeichner (Identifier) im DOM für jedes Theme und jede Theme-Komponente hinzufügen, damit unterschiedliche CSS-Regeln hinzugefügt werden können, die auf die spezifischen Theme-Einstellungsseiten abzielen?
Hier ist die einfache CSS-Überschreibung, die ich auf meiner Seite verwende und die global angewendet wird:
.schema-setting-editor .schema-setting-editor__wrapper {
grid-template-columns: minmax(15em, 0.3fr) 1fr;
gap: 0 3rem;
}
.schema-setting-editor .schema-field {
grid-template-columns: 1fr;
gap: 0;
background-color: var(--tertiary-100);
padding: 1rem 5px;
}
Die Standard- und die überschriebenen Stile:
