请求主题的 CSS 标识符,主题组件(插件也是?)

我的主题组件使用对象作为设置,并提供了不少字段。

当前应用于对象设置的网格样式对垂直选项卡列和模式字段使用了非常窄的列。

我想为对象设置提供一个替代的显示方式,但我看不到一种方法可以引入仅针对我的主题组件更改设置的方式;我不想将我的 CSS 覆盖全局应用于所有主题。

Discourse 是否有可能为每个主题和主题组件在 DOM 中添加一个 CSS 标识符,以便可以添加不同的 CSS 规则来定位特定的主题设置页面?

这是我在我的站点上使用的简单 CSS 覆盖,它被全局应用:

.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;
}

默认样式和覆盖后的样式:

5 个赞