feat(theme): 添加自定义毛玻璃和卡片样式配置选项
Discourse Theme / ci (push) Failing after 1s

- 在 head_tag.html 中添加条件样式块以支持毛玻璃效果
- 移除 scss/self.scss 中的硬编码卡片样式规则
- 在 settings.yml 中添加 extra_glass_morphism_selectors 配置项
- 在 settings.yml 中添加 extra_card_item_selectors 配置项
- 实现通过设置控制的动态 CSS 样式应用
- 支持自定义选择器列表进行毛玻璃和卡片样式的灵活配置
This commit is contained in:
2026-02-26 15:02:05 +08:00
parent 7f87145998
commit c567a2d1e1
3 changed files with 56 additions and 18 deletions
+29
View File
@@ -5,3 +5,32 @@
'The Horizon theme does not support your browser. Please update your browser, or <a href="?safe_mode=no_themes">switch to safe mode</a>.';
}
</script>
{{#if settings.extra_glass_morphism_selectors}}
<style>
{{settings.extra_glass_morphism_selectors}} {
background-color: #ffffffa8 !important;
border-radius: var(--d-border-radius);
backdrop-filter: blur(32px);
box-shadow: #00000077 0 0 19px 0;
padding: 24px;
}
</style>
{{/if}}
{{#if settings.extra_card_item_selectors}}
<style>
{{settings.extra_card_item_selectors}} {
background: var(--d-chat-input-bg-color);
border-radius: var(--d-border-radius);
box-shadow: #00000024 0 0 7px 2px;
margin: 10px 0;
position: relative;
padding: 16px 12px;
overflow: hidden;
transition: background-color 0.2s ease-in-out;
}
{{settings.extra_card_item_selectors}}:hover {
background-color: var(--accent-text-color);
}
</style>
{{/if}}