commit 285cad7d8b282d0364aa95b6f75c64c53176eb08 Author: cyriusweng Date: Wed Jul 15 16:16:08 2026 +0800 Initial release Co-Authored-By: Claude Opus 4.8 (1M context) diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..6d5bf11 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2026 Cyrius + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..bc52334 --- /dev/null +++ b/README.md @@ -0,0 +1,52 @@ +# Opal Theme + +A comprehensive, accessibility-checked theme for Obsidian, with a dual light/dark flavour and ~82 Style Settings controls. Opal descends from the Catppuccin Mocha lineage but re-tunes every hue into a muted-macaron palette with zero-duplication element roles, and covers reading view **and** Live Preview at parity. + +一套「集大成」的 Obsidian 主题：浅深双 flavour、约 82 个 Style Settings 可调项、阅读态与实时预览同等覆盖，配色经过 WCAG 对比度核算。源自 Catppuccin Mocha，但把每个色相重新调成柔和马卡龙盘，元素角色零重复。 + +--- + +## Highlights / 特性 + +- **Dual flavour** — hand-tuned light and dark palettes, WCAG-checked (body text ≥ 4.5:1, decorative elements ≥ 3:1 in both modes). +- **~82 Style Settings controls** in 8 groups: colour, fonts, per-level headings, layout, borders & lines, element toggles, skins & motion, print. Every control has a plain-language description. +- **Reading + editor parity** — headings, dividers, tags, highlights, callouts, tables, task states, blockquotes and more are styled in Live Preview too, not just reading view. +- **Native feature coverage** — Bases, Canvas (6-colour mapping + accent bars + dashed group boxes), Properties, command palette, graph view, tab bar, ribbon, inline title, footnotes, status bar, tooltips. +- **Plugin adaptations** — editing-toolbar, Calendar, Admonition, Timeline, and more, wired through each plugin's own CSS-variable interface (upgrade-safe). +- **Callout Chinese aliases** — `[!笔记] [!警告] [!提示] [!成功] [!危险]` … map onto the semantic colours. +- **Robust by design** — every advanced feature (`color-mix`, `oklch`, `corner-shape`, `:has`) has an `@supports` fallback; honours `prefers-reduced-motion` and `prefers-reduced-transparency`; full `@media print` reset for clean PDF export. + +## Requirements / 依赖 + +- **Obsidian** 1.5.0+. +- **[Style Settings](https://github.com/mgmeyers/obsidian-style-settings)** plugin — required to reach the ~82 configuration controls. The theme renders correctly with sensible defaults even without it, but the knobs live in Style Settings. + +## Fonts / 字体 + +Opal ships **no bundled fonts** — it uses your system fonts by default and exposes four editable font-family controls (body / heading / code / interface) in Style Settings. Screenshots may show the author's own font choices; swap them freely without affecting anything else. + +Opal 不打包任何字体：默认用系统字体，并在 Style Settings 里开放正文/标题/代码/界面四个可自定义字族。示例截图可能用的是作者自己设的字体，你可随意替换，不影响其它。 + +## Install / 安装 + +Manual: copy the `Opal Theme` folder into `/.obsidian/themes/`, then **Settings → Appearance → Themes → Opal Theme**. After editing the CSS externally, switch themes away and back (or reload) so Obsidian re-reads it. + +手动安装：把 `Opal Theme` 文件夹放进 `<库>/.obsidian/themes/`，然后「设置 -> 外观 -> 主题 -> Opal Theme」。外部改过 CSS 后，切主题来回一次（或重载）让 Obsidian 重新读取。 + +## Companion plugin (optional) / 配套插件（可选） + +**Opal Companion** is a small optional plugin that adds a visual picker for the per-note things you'd otherwise type by hand: page states / accent recolour / layout via `cssclasses`, callouts, coloured highlights, task states, and image layouts. Each option renders a live preview before you pick it. The theme is fully usable without it. + +**Opal Companion** 是配套小插件：把「每次用时要手打」的东西（页面态/换色/布局 `cssclasses`、callout、彩色高亮、任务态、图片版式）做成可视预览面板，看到效果再点选。主题不装它也完整可用。 + +## Style Settings groups / 配置分组 + +配色 · 字体 · 标题分级（H1-H6 逐级字号/字重/颜色）· 布局尺寸（行宽/间距/缩进/图片）· 界面线条与边框 · 元素开关 · 皮肤与动效（Callout 皮肤、界面设计语言、复古皮肤、动效、入场）· 打印导出。 + +## Credits / 致谢 + +Palette lineage inspired by [Catppuccin](https://github.com/catppuccin/catppuccin). Built for personal use, shared as-is. + +## License + +MIT © Cyrius. See [LICENSE](LICENSE). diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..2b28fbe --- /dev/null +++ b/manifest.json @@ -0,0 +1,7 @@ +{ + "name": "Opal Theme", + "version": "2.1.0", + "minAppVersion": "1.5.0", + "author": "Cyrius", + "authorUrl": "https://github.com/cyriusweng" +} \ No newline at end of file diff --git a/theme.css b/theme.css new file mode 100644 index 0000000..d7a71a4 --- /dev/null +++ b/theme.css @@ -0,0 +1,1559 @@ +/* ===================================================================== + Opal Theme · v2.0（满配：约 90 个可调控件 + 界面线条/边框全覆盖） + Opal 配色（浅深双 flavour）+ 559 主题精华。 + 轴一：审美路线（class-select）。轴二：自定义输入与数值微调（本版补齐）。 + 健壮性：每个变量项都带默认兜底；@supports / reduced-motion / reduced-transparency / 打印复位。 + ===================================================================== */ + +/* @settings +name: Opal Theme +id: opal-theme +settings: + - + id: opal-h-color + title: 配色 + type: heading + level: 1 + - + id: opal-accent + title: 主强调色 + description: 链接、选中、焦点等核心交互色。 + type: variable-themed-color + format: hex + opacity: false + default-light: '#4C50C8' + default-dark: '#8098FF' + - + id: opal-accent-2 + title: 副强调色 + description: 第二强调色，用于次级高亮、渐变的另一端。默认青。 + type: variable-themed-color + format: hex + opacity: false + default-light: '#127367' + default-dark: '#82D9C8' + - + id: opal-accent-saturation + title: 强调色鲜艳度 + description: 1=原样，小于 1 更灰更沉，大于 1 更艳。老引擎不支持时自动忽略。 + type: variable-number-slider + default: 1 + min: 0.4 + max: 1.6 + step: 0.05 + - + id: opal-tone-light + title: 浅色底色温 + description: 给浅色背景掺入的色调（暖灰选桃、冷灰选蓝、紫灰选紫）。要配合下面的强度才生效。 + type: variable-themed-color + format: hex + opacity: false + default-light: '#EDEFF4' + default-dark: '#EDEFF4' + - + id: opal-tone-dark + title: 深色底色温 + description: 给深色背景掺入的色调。要配合下面的强度才生效。 + type: variable-themed-color + format: hex + opacity: false + default-light: '#20232E' + default-dark: '#20232E' + - + id: opal-tone-strength + title: 底色温强度 + description: 上面色温掺进背景的比例。0=纯中性灰（默认），越大染色越明显。 + type: variable-number-slider + default: 0 + min: 0 + max: 18 + step: 1 + format: '%' + - + id: opal-surface-contrast + title: 面板分层强度 + description: 侧栏/卡片这些「面」相对正文背景的明暗差。100=正常分层（默认），越小越扁平、越贴近背景。 + type: variable-number-slider + default: 100 + min: 40 + max: 100 + step: 5 + format: '%' + - + id: opal-code-bg + title: 代码块底色 + type: variable-themed-color + format: hex + opacity: false + default-light: '#E2E5EE' + default-dark: '#2B2F3C' + - + id: opal-mark-bg + title: 高亮主色 + description: 荧光笔高亮的基准色（波浪线/辉光都取自它）。 + type: variable-themed-color + format: hex + opacity: false + default-light: '#F6E1A2' + default-dark: '#EBD08A' + - + id: opal-mark-style + title: 高亮风格 + description: 霓虹波浪=波浪下划线+辉光（默认）。纯色底=传统荧光块。柔和底=淡色块。裁字=只给字上色。 + type: class-select + allowEmpty: false + default: opal-mark-wave + options: + - label: 霓虹波浪 + value: opal-mark-wave + - label: 纯色底块 + value: opal-mark-fill + - label: 柔和底块 + value: opal-mark-soft + - label: 霓虹裁字 + value: opal-mark-text + - + id: opal-heading-scheme + title: 标题配色 + description: 彩虹多色=每级一色（默认）。同色渐变=一色族由亮到暗。单色=都用主色。逐级自定=用下面 6 个色钮。关闭=退回正文色。 + type: class-select + allowEmpty: false + default: opal-h-rainbow + options: + - label: 彩虹多色 + value: opal-h-rainbow + - label: 同色渐变 + value: opal-h-mono + - label: 单色 + value: opal-h-single + - label: 逐级自定 + value: opal-h-custom + - label: 关闭分级上色 + value: opal-h-plain + - + id: opal-tag-scheme + title: 标签配色 + description: 首字母伪哈希=按标签首字母散成 26 色（默认）。语义=只给紧急/完成等词库上色，其余统一。单色=统一。 + type: class-select + allowEmpty: false + default: opal-tag-hash + options: + - label: 首字母伪哈希 + value: opal-tag-hash + - label: 语义词库 + value: opal-tag-semantic + - label: 单色统一 + value: opal-tag-mono + - + id: opal-unresolved-link + title: 未创建笔记的链接样式 + description: 指向还不存在笔记的链接怎么显示。虚线（默认）/ 变灰 / 模糊 / 加问号角标。 + type: class-select + allowEmpty: false + default: opal-unres-dash + options: + - label: 虚线下划 + value: opal-unres-dash + - label: 变灰 + value: opal-unres-dim + - label: 模糊 + value: opal-unres-blur + - label: 问号角标 + value: opal-unres-badge + - + id: opal-h-font + title: 字体 + type: heading + level: 1 + - + id: opal-font-text + title: 正文字体 + description: 填字体名即可（多个用英文逗号隔开）。把 Inter 换成你要的，如 Beiruti。后面自动接系统中文兜底。 + type: variable-text + default: Inter + - + id: opal-font-heading + title: 标题字体 + description: 标题专用字体。留 Inter 或换成你的展示字体。 + type: variable-text + default: Inter + - + id: opal-font-code + title: 代码/等宽字体 + type: variable-text + default: JetBrains Mono + - + id: opal-font-ui + title: 界面字体 + description: 侧栏、菜单、标签页等界面文字的字体。 + type: variable-text + default: Inter + - + id: opal-font-size + title: 正文字号 + type: variable-number-slider + default: 16 + min: 12 + max: 22 + step: 1 + format: px + - + id: opal-line-height + title: 正文行高 + type: variable-number-slider + default: 1.5 + min: 1.2 + max: 2.2 + step: 0.05 + - + id: opal-letter-spacing + title: 正文字间距 + type: variable-number-slider + default: 0 + min: -0.5 + max: 2 + step: 0.1 + format: px + - + id: opal-uncolored-bold + title: 粗体不上色 + description: 默认粗体是桃色。打开后粗体回退成正文色，只加粗不变色。 + type: class-toggle + default: false + - + id: opal-font-features + title: 代码字体特性 + description: 高级项。填 OpenType 特性，如 "liga" 1, "calt" 1 开连字，"zero" 1 斜杠零。留 normal 则默认。 + type: variable-text + default: normal + - + id: opal-h-heading + title: 标题分级 + type: heading + level: 1 + - + id: opal-h1-size + title: H1 字号 + type: variable-number-slider + default: 2 + min: 0.9 + max: 3.2 + step: 0.05 + format: em + - + id: opal-h2-size + title: H2 字号 + type: variable-number-slider + default: 1.65 + min: 0.9 + max: 3 + step: 0.05 + format: em + - + id: opal-h3-size + title: H3 字号 + type: variable-number-slider + default: 1.4 + min: 0.9 + max: 2.6 + step: 0.05 + format: em + - + id: opal-h4-size + title: H4 字号 + type: variable-number-slider + default: 1.2 + min: 0.9 + max: 2.2 + step: 0.05 + format: em + - + id: opal-h5-size + title: H5 字号 + type: variable-number-slider + default: 1.1 + min: 0.9 + max: 2 + step: 0.05 + format: em + - + id: opal-h6-size + title: H6 字号 + type: variable-number-slider + default: 1 + min: 0.8 + max: 1.8 + step: 0.05 + format: em + - + id: opal-h1-weight + title: H1 字重 + type: variable-number-slider + default: 700 + min: 100 + max: 900 + step: 50 + - + id: opal-h2-weight + title: H2 字重 + type: variable-number-slider + default: 700 + min: 100 + max: 900 + step: 50 + - + id: opal-h3-weight + title: H3 字重 + type: variable-number-slider + default: 650 + min: 100 + max: 900 + step: 50 + - + id: opal-h4-weight + title: H4 字重 + type: variable-number-slider + default: 600 + min: 100 + max: 900 + step: 50 + - + id: opal-h5-weight + title: H5 字重 + type: variable-number-slider + default: 600 + min: 100 + max: 900 + step: 50 + - + id: opal-h6-weight + title: H6 字重 + type: variable-number-slider + default: 600 + min: 100 + max: 900 + step: 50 + - + id: opal-hd-line + title: 标题下划线 + description: 标题的下边线，可与下面的「标题前缀」叠加。渐变下划线（默认，各级自身色淡出）/ 单线底边 / 无。 + type: class-select + allowEmpty: false + default: opal-hdl-gradient + options: + - label: 渐变下划线 + value: opal-hdl-gradient + - label: 单线底边 + value: opal-hdl-underline + - label: 无 + value: opal-hdl-none + - + id: opal-hd-prefix + title: 标题前缀 + description: 标题前的标记，可与上面的「标题下划线」叠加。无（默认）/ 悬挂井号（左侧露出 #）/ 自动序号（1.2.3）。 + type: class-select + allowEmpty: false + default: opal-hdp-none + options: + - label: 无 + value: opal-hdp-none + - label: 悬挂井号 + value: opal-hdp-hash + - label: 自动序号 + value: opal-hdp-counter + - + id: opal-h1-color + title: H1 颜色（逐级自定时用） + type: variable-themed-color + format: hex + opacity: false + default-light: '#4C50C8' + default-dark: '#A6A8F2' + - + id: opal-h2-color + title: H2 颜色（逐级自定时用） + type: variable-themed-color + format: hex + opacity: false + default-light: '#1E69A1' + default-dark: '#86BFF0' + - + id: opal-h3-color + title: H3 颜色（逐级自定时用） + type: variable-themed-color + format: hex + opacity: false + default-light: '#0E6E82' + default-dark: '#82CFE6' + - + id: opal-h4-color + title: H4 颜色（逐级自定时用） + type: variable-themed-color + format: hex + opacity: false + default-light: '#127266' + default-dark: '#82D9C8' + - + id: opal-h5-color + title: H5 颜色（逐级自定时用） + type: variable-themed-color + format: hex + opacity: false + default-light: '#5C6B1B' + default-dark: '#C6D98A' + - + id: opal-h6-color + title: H6 颜色（逐级自定时用） + type: variable-themed-color + format: hex + opacity: false + default-light: '#B13A56' + default-dark: '#F08AA0' + - + id: opal-h-layout + title: 布局尺寸 + type: heading + level: 1 + - + id: opal-line-width + title: 正文行宽 + description: 一行最多多宽（可读宽度）。最常调的一项。 + type: variable-number-slider + default: 700 + min: 400 + max: 1400 + step: 20 + format: px + - + id: opal-table-widen + title: 表格铺满行宽 + description: 打开后表格占满可用宽度，不再被行宽夹窄。 + type: class-toggle + default: false + - + id: opal-mermaid-scroll + title: 图表超宽改横向滚动 + description: 默认超出行宽的 Mermaid 图会等比缩放适应行宽。打开此项改为保持原大小、超宽部分横向滚动查看。 + type: class-toggle + default: false + - + id: opal-para-spacing + title: 段落间距 + type: variable-number-slider + default: 16 + min: 0 + max: 40 + step: 2 + format: px + - + id: opal-first-indent + title: 首行缩进排版 + description: 打开后段落首行缩进两字、段间不留空（书本式）。关闭则段间留空、不缩进（网页式，默认）。 + type: class-toggle + default: false + - + id: opal-list-indent + title: 列表缩进 + type: variable-number-slider + default: 2 + min: 0.8 + max: 4 + step: 0.1 + format: em + - + id: opal-file-margin + title: 编辑区上下边距 + type: variable-number-slider + default: 40 + min: 0 + max: 120 + step: 5 + format: px + - + id: opal-img-radius + title: 图片圆角 + type: variable-number-slider + default: 10 + min: 0 + max: 30 + step: 1 + format: px + - + id: opal-img-width + title: 图片最大宽度 + type: variable-number-slider + default: 100 + min: 30 + max: 100 + step: 5 + format: '%' + - + id: opal-img-shadow + title: 图片投影 + description: 打开后图片带柔和投影，像浮起的照片。 + type: class-toggle + default: false + - + id: opal-bg-texture + title: 背景纹理 + description: 编辑区背景纹理。无（默认）/ 点阵 / 方格纸 / 横线纸。 + type: class-select + allowEmpty: false + default: opal-tex-none + options: + - label: 无 + value: opal-tex-none + - label: 点阵 + value: opal-tex-dot + - label: 方格纸 + value: opal-tex-grid + - label: 横线纸 + value: opal-tex-line + - + id: opal-radius + title: 圆角大小 + type: variable-number-slider + default: 10 + min: 0 + max: 20 + step: 1 + format: px + - + id: opal-corner + title: 圆角形状 + description: 超椭圆=iOS 式更柔的角（默认；老引擎自动退标准圆角）。标准圆角 / 凹角 scoop / 斜角 bevel。 + type: class-select + allowEmpty: false + default: opal-corner-squircle + options: + - label: 超椭圆 squircle + value: opal-corner-squircle + - label: 标准圆角 + value: opal-corner-round + - label: 凹角 scoop + value: opal-corner-scoop + - label: 斜角 bevel + value: opal-corner-bevel + - + id: opal-h-border + title: 界面线条与边框 + type: heading + level: 1 + - + id: opal-border-width + title: 全局边框粗细 + description: 卡片、输入框、表格、菜单等所有描边的统一粗细。 + type: variable-number-slider + default: 1 + min: 0 + max: 3 + step: 0.5 + format: px + - + id: opal-border-color + title: 全局边框颜色 + type: variable-themed-color + format: hex + opacity: false + default-light: '#D3D8E3' + default-dark: '#3A3F4E' + - + id: opal-divider-style + title: 分隔线风格 + description: 正文分隔线（---）的样式。渐隐（默认）/ 实线 / 虚线 / 圆点 / 双线。 + type: class-select + allowEmpty: false + default: opal-div-fade + options: + - label: 渐隐 + value: opal-div-fade + - label: 实线 + value: opal-div-solid + - label: 虚线 + value: opal-div-dash + - label: 圆点 + value: opal-div-dot + - label: 双线 + value: opal-div-double + - + id: opal-pane-borders + title: 显示面板分隔边框 + description: 打开后相邻面板之间画出分隔线，边界更清楚。默认关（靠留白区分）。 + type: class-toggle + default: false + - + id: opal-nav-indent-line + title: 文件树缩进参考线 + description: 侧栏文件树每层缩进画一条竖参考线（默认开）。关闭则只靠缩进。 + type: class-toggle + default: true + - + id: opal-indent-guide + title: 正文列表缩进线 + description: 正文里多级列表每层画竖参考线，看清层级。默认关。 + type: class-toggle + default: false + - + id: opal-focus-ring + title: 焦点环风格 + description: 输入框/按钮获得焦点时的提示。描边（默认）/ 发光 / 无。 + type: class-select + allowEmpty: false + default: opal-ring-outline + options: + - label: 描边 + value: opal-ring-outline + - label: 发光 + value: opal-ring-glow + - label: 无 + value: opal-ring-none + - + id: opal-scrollbar-width + title: 滚动条粗细 + type: variable-number-slider + default: 12 + min: 0 + max: 18 + step: 1 + format: px + - + id: opal-table-border + title: 表格边框 + description: 仅横线（默认）/ 全框（每格描边）/ 无框。 + type: class-select + allowEmpty: false + default: opal-tb-row + options: + - label: 仅横线 + value: opal-tb-row + - label: 全框 + value: opal-tb-full + - label: 无框 + value: opal-tb-none + - + id: opal-h-toggle + title: 元素开关 + type: heading + level: 1 + - + id: opal-link-plain + title: 去掉链接下划线 + description: 打开后所有链接不带下划线，只用颜色区分。 + type: class-toggle + default: false + - + id: opal-code-wrap + title: 代码块自动换行 + description: 打开后长代码行自动折行，不再横向滚动。 + type: class-toggle + default: false + - + id: opal-code-ligatures + title: 代码连字 + description: 打开后代码里连字合成合字（需字体支持）。 + type: class-toggle + default: false + - + id: opal-table-plain + title: 关闭表格斑马纹 + description: 默认偶数行有淡色底。打开此项取消斑马纹。 + type: class-toggle + default: false + - + id: opal-active-line + title: 高亮当前行 + description: 打开后光标所在行有淡强调色底，便于定位。 + type: class-toggle + default: false + - + id: opal-focus-mode + title: 聚焦暗化 + description: 打开后非当前段落变淡，只有正在写的那段清晰。 + type: class-toggle + default: false + - + id: opal-tasks-native + title: 复选框回退原生 + description: 打开后不用自定义状态样式，退回系统原生复选框。 + type: class-toggle + default: false + - + id: opal-list-scheme + title: 列表符号 + description: 分层形状=按深度 ●○▪– 变形+单色（默认）。彩虹循环=形状不变、按深度换色。单色圆点=各级都用同色实心圆点。 + type: class-select + allowEmpty: false + default: opal-list-shape + options: + - label: 分层形状 + value: opal-list-shape + - label: 彩虹循环 + value: opal-list-rainbow + - label: 单色圆点 + value: opal-list-dot + - + id: opal-no-bg-orb + title: 关闭氛围背景光晕 + description: 编辑区背后默认有极淡角落光晕。打开此项关掉它。 + type: class-toggle + default: false + - + id: opal-h-skin + title: 皮肤与动效 + type: heading + level: 1 + - + id: opal-surface + title: 表面质感 + description: 实底=性能/可读最佳（默认）。毛玻璃=通透。液态玻璃=最有质感最吃性能。系统开「减少透明度」自动退实底。 + type: class-select + allowEmpty: false + default: opal-surface-solid + options: + - label: 实底不透明 + value: opal-surface-solid + - label: 毛玻璃 + value: opal-surface-glass + - label: 液态玻璃 + value: opal-surface-liquid + - + id: opal-ui-language + title: 界面设计语言 + description: 整体控件观感。中性（默认）/ Cupertino（圆润+轻投影）/ Fluent（微亮描边）/ Material（实底+明确阴影）。 + type: class-select + allowEmpty: false + default: opal-ui-neutral + options: + - label: 中性 + value: opal-ui-neutral + - label: Cupertino + value: opal-ui-cupertino + - label: Fluent + value: opal-ui-fluent + - label: Material + value: opal-ui-material + - + id: opal-callout-skin + title: Callout 皮肤 + description: 融合款=软底+左条+轻抬升（默认）。硬阴影 / 描边 / HUD发光 / 反色标题条 / 折角纸片。 + type: class-select + allowEmpty: false + default: opal-co-fused + options: + - label: 融合款（软底+左条） + value: opal-co-fused + - label: 硬阴影（新粗野） + value: opal-co-brutal + - label: 描边极简 + value: opal-co-outline + - label: HUD 发光 + value: opal-co-glow + - label: 反色标题条 + value: opal-co-bar + - label: 折角纸片 + value: opal-co-paper + - + id: opal-folder-scheme + title: 文件夹着色 + description: 彩虹脊柱=顶层循环色+子树继承（默认）。编号分区=按 00/10/20 前缀分色。单色 / 关闭。 + type: class-select + allowEmpty: false + default: opal-folder-rainbow + options: + - label: 彩虹脊柱 + value: opal-folder-rainbow + - label: 编号分区 + value: opal-folder-numbered + - label: 单色 + value: opal-folder-mono + - label: 关闭 + value: opal-folder-plain + - + id: opal-motion + title: 动效总取向 + description: 一个旋钮统管全站微动效。关=全静态。微=更轻更慢。标准=克制快顺（默认）。活泼=幅度大带回弹。系统开「减少动态」自动全关。 + type: class-select + allowEmpty: false + default: opal-motion-standard + options: + - label: 关 + value: opal-motion-off + - label: 微 + value: opal-motion-mini + - label: 标准 + value: opal-motion-standard + - label: 活泼 + value: opal-motion-lively + - + id: opal-entrance + title: 入场动效 + description: 开笔记时整篇淡入一次。去模糊合焦（默认）/ 平滑平移 / 弹性过冲。 + type: class-select + allowEmpty: false + default: opal-ent-blur + options: + - label: 去模糊合焦 + value: opal-ent-blur + - label: 平滑无过冲 + value: opal-ent-smooth + - label: 弹性过冲 + value: opal-ent-bounce + - + id: opal-retro + title: 复古皮肤 + description: 整套复古外壳。无（默认）/ 合成波 / 绿磷终端 / 琥珀CRT / 数字雨。 + type: class-select + allowEmpty: false + default: opal-retro-none + options: + - label: 无 + value: opal-retro-none + - label: 合成波 Synthwave + value: opal-retro-synth + - label: 绿磷终端 + value: opal-retro-green + - label: 琥珀 CRT + value: opal-retro-amber + - label: 数字雨 + value: opal-retro-matrix + - + id: opal-h-print + title: 打印导出 + type: heading + level: 1 + - + id: opal-print-dark + title: 导出保留暗色 + description: 默认导出转纸面浅色（省墨可读）。打开后保留暗底（需在导出设置里开 printBackground）。 + type: class-toggle + default: false + - + id: opal-print-font + title: 打印正文字体 + description: 导出时正文换成。衬线（默认，纸面易读）/ 不置换 / 打字机。 + type: class-select + allowEmpty: false + default: opal-pf-serif + options: + - label: 衬线 + value: opal-pf-serif + - label: 不置换 + value: opal-pf-keep + - label: 打字机 + value: opal-pf-mono + - + id: opal-print-align + title: 打印段落对齐 + description: 两端对齐+首行缩进（默认，书本式）/ 齐左。 + type: class-select + allowEmpty: false + default: opal-pa-justify + options: + - label: 两端对齐 + value: opal-pa-justify + - label: 齐左 + value: opal-pa-left +*/ + +/* ===================================================================== + 1. Opal 原色令牌（浅深两套，中性色可掺色温） + 全局旋钮 + ===================================================================== */ +.theme-dark { + --o-crust-n:#14161F; --o-mantle-n:#191C26; --o-base-n:#20232E; + --o-s0-n:#2B2F3C; --o-s1-n:#3A3F4E; --o-s2-n:#4C5262; + --o-tone: var(--opal-tone-dark, #20232E); + --o-overlay0:#646B7E; --o-overlay1:#7B8294; --o-overlay2:#969DAF; + --o-subtext0:#ACB3C6; --o-subtext1:#C2C8D8; --o-text:#D8DDEC; + --o-rose:#F08AA0; --o-coral:#F0998C; --o-peach:#F2AE7B; --o-amber:#EBD08A; + --o-lime:#C6D98A; --o-green:#92DBA8; --o-teal:#82D9C8; --o-cyan:#82CFE6; + --o-sky:#86BFF0; --o-blue:#8FAEF5; --o-indigo:#A6A8F2; --o-violet:#C0A2F0; + --o-orchid:#D29AEE; --o-pink:#EE9AD6; + --o-on-accent:#0B1120; + --o-hl-default:#EBD08A; --o-hl-line-default:#EBD08A; --o-accent-default:#8098FF; + --o-cc-blue:143 174 245; --o-cc-cyan:130 207 230; --o-cc-green:146 219 168; + --o-cc-amber:235 208 138; --o-cc-rose:240 138 160; --o-cc-teal:130 217 200; + --o-cc-orchid:210 154 238; --o-cc-indigo:166 168 242; +} +.theme-light { + --o-crust-n:#DADEE8; --o-mantle-n:#E4E7EF; --o-base-n:#EDEFF4; + --o-s0-n:#E2E5EE; --o-s1-n:#D3D8E3; --o-s2-n:#C3C9D8; + --o-tone: var(--opal-tone-light, #EDEFF4); + --o-overlay0:#A6ABB8; --o-overlay1:#8E94A2; --o-overlay2:#767B88; + --o-subtext0:#565A66; --o-subtext1:#474B57; --o-text:#33363F; + --o-rose:#B13A56; --o-coral:#AA4430; --o-peach:#94561D; --o-amber:#7B6214; + --o-lime:#5C6B1B; --o-green:#287244; --o-teal:#127266; --o-cyan:#0E6E82; + --o-sky:#1E69A1; --o-blue:#3A5FC4; --o-indigo:#4C50C8; --o-violet:#7B47C0; + --o-orchid:#9040B3; --o-pink:#A73A8A; + --o-on-accent:#FFFFFF; + --o-hl-default:#F6E1A2; --o-hl-line-default:#946F0E; --o-accent-default:#4C50C8; + --o-cc-blue:58 95 196; --o-cc-cyan:14 110 130; --o-cc-green:40 114 68; + --o-cc-amber:123 98 20; --o-cc-rose:177 58 86; --o-cc-teal:18 114 102; + --o-cc-orchid:146 65 180; --o-cc-indigo:76 80 200; +} +body { + /* 中性层：默认直接取原色（无 color-mix 也安全） */ + --o-crust:var(--o-crust-n); --o-mantle:var(--o-mantle-n); --o-base:var(--o-base-n); + --o-surface0:var(--o-s0-n); --o-surface1:var(--o-s1-n); --o-surface2:var(--o-s2-n); + --o-tone-k: var(--opal-tone-strength, 0%); + --o-sc: var(--opal-surface-contrast, 100%); + --o-accent-raw: var(--opal-accent, var(--o-accent-default)); + --o-accent: var(--o-accent-raw); + --o-accent2: var(--opal-accent-2, var(--o-teal)); + --o-hl-bg: var(--opal-mark-bg, var(--o-hl-default)); + --o-hl-line: var(--o-hl-line-default); /* 线色独立于填充色，保证默认下划线在浅底也够深可见 */ + --o-r: var(--opal-radius, 10px); + --o-bw: var(--opal-border-width, 1px); + --o-m-fast: .12s; --o-m-base: .22s; --o-m-slow: .34s; + --o-ease: cubic-bezier(.2,.7,.3,1); + --o-m-scale: 1; + --o-cshape: superellipse(1.2); + --o-fallback-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif; + --o-fallback-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; + --o-fallback-serif: "Source Han Serif SC", "Songti SC", Georgia, "Times New Roman", serif; + --o-soft-accent: var(--o-surface1); + --o-soft-err: var(--o-surface0); + --o-soft-ok: var(--o-surface0); +} +@supports (background: color-mix(in oklab, red, blue)) { + body { + --o-crust: color-mix(in oklab, var(--o-tone) var(--o-tone-k), var(--o-crust-n)); + --o-mantle: color-mix(in oklab, var(--o-tone) var(--o-tone-k), var(--o-mantle-n)); + --o-base: color-mix(in oklab, var(--o-tone) var(--o-tone-k), var(--o-base-n)); + /* 面板明暗对比：先按 --o-sc 缩放 surface 与 base 的差，再掺色温 */ + --o-surface0: color-mix(in oklab, color-mix(in oklab, var(--o-s0-n), var(--o-base-n) calc(100% - var(--o-sc))), var(--o-tone) var(--o-tone-k)); + --o-surface1: color-mix(in oklab, color-mix(in oklab, var(--o-s1-n), var(--o-base-n) calc(100% - var(--o-sc))), var(--o-tone) var(--o-tone-k)); + --o-surface2: color-mix(in oklab, color-mix(in oklab, var(--o-s2-n), var(--o-base-n) calc(100% - var(--o-sc))), var(--o-tone) var(--o-tone-k)); + --o-soft-accent: color-mix(in oklab, var(--o-accent) 16%, var(--o-base)); + --o-soft-err: color-mix(in oklab, var(--o-rose) 14%, var(--o-base)); + --o-soft-ok: color-mix(in oklab, var(--o-green) 14%, var(--o-base)); + } +} +@supports (color: oklch(from red l c h)) { + body { --o-accent: oklch(from var(--o-accent-raw) l calc(c * var(--opal-accent-saturation, 1)) h); } +} + +/* ===================================================================== + 2. 绑定 Obsidian 原生变量（全部带默认兜底） + ===================================================================== */ +body { + --background-primary: var(--o-base); --background-primary-alt: var(--o-mantle); + --background-secondary: var(--o-mantle); --background-secondary-alt: var(--o-crust); + --background-modifier-border: var(--opal-border-color, var(--o-surface1)); + --background-modifier-border-hover: var(--o-surface2); + --background-modifier-border-focus: var(--o-accent); + --background-modifier-hover: var(--o-surface0); + --background-modifier-active-hover: var(--o-soft-accent); + --background-modifier-form-field: var(--o-surface0); + --background-modifier-error: var(--o-soft-err); + --background-modifier-success: var(--o-soft-ok); + --background-modifier-message: var(--o-surface0); + + --text-normal: var(--o-text); --text-muted: var(--o-subtext0); --text-faint: var(--o-overlay2); + --text-on-accent: var(--o-on-accent); --text-on-accent-inverted: var(--o-text); + --text-accent: var(--o-blue); --text-accent-hover: var(--o-sky); + --text-selection: var(--o-surface2); --text-highlight-bg: transparent; + --text-error: var(--o-rose); --text-success: var(--o-green); --text-warning: var(--o-amber); + --caret-color: var(--o-cyan); + + --interactive-normal: var(--o-surface0); --interactive-hover: var(--o-surface1); + --interactive-accent: var(--o-accent); --interactive-accent-hover: var(--o-violet); + + --link-color: var(--o-blue); --link-color-hover: var(--o-sky); + --link-external-color: var(--o-blue); --link-external-color-hover: var(--o-sky); + --link-unresolved-color: var(--o-overlay1); --link-unresolved-opacity: 1; + + --h1-color: var(--o-indigo); --h2-color: var(--o-sky); --h3-color: var(--o-cyan); + --h4-color: var(--o-teal); --h5-color: var(--o-lime); --h6-color: var(--o-rose); + --h1-size: var(--opal-h1-size, 2em); --h2-size: var(--opal-h2-size, 1.65em); + --h3-size: var(--opal-h3-size, 1.4em); --h4-size: var(--opal-h4-size, 1.2em); + --h5-size: var(--opal-h5-size, 1.1em); --h6-size: var(--opal-h6-size, 1em); + --h1-weight: var(--opal-h1-weight, 700); --h2-weight: var(--opal-h2-weight, 700); + --h3-weight: var(--opal-h3-weight, 650); --h4-weight: var(--opal-h4-weight, 600); + --h5-weight: var(--opal-h5-weight, 600); --h6-weight: var(--opal-h6-weight, 600); + --bold-color: var(--o-peach); --bold-weight: 700; --italic-color: var(--o-green); + --code-background: var(--opal-code-bg, var(--o-surface0)); --code-normal: var(--o-pink); --code-size: .9em; + --blockquote-border-color: var(--o-surface2); --blockquote-color: var(--o-subtext0); --blockquote-background-color: var(--o-surface0); + --hr-color: var(--o-surface1); + --tag-color: var(--o-orchid); --tag-background: var(--o-surface0); --tag-background-hover: var(--o-surface1); + --checkbox-color: var(--o-green); --checkbox-marker-color: var(--o-base); --checkbox-border-color: var(--o-overlay0); + --list-marker-color: var(--o-overlay2); + --nav-item-color: var(--o-subtext0); --nav-item-color-hover: var(--o-text); --nav-item-color-active: var(--o-text); + --nav-item-background-hover: var(--o-surface0); --nav-item-background-active: var(--o-soft-accent); + --titlebar-background: var(--o-mantle); --titlebar-background-focused: var(--o-mantle); + --titlebar-text-color: var(--o-subtext0); --status-bar-background: var(--o-mantle); + --scrollbar-thumb-bg: var(--o-surface1); --scrollbar-active-thumb-bg: var(--o-overlay0); + --scrollbar-bg: transparent; --divider-color: var(--o-surface1); --collapse-icon-color: var(--o-overlay1); + --radius-s: calc(var(--o-r) * .5); --radius-m: var(--o-r); --radius-l: calc(var(--o-r) * 1.5); + --input-radius: var(--o-r); --tab-radius: calc(var(--o-r) * .75); + --border-width: var(--o-bw); + + /* 字体（自定义在前，安全字栈兜底在后） */ + --font-text: var(--opal-font-text, Inter), var(--o-fallback-sans); + --font-interface: var(--opal-font-ui, Inter), var(--o-fallback-sans); + --font-monospace: var(--opal-font-code, "JetBrains Mono"), var(--o-fallback-mono); + --font-text-size: var(--opal-font-size, 16px); + --line-height-normal: var(--opal-line-height, 1.5); + --o-font-heading: var(--opal-font-heading, Inter), var(--o-fallback-sans); + --file-line-width: var(--opal-line-width, 700px); + --p-spacing: var(--opal-para-spacing, 16px); + --list-indent: var(--opal-list-indent, 2em); + --file-margins: var(--opal-file-margin, 40px) var(--size-4-8); +} + +/* ===================================================================== + 3. 形状（squircle / round / scoop / bevel） + ===================================================================== */ +.opal-corner-round :is(.callout,.markdown-rendered code,button,.nav-file-title,.nav-folder-title){ corner-shape: round; } +@supports (corner-shape: superellipse(1.2)) { + .opal-corner-squircle :is(.callout,.markdown-rendered code,button,.nav-file-title,.nav-folder-title){ corner-shape: var(--o-cshape); } + .opal-corner-scoop :is(.callout,button,.nav-file-title,.nav-folder-title){ corner-shape: scoop; } +} +.opal-corner-bevel .callout{ clip-path: polygon(var(--o-r) 0,100% 0,100% calc(100% - var(--o-r)),calc(100% - var(--o-r)) 100%,0 100%,0 var(--o-r)); box-shadow: none; } + +/* ===================================================================== + 4. 基础排版 + 字体 + ===================================================================== */ +.markdown-rendered :is(h1,h2,h3,h4,h5,h6){ font-family: var(--o-font-heading); } +.markdown-rendered,.cm-content{ letter-spacing: var(--opal-letter-spacing, 0px); } +.opal-hdl-gradient .markdown-rendered :is(h1,h2,h3,h4,h5,h6){ + padding-bottom:2px; background-image:linear-gradient(90deg,currentColor,transparent 65%); + background-size:100% 2px; background-position:0 100%; background-repeat:no-repeat; +} +.opal-hdl-underline .markdown-rendered :is(h1,h2,h3,h4,h5,h6){ border-bottom:var(--o-bw) solid color-mix(in oklab,currentColor 45%,transparent); padding-bottom:3px; } +.opal-hdp-hash .markdown-rendered :is(h1,h2,h3,h4,h5,h6){ position:relative; } +.opal-hdp-hash .markdown-rendered h1::before{content:"#";} .opal-hdp-hash .markdown-rendered h2::before{content:"##";} +.opal-hdp-hash .markdown-rendered h3::before{content:"###";} .opal-hdp-hash .markdown-rendered h4::before{content:"####";} +.opal-hdp-hash .markdown-rendered h5::before{content:"#####";} .opal-hdp-hash .markdown-rendered h6::before{content:"######";} +.opal-hdp-hash .markdown-rendered :is(h1,h2,h3,h4,h5,h6)::before{position:absolute;right:calc(100% + 8px);color:var(--o-overlay1);font-weight:400;opacity:.6;font-size:.8em} +.opal-hdp-counter .markdown-preview-view{counter-reset:oh2 oh3;} +.opal-hdp-counter .markdown-rendered h2{counter-increment:oh2;counter-reset:oh3;} +.opal-hdp-counter .markdown-rendered h2::before{content:counter(oh2) ". ";color:var(--o-overlay1);font-weight:600} +.opal-hdp-counter .markdown-rendered h3{counter-increment:oh3;} +.opal-hdp-counter .markdown-rendered h3::before{content:counter(oh2) "." counter(oh3) " ";color:var(--o-overlay1);font-weight:600} + +/* 标题配色方案 */ +.opal-h-mono{ + --h2-color:color-mix(in oklab,var(--o-indigo) 82%,var(--o-overlay1)); + --h3-color:color-mix(in oklab,var(--o-indigo) 64%,var(--o-overlay1)); + --h4-color:color-mix(in oklab,var(--o-indigo) 50%,var(--o-overlay1)); + --h5-color:color-mix(in oklab,var(--o-indigo) 40%,var(--o-overlay1)); + --h6-color:color-mix(in oklab,var(--o-indigo) 32%,var(--o-overlay1)); + --h1-color:var(--o-indigo); +} +.opal-h-single{--h1-color:var(--o-indigo);--h2-color:var(--o-indigo);--h3-color:var(--o-indigo);--h4-color:var(--o-indigo);--h5-color:var(--o-indigo);--h6-color:var(--o-indigo)} +.opal-h-custom{--h1-color:var(--opal-h1-color,var(--o-indigo));--h2-color:var(--opal-h2-color,var(--o-sky));--h3-color:var(--opal-h3-color,var(--o-cyan));--h4-color:var(--opal-h4-color,var(--o-teal));--h5-color:var(--opal-h5-color,var(--o-lime));--h6-color:var(--opal-h6-color,var(--o-rose))} +.opal-h-plain{--h1-color:var(--o-text);--h2-color:var(--o-text);--h3-color:var(--o-text);--h4-color:var(--o-text);--h5-color:var(--o-text);--h6-color:var(--o-text)} +.opal-h-plain .markdown-rendered :is(h1,h2,h3,h4,h5,h6){background-image:none} +.cm-header-1{color:var(--h1-color)}.cm-header-2{color:var(--h2-color)}.cm-header-3{color:var(--h3-color)} +.cm-header-4{color:var(--h4-color)}.cm-header-5{color:var(--h5-color)}.cm-header-6{color:var(--h6-color)} + +.cm-strong{color:var(--o-peach)}.cm-em{color:var(--o-green)} +.opal-uncolored-bold{--bold-color:var(--o-text)} .opal-uncolored-bold .cm-strong{color:var(--o-text)} +.markdown-rendered strong em,.markdown-rendered em strong{color:var(--o-coral)} +.markdown-rendered del,.cm-strikethrough{color:var(--o-overlay1)} + +/* 链接 */ +.markdown-rendered a.internal-link{color:var(--link-color);text-decoration-color:color-mix(in oklab,currentColor 40%,transparent)} +.opal-link-plain .markdown-rendered a{text-decoration:none} +.markdown-rendered a.internal-link.is-unresolved{color:var(--link-unresolved-color)} +.opal-unres-dash .markdown-rendered a.is-unresolved{text-decoration:underline dashed;text-underline-offset:2px} +.opal-unres-dim .markdown-rendered a.is-unresolved{opacity:.5;text-decoration:none} +.opal-unres-blur .markdown-rendered a.is-unresolved{filter:blur(.4px);opacity:.7} +.opal-unres-badge .markdown-rendered a.is-unresolved::after{content:"?";font-size:.7em;vertical-align:super;color:var(--o-amber);margin-left:1px} + +/* 代码 */ +.markdown-rendered code:not([class*="language-"]),.cm-inline-code{color:var(--o-pink);background:var(--code-background);border-radius:var(--radius-s)} +.opal-code-wrap .markdown-rendered pre>code,.opal-code-wrap .cm-line{white-space:pre-wrap;word-break:break-word} +:is(.markdown-rendered code,.cm-line){font-variant-ligatures:none} +.opal-code-ligatures :is(.markdown-rendered code,.cm-line){font-variant-ligatures:contextual common-ligatures} +.markdown-rendered pre>code{font-feature-settings:var(--opal-font-features, normal)} + +/* 高亮：波浪下划线=默认（无辉光）。同时覆盖阅读态 mark / 实时预览 .cm-highlight / 编辑态内联 */ +.markdown-rendered mark,.cm-content mark,.markdown-source-view .cm-highlight,.cm-editor .cm-highlight,span.cm-highlight{background:transparent;color:inherit;text-decoration:underline wavy var(--o-hl-line);text-underline-offset:2px;text-decoration-thickness:2px} +.opal-mark-fill :is(mark,.cm-highlight){background:var(--o-hl-bg);color:#20232E;border-radius:3px;padding:0 2px;text-decoration:none;text-shadow:none} +.opal-mark-soft :is(mark,.cm-highlight){background:color-mix(in srgb,var(--o-hl-bg) 32%,transparent);border-radius:3px;padding:0 2px;text-decoration:none;text-shadow:none} +.opal-mark-text :is(mark,.cm-highlight){background:transparent;color:var(--o-hl-bg);font-weight:600;text-decoration:none;text-shadow:0 0 8px color-mix(in srgb,var(--o-hl-bg) 45%,transparent)} +.opal-hl-amber{--o-hl-bg:var(--o-amber);--o-hl-line:var(--o-amber)}.opal-hl-green{--o-hl-bg:var(--o-green);--o-hl-line:var(--o-green)} +.opal-hl-sky{--o-hl-bg:var(--o-sky);--o-hl-line:var(--o-sky)}.opal-hl-rose{--o-hl-bg:var(--o-rose);--o-hl-line:var(--o-rose)}.opal-hl-orchid{--o-hl-bg:var(--o-orchid);--o-hl-line:var(--o-orchid)} +/* --text-highlight-bg 被清零(供 ==高亮== 走波浪线)，会连带抹掉搜索命中/建议命中的底色，这里单独补回实底，保证命中可见 */ +.search-result-file-matched-text,.suggestion-highlight{background-color:var(--o-hl-bg);color:#20232E;border-radius:3px} + +/* 标签：三种方案 */ +.markdown-rendered a.tag{color:var(--o-orchid);background:var(--o-surface0);border-radius:20px} +.opal-tag-mono .markdown-rendered a.tag{color:var(--o-orchid)} +.opal-tag-hash a.tag[href^="#a"],.opal-tag-hash a.tag[href^="#A"]{color:var(--o-rose)} +.opal-tag-hash a.tag[href^="#b"],.opal-tag-hash a.tag[href^="#B"]{color:var(--o-coral)} +.opal-tag-hash a.tag[href^="#c"],.opal-tag-hash a.tag[href^="#C"]{color:var(--o-peach)} +.opal-tag-hash a.tag[href^="#d"],.opal-tag-hash a.tag[href^="#D"]{color:var(--o-amber)} +.opal-tag-hash a.tag[href^="#e"],.opal-tag-hash a.tag[href^="#E"]{color:var(--o-lime)} +.opal-tag-hash a.tag[href^="#f"],.opal-tag-hash a.tag[href^="#F"]{color:var(--o-green)} +.opal-tag-hash a.tag[href^="#g"],.opal-tag-hash a.tag[href^="#G"]{color:var(--o-teal)} +.opal-tag-hash a.tag[href^="#h"],.opal-tag-hash a.tag[href^="#H"]{color:var(--o-cyan)} +.opal-tag-hash a.tag[href^="#i"],.opal-tag-hash a.tag[href^="#I"]{color:var(--o-sky)} +.opal-tag-hash a.tag[href^="#j"],.opal-tag-hash a.tag[href^="#J"]{color:var(--o-blue)} +.opal-tag-hash a.tag[href^="#k"],.opal-tag-hash a.tag[href^="#K"]{color:var(--o-indigo)} +.opal-tag-hash a.tag[href^="#l"],.opal-tag-hash a.tag[href^="#L"]{color:var(--o-violet)} +.opal-tag-hash a.tag[href^="#m"],.opal-tag-hash a.tag[href^="#M"]{color:var(--o-orchid)} +.opal-tag-hash a.tag[href^="#n"],.opal-tag-hash a.tag[href^="#N"]{color:var(--o-pink)} +.opal-tag-hash a.tag[href^="#o"],.opal-tag-hash a.tag[href^="#O"]{color:var(--o-rose)} +.opal-tag-hash a.tag[href^="#p"],.opal-tag-hash a.tag[href^="#P"]{color:var(--o-peach)} +.opal-tag-hash a.tag[href^="#q"],.opal-tag-hash a.tag[href^="#Q"]{color:var(--o-amber)} +.opal-tag-hash a.tag[href^="#r"],.opal-tag-hash a.tag[href^="#R"]{color:var(--o-green)} +.opal-tag-hash a.tag[href^="#s"],.opal-tag-hash a.tag[href^="#S"]{color:var(--o-teal)} +.opal-tag-hash a.tag[href^="#t"],.opal-tag-hash a.tag[href^="#T"]{color:var(--o-sky)} +.opal-tag-hash a.tag[href^="#u"],.opal-tag-hash a.tag[href^="#U"]{color:var(--o-blue)} +.opal-tag-hash a.tag[href^="#v"],.opal-tag-hash a.tag[href^="#V"]{color:var(--o-violet)} +.opal-tag-hash a.tag[href^="#w"],.opal-tag-hash a.tag[href^="#W"]{color:var(--o-orchid)} +.opal-tag-hash a.tag[href^="#x"],.opal-tag-hash a.tag[href^="#X"]{color:var(--o-pink)} +.opal-tag-hash a.tag[href^="#y"],.opal-tag-hash a.tag[href^="#Y"]{color:var(--o-coral)} +.opal-tag-hash a.tag[href^="#z"],.opal-tag-hash a.tag[href^="#Z"]{color:var(--o-cyan)} +.opal-tag-semantic a.tag[href="#紧急"],.opal-tag-semantic a.tag[href="#urgent"],.opal-tag-semantic a.tag[href="#阻塞"],.opal-tag-semantic a.tag[href="#blocked"],.opal-tag-semantic a.tag[href="#bug"]{color:var(--o-rose)} +.opal-tag-semantic a.tag[href="#重要"],.opal-tag-semantic a.tag[href="#important"],.opal-tag-semantic a.tag[href="#star"]{color:var(--o-peach)} +.opal-tag-semantic a.tag[href="#待办"],.opal-tag-semantic a.tag[href="#todo"],.opal-tag-semantic a.tag[href="#wip"],.opal-tag-semantic a.tag[href="#进行中"],.opal-tag-semantic a.tag[href="#doing"],.opal-tag-semantic a.tag[href="#问题"],.opal-tag-semantic a.tag[href="#question"],.opal-tag-semantic a.tag[href="#review"],.opal-tag-semantic a.tag[href="#待审"]{color:var(--o-amber)} +.opal-tag-semantic a.tag[href="#完成"],.opal-tag-semantic a.tag[href="#done"],.opal-tag-semantic a.tag[href="#已完成"],.opal-tag-semantic a.tag[href="#通过"],.opal-tag-semantic a.tag[href="#resolved"]{color:var(--o-green)} +.opal-tag-semantic a.tag[href="#想法"],.opal-tag-semantic a.tag[href="#idea"],.opal-tag-semantic a.tag[href="#灵感"]{color:var(--o-sky)} +.opal-tag-semantic a.tag[href="#项目"],.opal-tag-semantic a.tag[href="#project"]{color:var(--o-blue)} +.opal-tag-semantic a.tag[href="#moc"],.opal-tag-semantic a.tag[href="#index"]{color:var(--o-indigo)} +.opal-tag-semantic a.tag[href="#参考"],.opal-tag-semantic a.tag[href="#reference"],.opal-tag-semantic a.tag[href="#ref"]{color:var(--o-violet)} +.opal-tag-semantic a.tag[href="#归档"],.opal-tag-semantic a.tag[href="#archive"],.opal-tag-semantic a.tag[href="#archived"],.opal-tag-semantic a.tag[href="#废弃"],.opal-tag-semantic a.tag[href="#deprecated"]{color:var(--o-overlay1)} + +/* 列表符号：改 Obsidian 自绘的 .list-bullet::after（决不设 list-style-type，否则被藏起的原生 marker 会与自绘点重影）。 + 默认=按深度 ●(实心圆) ○(空心圆) ▪(方块) –(短横) + 单色（--list-marker-color=overlay2）。 + 阅读态靠 .has-list-bullet 祖先层数递增特异度，深层覆盖浅层；实时预览靠 .HyperMD-list-line-N。每条自足指定形状。 */ +.markdown-rendered .has-list-bullet .has-list-bullet .list-bullet::after, +.HyperMD-list-line-2 .list-bullet::after{ + background-color:transparent;border:1.5px solid var(--list-marker-color);border-radius:50%; + width:var(--list-bullet-size,.32em);height:var(--list-bullet-size,.32em) +} +.markdown-rendered .has-list-bullet .has-list-bullet .has-list-bullet .list-bullet::after, +.HyperMD-list-line-3 .list-bullet::after{ + background-color:var(--list-marker-color);border:none;border-radius:0; + width:var(--list-bullet-size,.3em);height:var(--list-bullet-size,.3em) +} +.markdown-rendered .has-list-bullet .has-list-bullet .has-list-bullet .has-list-bullet .list-bullet::after, +.HyperMD-list-line-4 .list-bullet::after{ + background-color:var(--list-marker-color);border:none;border-radius:0;width:.5em;height:2px +} +/* 彩虹循环：只覆盖 --list-marker-color（背景与描边都取自它），形状沿用上面 */ +.opal-list-rainbow{--list-marker-color:var(--o-rose)} +.opal-list-rainbow :is(.has-list-bullet .has-list-bullet,.HyperMD-list-line-2){--list-marker-color:var(--o-amber)} +.opal-list-rainbow :is(.has-list-bullet .has-list-bullet .has-list-bullet,.HyperMD-list-line-3){--list-marker-color:var(--o-green)} +.opal-list-rainbow :is(.has-list-bullet .has-list-bullet .has-list-bullet .has-list-bullet,.HyperMD-list-line-4){--list-marker-color:var(--o-sky)} +/* 单色圆点：强制各级回到实心圆点 */ +.opal-list-dot .list-bullet::after{ + background-color:var(--list-marker-color)!important;border:none!important;border-radius:50%!important; + width:var(--list-bullet-size,.3em)!important;height:var(--list-bullet-size,.3em)!important +} +/* 缩进统一：Obsidian 一级 li 硬编码 3ch、二级+才走 --list-indent，导致首层步距偏窄。让一级也走 --list-indent，各层齐平 */ +.markdown-rendered ul>li,.markdown-rendered ol>li{margin-inline-start:var(--list-indent)} +.opal-indent-guide .markdown-rendered :is(ul,ol) :is(ul,ol){border-left:1px solid color-mix(in oklab,var(--o-surface2) 60%,transparent);margin-left:.2em} + +/* 段落排版（间距走原生 --p-spacing，此处只做首行缩进覆盖） */ +.opal-first-indent .markdown-rendered p{text-indent:2em;margin-block:0} +.markdown-rendered blockquote{border-left:3px solid var(--o-surface2);background:var(--o-surface0);border-radius:0 var(--radius-m) var(--radius-m) 0} + +/* 分隔线风格 */ +.markdown-rendered hr{border:none;height:2px;background:linear-gradient(90deg,transparent,var(--o-surface2),transparent)} +.opal-div-solid .markdown-rendered hr{height:0;border-top:var(--o-bw) solid var(--o-surface2);background:none} +.opal-div-dash .markdown-rendered hr{height:0;border-top:var(--o-bw) dashed var(--o-surface2);background:none} +.opal-div-double .markdown-rendered hr{height:0;border-top:3px double var(--o-surface2);background:none} +.opal-div-dot .markdown-rendered hr{height:4px;background:radial-gradient(circle,var(--o-surface2) 1.4px,transparent 1.4px);background-size:12px 4px} + +/* ===================================================================== + 5. Callout：融合默认 + 26 类型语义色 + 皮肤 + ===================================================================== */ +.callout{ + background:var(--o-base);border:0;border-left:3px solid rgb(var(--callout-color)); + border-radius:var(--radius-s) var(--radius-m) var(--radius-m) var(--radius-s); + box-shadow:0 1px 2px rgba(0,0,0,.18),0 6px 16px -8px rgba(0,0,0,.28); +} +@supports (background: color-mix(in oklab, red, blue)){.callout{background:color-mix(in oklab,rgb(var(--callout-color)) 6%,var(--o-base))}} +.callout-title,.callout-icon{color:rgb(var(--callout-color))} +.callout[data-callout="info"],.callout[data-callout="todo"]{--callout-color:var(--o-cc-blue)} +.callout[data-callout="tip"],.callout[data-callout="hint"],.callout[data-callout="important"]{--callout-color:var(--o-cc-teal)} +.callout[data-callout="success"],.callout[data-callout="check"],.callout[data-callout="done"]{--callout-color:var(--o-cc-green)} +.callout[data-callout="question"],.callout[data-callout="help"],.callout[data-callout="faq"],.callout[data-callout="warning"],.callout[data-callout="caution"],.callout[data-callout="attention"]{--callout-color:var(--o-cc-amber)} +.callout[data-callout="danger"],.callout[data-callout="error"],.callout[data-callout="failure"],.callout[data-callout="fail"],.callout[data-callout="missing"],.callout[data-callout="bug"]{--callout-color:var(--o-cc-rose)} +.callout[data-callout="note"],.callout[data-callout="abstract"],.callout[data-callout="summary"],.callout[data-callout="tldr"]{--callout-color:var(--o-cc-indigo)} +.callout[data-callout="example"]{--callout-color:var(--o-cc-orchid)} +.callout[data-callout="quote"],.callout[data-callout="cite"]{--callout-color:var(--o-cc-cyan)} +/* Callout 中文别名：[!笔记][!警告] 等直接映射到语义色（对 Cyrius 重要 + 共享友好；图标 Obsidian 无内置则退默认） */ +.callout[data-callout="笔记"],.callout[data-callout="摘要"],.callout[data-callout="总结"]{--callout-color:var(--o-cc-indigo)} +.callout[data-callout="信息"],.callout[data-callout="待办"]{--callout-color:var(--o-cc-blue)} +.callout[data-callout="提示"],.callout[data-callout="技巧"],.callout[data-callout="重要"]{--callout-color:var(--o-cc-teal)} +.callout[data-callout="成功"],.callout[data-callout="完成"],.callout[data-callout="通过"]{--callout-color:var(--o-cc-green)} +.callout[data-callout="问题"],.callout[data-callout="疑问"],.callout[data-callout="警告"],.callout[data-callout="注意"],.callout[data-callout="小心"]{--callout-color:var(--o-cc-amber)} +.callout[data-callout="危险"],.callout[data-callout="错误"],.callout[data-callout="失败"],.callout[data-callout="缺陷"],.callout[data-callout="故障"]{--callout-color:var(--o-cc-rose)} +.callout[data-callout="示例"],.callout[data-callout="例子"]{--callout-color:var(--o-cc-orchid)} +.callout[data-callout="引用"],.callout[data-callout="引文"]{--callout-color:var(--o-cc-cyan)} +.opal-co-brutal .callout{border:2px solid rgb(var(--callout-color));border-radius:4px;box-shadow:4px 4px 0 rgb(var(--callout-color));background:var(--o-base)} +.opal-co-outline .callout{background:transparent;border:var(--o-bw) solid color-mix(in oklab,rgb(var(--callout-color)) 55%,var(--o-surface1));box-shadow:none} +.opal-co-glow .callout{box-shadow:0 0 12px -2px rgb(var(--callout-color)),inset 0 0 10px -6px rgb(var(--callout-color))} +.opal-co-bar .callout{padding-left:0;border-left:0;overflow:hidden} +.opal-co-bar .callout-title{background:rgb(var(--callout-color));color:var(--o-base);padding:5px 12px} +.opal-co-paper .callout{border:0;box-shadow:0 2px 6px -2px rgba(0,0,0,.3);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);background:color-mix(in oklab,rgb(var(--callout-color)) 7%,var(--o-mantle))} + +/* ===================================================================== + 6. 复选框 / 任务（收进 :not(.opal-tasks-native) 便于回退） + ===================================================================== */ +.task-list-item-checkbox{border-radius:var(--radius-s)} +body:not(.opal-tasks-native) .task-list-item-checkbox:checked{background-color:var(--o-green);border-color:var(--o-green)} +body:not(.opal-tasks-native) .task-list-item[data-task="/"] .task-list-item-checkbox{background:conic-gradient(var(--o-green) 0 42%,transparent 42%);border-color:var(--o-green)} +body:not(.opal-tasks-native) .task-list-item[data-task="-"]{text-decoration:line-through;color:var(--o-overlay1)} +body:not(.opal-tasks-native) .task-list-item[data-task="-"] .task-list-item-checkbox{border-color:var(--o-rose)} +body:not(.opal-tasks-native) .task-list-item[data-task=">"] .task-list-item-checkbox{border-color:var(--o-sky)} +body:not(.opal-tasks-native) .task-list-item[data-task="<"] .task-list-item-checkbox{border-color:var(--o-sky)} +body:not(.opal-tasks-native) .task-list-item[data-task="?"] .task-list-item-checkbox{border-color:var(--o-amber)} +body:not(.opal-tasks-native) .task-list-item[data-task="!"] .task-list-item-checkbox{border-color:var(--o-rose)} +body:not(.opal-tasks-native) .task-list-item[data-task="*"] .task-list-item-checkbox{border-color:var(--o-amber)} +body:not(.opal-tasks-native) ul ul .task-list-item-checkbox:checked{background-color:var(--o-amber);border-color:var(--o-amber)} +body:not(.opal-tasks-native) ul ul ul .task-list-item-checkbox:checked{background-color:var(--o-sky);border-color:var(--o-sky)} +/* 扩展/数字任务态字形图标：mask 把语义色裁成字形，脚本生成编码零错；阅读态+编辑态 */ +body:not(.opal-tasks-native) .task-list-item[data-task=">"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task=">"] .task-list-item-checkbox{border:none;background-color:var(--o-sky);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%80%BA%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%80%BA%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="<"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="<"] .task-list-item-checkbox{border:none;background-color:var(--o-sky);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%80%B9%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%80%B9%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="?"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="?"] .task-list-item-checkbox{border:none;background-color:var(--o-amber);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%3F%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%3F%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="!"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="!"] .task-list-item-checkbox{border:none;background-color:var(--o-rose);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%21%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%21%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="*"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="*"] .task-list-item-checkbox{border:none;background-color:var(--o-amber);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%98%85%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%98%85%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="\""] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="\""] .task-list-item-checkbox{border:none;background-color:var(--o-teal);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%80%9C%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2713%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E%E2%80%9C%3C%2Ftext%3E%3C%2Fsvg%3E") center/80% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="0"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="0"] .task-list-item-checkbox{border:none;background-color:var(--o-rose);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E0%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E0%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="1"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="1"] .task-list-item-checkbox{border:none;background-color:var(--o-coral);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E1%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E1%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="2"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="2"] .task-list-item-checkbox{border:none;background-color:var(--o-peach);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E2%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E2%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="3"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="3"] .task-list-item-checkbox{border:none;background-color:var(--o-amber);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E3%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E3%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="4"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="4"] .task-list-item-checkbox{border:none;background-color:var(--o-lime);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E4%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E4%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="5"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="5"] .task-list-item-checkbox{border:none;background-color:var(--o-green);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E5%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E5%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="6"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="6"] .task-list-item-checkbox{border:none;background-color:var(--o-teal);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E6%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E6%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="7"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="7"] .task-list-item-checkbox{border:none;background-color:var(--o-cyan);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E7%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E7%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="8"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="8"] .task-list-item-checkbox{border:none;background-color:var(--o-sky);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E8%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E8%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} +body:not(.opal-tasks-native) .task-list-item[data-task="9"] > input.task-list-item-checkbox,body:not(.opal-tasks-native) .HyperMD-task-line[data-task="9"] .task-list-item-checkbox{border:none;background-color:var(--o-blue);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E9%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Ctext%20x%3D%278%27%20y%3D%2712.2%27%20font-size%3D%2711%27%20font-family%3D%27-apple-system%2CBlinkMacSystemFont%2Csans-serif%27%20font-weight%3D%27700%27%20text-anchor%3D%27middle%27%3E9%3C%2Ftext%3E%3C%2Fsvg%3E") center/90% no-repeat} + +/* ===================================================================== + 7. 表格 / Bases / Dataview + ===================================================================== */ +.markdown-rendered th{background:var(--o-surface0);color:var(--o-subtext0);border-bottom:var(--o-bw) solid var(--o-surface1)} +.markdown-rendered td{border-bottom:var(--o-bw) solid color-mix(in oklab,var(--o-surface1) 55%,transparent)} +.markdown-rendered tbody tr:nth-child(even),.dataview.table-view-table tbody tr:nth-child(even){background:color-mix(in oklab,var(--o-surface0) 45%,transparent)} +.opal-table-plain .markdown-rendered tbody tr:nth-child(even){background:none} +.markdown-rendered tbody tr:hover,.dataview.table-view-table tbody tr:hover{background:color-mix(in oklab,var(--o-accent) 8%,transparent)} +.opal-tb-full .markdown-rendered :is(th,td){border:var(--o-bw) solid var(--o-surface1)} +.opal-tb-none .markdown-rendered :is(th,td){border:none} +.opal-table-widen .markdown-rendered table{width:100%;display:table} + +/* ===================================================================== + 8. Canvas / 背景纹理 + ===================================================================== */ +/* Canvas：底色/点阵走原生变量（不自绘，避免和 Obsidian 点阵重影）；卡片 squircle + 语义左条； + 6 号预设色映射 Opal（注意 --canvas-color 用逗号三元组，供 rgb()/rgba() legacy 语法）；编组框靛蓝虚线 */ +.canvas-wrapper{--canvas-background:var(--o-mantle);--canvas-dot-pattern:var(--o-surface1)} +.theme-dark .canvas-wrapper{--canvas-color-1:240,138,160;--canvas-color-2:242,174,123;--canvas-color-3:235,208,138;--canvas-color-4:146,219,168;--canvas-color-5:130,207,230;--canvas-color-6:192,162,240} +.theme-light .canvas-wrapper{--canvas-color-1:177,58,86;--canvas-color-2:148,86,29;--canvas-color-3:123,98,20;--canvas-color-4:40,114,68;--canvas-color-5:14,110,130;--canvas-color-6:123,71,192} +.canvas-node-container{border-radius:var(--radius-m);border-left:3px solid rgb(var(--canvas-color,126,126,126))} +@supports (corner-shape: superellipse(1.2)){.opal-corner-squircle .canvas-node-container{corner-shape:var(--o-cshape)}} +.canvas-node-label{color:var(--o-subtext0)} +.canvas-node-group{border:2px dashed var(--o-indigo);border-radius:var(--radius-m)} +/* Mermaid 图表：默认超宽等比缩放到行宽内（小图保持原样，只缩超宽的，压过 Mermaid 内联的 max-width）； + .opal-mermaid-scroll 档改为保持原大小、横向滚动。覆盖阅读态与实时预览。 */ +.mermaid{max-width:100%;text-align:center} +.mermaid svg{max-width:100%!important;height:auto!important} +.opal-mermaid-scroll .mermaid{overflow-x:auto;text-align:left} +.opal-mermaid-scroll .mermaid svg{max-width:none!important} +.opal-tex-dot .markdown-source-view .cm-sizer,.opal-tex-dot .markdown-preview-sizer{background-image:radial-gradient(color-mix(in oklab,var(--o-text) 7%,transparent) 1px,transparent 1px);background-size:22px 22px} +.opal-tex-grid .markdown-source-view .cm-sizer,.opal-tex-grid .markdown-preview-sizer{background-image:linear-gradient(color-mix(in oklab,var(--o-text) 6%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklab,var(--o-text) 6%,transparent) 1px,transparent 1px);background-size:24px 24px} +.opal-tex-line .markdown-source-view .cm-sizer,.opal-tex-line .markdown-preview-sizer{background-image:linear-gradient(color-mix(in oklab,var(--o-text) 7%,transparent) 1px,transparent 1px);background-size:100% 1.7em} + +/* ===================================================================== + 9. Properties + ===================================================================== */ +.metadata-container{background:var(--o-surface0);border:var(--o-bw) solid var(--o-surface1);border-radius:var(--radius-m)} +.metadata-property-key{color:var(--o-subtext0)} + +/* ===================================================================== + 10. 文件树 / 文件夹（四种着色方案） + ===================================================================== */ +.nav-folder-title{border-radius:var(--radius-s);position:relative} +.opal-nav-indent-line .nav-folder-children{border-left:var(--o-bw) solid color-mix(in oklab,var(--o-surface1) 60%,transparent);margin-left:12px} +/* 彩虹脊柱：顶层夹设色调变量 --o-folder-hue，子树所有标题继承（决策「子树继承」） */ +.opal-folder-rainbow .nav-folder.mod-root>.nav-folder-children>.nav-folder:nth-child(7n+1){--o-folder-hue:var(--o-rose)} +.opal-folder-rainbow .nav-folder.mod-root>.nav-folder-children>.nav-folder:nth-child(7n+2){--o-folder-hue:var(--o-peach)} +.opal-folder-rainbow .nav-folder.mod-root>.nav-folder-children>.nav-folder:nth-child(7n+3){--o-folder-hue:var(--o-green)} +.opal-folder-rainbow .nav-folder.mod-root>.nav-folder-children>.nav-folder:nth-child(7n+4){--o-folder-hue:var(--o-teal)} +.opal-folder-rainbow .nav-folder.mod-root>.nav-folder-children>.nav-folder:nth-child(7n+5){--o-folder-hue:var(--o-sky)} +.opal-folder-rainbow .nav-folder.mod-root>.nav-folder-children>.nav-folder:nth-child(7n+6){--o-folder-hue:var(--o-violet)} +.opal-folder-rainbow .nav-folder.mod-root>.nav-folder-children>.nav-folder:nth-child(7n+7){--o-folder-hue:var(--o-orchid)} +.opal-folder-rainbow .nav-folder-title{color:var(--o-folder-hue,var(--o-subtext0))} +.opal-folder-numbered .nav-folder-title[data-path^="00"]{color:var(--o-rose)} +.opal-folder-numbered .nav-folder-title[data-path^="10"]{color:var(--o-blue)} +.opal-folder-numbered .nav-folder-title[data-path^="20"]{color:var(--o-green)} +.opal-folder-numbered .nav-folder-title[data-path^="90"]{color:var(--o-overlay1)} +.opal-folder-mono .nav-folder.mod-root>.nav-folder-children>.nav-folder>.nav-folder-title{color:var(--o-subtext1)} +.nav-file-title{position:relative} +.nav-file-title.is-active::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:3px;border-radius:2px;background:var(--o-accent)} + +/* ===================================================================== + 11. 整页语义态（cssclasses） + ===================================================================== */ +.important.markdown-preview-view,.important.markdown-source-view{border-left:3px solid var(--o-amber);background:color-mix(in oklab,var(--o-amber) 5%,var(--o-base))} +.alert.markdown-preview-view,.alert.markdown-source-view{box-shadow:inset 0 0 0 1.5px var(--o-rose),0 0 0 3px color-mix(in srgb,var(--o-rose) 16%,transparent)} +.archived{filter:grayscale(.6) brightness(.85)} +.pinned.markdown-preview-view,.pinned.markdown-source-view{border-top:3px solid var(--o-teal)} +.draft .markdown-preview-sizer,.draft .cm-sizer{position:relative} +.draft .markdown-preview-sizer::before{content:"草稿";position:absolute;top:38%;left:50%;transform:translate(-50%,-50%) rotate(-18deg);font-size:70px;font-weight:900;color:color-mix(in oklab,var(--o-overlay2) 18%,transparent);pointer-events:none;z-index:0} +.wide{--file-line-width:55rem} +.narrow{--file-line-width:30rem} +.full-width{--file-line-width:100%} +.meeting.markdown-preview-view{border-top:2px solid var(--o-sky)} +.daily{--o-base:var(--o-base-n)} +@supports (background: color-mix(in oklab, red, blue)){.daily{--o-base:color-mix(in oklab,var(--o-amber) 4%,var(--o-base-n))}} +[class*="accent-"].markdown-preview-view,[class*="accent-"].markdown-source-view{--interactive-accent:var(--o-note-accent);--link-color:var(--o-note-accent);--text-accent:var(--o-note-accent);--h1-color:var(--o-note-accent)} +.accent-rose{--o-note-accent:var(--o-rose)}.accent-peach{--o-note-accent:var(--o-peach)}.accent-amber{--o-note-accent:var(--o-amber)} +.accent-green{--o-note-accent:var(--o-green)}.accent-teal{--o-note-accent:var(--o-teal)}.accent-sky{--o-note-accent:var(--o-sky)} +.accent-blue{--o-note-accent:var(--o-blue)}.accent-indigo{--o-note-accent:var(--o-indigo)}.accent-violet{--o-note-accent:var(--o-violet)} +.accent-orchid{--o-note-accent:var(--o-orchid)}.accent-pink{--o-note-accent:var(--o-pink)} + +/* ===================================================================== + 12. 图片 + ===================================================================== */ +.markdown-rendered img{border-radius:var(--opal-img-radius, 10px);max-width:var(--opal-img-width, 100%)} +.opal-img-shadow .markdown-rendered img{box-shadow:0 6px 20px -8px rgba(0,0,0,.5)} +.theme-dark img[alt*="img-invert"]{filter:invert(1) hue-rotate(180deg)} +img[alt*="img-banner"]{width:100%;object-fit:cover} +img[alt*="img-left"]{float:left;margin:0 1em .5em 0;max-width:45%} +img[alt*="img-right"]{float:right;margin:0 0 .5em 1em;max-width:45%} +@supports selector(:has(*)){ + .markdown-rendered p:has(> img[alt*="img-grid"]){display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px} +} +.internal-embed.image-embed.mod-error{border:var(--o-bw) dashed var(--o-surface2);border-radius:var(--radius-m);min-height:40px} + +/* ===================================================================== + 13. 界面 chrome：边框 / 焦点环 / 滚动条 / 面板 / 输入 / 标签页 + ===================================================================== */ +:is(input[type="text"],input[type="search"],textarea,.dropdown,button.mod-cta,button:not(.clickable-icon)){border:var(--o-bw) solid var(--background-modifier-border)} +.opal-pane-borders .workspace-leaf{border:var(--o-bw) solid var(--o-surface1)} +.opal-ring-outline :is(input,textarea,button,.dropdown):focus-visible{outline:2px solid var(--o-accent);outline-offset:1px} +.opal-ring-glow :is(input,textarea,button,.dropdown):focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--o-accent) 30%,transparent)} +.opal-ring-none :is(input,textarea,button,.dropdown):focus-visible{outline:none} +::-webkit-scrollbar{width:var(--opal-scrollbar-width, 12px);height:var(--opal-scrollbar-width, 12px)} +::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-bg);border-radius:8px} +.workspace-tab-header{border-radius:var(--tab-radius) var(--tab-radius) 0 0} +.opal-active-line .cm-active.cm-line{background:color-mix(in oklab,var(--o-accent) 6%,transparent)} +.opal-focus-mode .cm-content .cm-line:not(.cm-active){opacity:.42;transition:opacity .2s var(--o-ease)} + +/* 界面设计语言 */ +.opal-ui-cupertino :is(.menu,.suggestion-container,.popover,.modal){border-radius:14px;box-shadow:0 10px 34px -10px rgba(0,0,0,.5)} +.opal-ui-cupertino button{border-radius:999px} +.opal-ui-fluent :is(.menu,.suggestion-container,.popover){border:1px solid color-mix(in srgb,#fff 16%,transparent);box-shadow:0 8px 24px -10px rgba(0,0,0,.5)} +.opal-ui-material :is(.menu,.suggestion-container,.popover,.modal){border-radius:4px;box-shadow:0 8px 10px 1px rgba(0,0,0,.28),0 3px 14px 2px rgba(0,0,0,.22)} +.opal-ui-material button{text-transform:uppercase;letter-spacing:.04em;font-size:.85em} + +/* ===================================================================== + 14. 表面质感（毛玻璃 / 液态玻璃） + ===================================================================== */ +.opal-surface-glass :is(.menu,.suggestion-container,.popover){background:color-mix(in srgb,var(--o-mantle) 72%,transparent);backdrop-filter:blur(12px) saturate(1.2)} +.opal-surface-liquid :is(.menu,.suggestion-container,.popover){background:color-mix(in srgb,var(--o-surface0) 60%,transparent);backdrop-filter:blur(14px) saturate(1.4) brightness(1.05);border:1px solid color-mix(in srgb,#fff 20%,transparent);box-shadow:0 8px 22px -8px rgba(0,0,0,.55),inset 0 1px 0 color-mix(in srgb,#fff 28%,transparent)} +@media (prefers-reduced-transparency: reduce){ + .opal-surface-glass :is(.menu,.suggestion-container,.popover), + .opal-surface-liquid :is(.menu,.suggestion-container,.popover){backdrop-filter:none;background:var(--o-mantle);border:var(--o-bw) solid var(--o-surface1);box-shadow:none} +} + +/* ===================================================================== + 15. 氛围背景光晕（默认开；.opal-no-bg-orb 关） + ===================================================================== */ +@supports (background: color-mix(in srgb, red, blue)){ + body:not(.opal-no-bg-orb) .cm-editor, + body:not(.opal-no-bg-orb) .markdown-preview-view{ + background-image: + radial-gradient(circle at 12% 10%, color-mix(in srgb,var(--o-accent) 13%,transparent), transparent 30%), + radial-gradient(circle at 88% 90%, color-mix(in srgb,var(--o-accent2) 13%,transparent), transparent 30%); + /* 用默认 background-attachment:scroll，光晕钉在编辑区角落且不随内容滚动 -> 不触发滚动逐帧重绘 */ + } +} + +/* ===================================================================== + 16. 动效系统 + ===================================================================== */ +.opal-motion-off{--o-m-scale:0} +.opal-motion-mini{--o-m-scale:1.4} +.opal-motion-standard{--o-m-scale:1} +.opal-motion-lively{--o-m-scale:.85;--o-ease:cubic-bezier(.34,1.3,.4,1)} +.callout,button,.nav-file-title,.nav-folder-title{transition:transform calc(var(--o-m-base) * var(--o-m-scale)) var(--o-ease),box-shadow calc(var(--o-m-base) * var(--o-m-scale)) var(--o-ease),background calc(var(--o-m-fast) * var(--o-m-scale)) var(--o-ease)} +.markdown-rendered .callout:hover{transform:translateY(-2px)} +button:active{transform:scale(.96) translateY(1px);filter:brightness(.9)} +@keyframes opalBlurIn{from{opacity:0;filter:blur(6px)}to{opacity:1;filter:blur(0)}} +@keyframes opalSmoothIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}} +@keyframes opalBounceIn{0%{opacity:0;transform:translateY(12px)}60%{opacity:1;transform:translateY(-4px)}100%{transform:translateY(0)}} +.opal-ent-blur:not(.opal-motion-off) :is(.markdown-preview-sizer,.cm-sizer){animation:opalBlurIn calc(var(--o-m-slow) * var(--o-m-scale)) var(--o-ease) both} +.opal-ent-smooth:not(.opal-motion-off) :is(.markdown-preview-sizer,.cm-sizer){animation:opalSmoothIn calc(var(--o-m-base) * var(--o-m-scale)) var(--o-ease) both} +.opal-ent-bounce:not(.opal-motion-off) :is(.markdown-preview-sizer,.cm-sizer){animation:opalBounceIn calc(var(--o-m-slow) * var(--o-m-scale)) cubic-bezier(.34,1.4,.4,1) both} +@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}} +.opal-motion-off *{animation:none!important;transition:none!important} + +/* ===================================================================== + 17. 复古皮肤 + ===================================================================== */ +.opal-retro-synth{--o-base-n:#1a0f2e;--o-mantle-n:#140a24;--o-text:#e6d8ff} +.opal-retro-synth .cm-header-1{color:#ff5fd0;text-shadow:0 0 8px #ff5fd0} +.opal-retro-green{--o-base-n:#001100;--o-text:#33ff66;--o-mantle-n:#000a00} +.opal-retro-green .markdown-rendered{text-shadow:0 0 6px rgba(51,255,102,.5)} +.opal-retro-amber{--o-base-n:#1a1000;--o-text:#ffb642;--o-mantle-n:#120b00} +.opal-retro-amber .markdown-rendered{text-shadow:0 0 6px rgba(255,182,66,.45)} +.opal-retro-matrix{--o-base-n:#000806;--o-text:#4dffa6;--o-mantle-n:#00110b} +.opal-retro-matrix .markdown-preview-sizer{background-image:linear-gradient(rgba(77,255,166,.05) 1px,transparent 1px);background-size:100% 3px} + +/* ===================================================================== + 19. 界面区域适配（标签页/命令面板/ribbon/内联标题/设置/图谱/脚注/状态栏/提示） + 多数靠设 Obsidian 原生变量，稳且不与未来类名改动冲突 + ===================================================================== */ +body{ + --tab-background-active: var(--o-base); + --tab-text-color-active: var(--o-text); + --tab-text-color-focused-active-current: var(--o-text); + --prompt-border-color: var(--o-surface1); + --ribbon-background: var(--o-mantle); + --inline-title-color: var(--h1-color); + --inline-title-weight: var(--h1-weight); + --modal-background: var(--o-base); + --modal-border-color: var(--o-surface1); + --modal-radius: var(--radius-l); + --graph-node: var(--o-subtext1); + --graph-node-focused: var(--o-accent); + --graph-node-tag: var(--o-orchid); + --graph-node-attachment: var(--o-teal); + --graph-node-unresolved: var(--o-overlay1); + --graph-line: var(--o-surface2); + --graph-text: var(--o-subtext0); + --footnote-id-color: var(--o-accent); + --footnote-divider-color: var(--o-surface1); + --status-bar-text-color: var(--o-subtext0); + --status-bar-border-color: var(--o-surface1); +} +body{--inline-title-font: var(--o-font-heading)} +.workspace-tab-header.is-active{box-shadow:inset 0 2px 0 var(--o-accent)} +.prompt{border:var(--o-bw) solid var(--o-surface1);border-radius:var(--o-r)} +.suggestion-item.is-selected{background:var(--o-soft-accent)} +.side-dock-ribbon-action:hover{color:var(--o-accent)} +.vertical-tab-nav-item.is-active{background:var(--o-soft-accent);color:var(--o-text)} +.graph-controls{background:var(--o-mantle);border:var(--o-bw) solid var(--o-surface1);border-radius:var(--radius-m)} +.status-bar-item.mod-clickable:hover{color:var(--o-text)} +.tooltip{color:var(--o-text)} /* 原生硬编码 #FAFAFA，浅色下会看不见，这里跟随主题文字色 */ +.footnote-ref a,sup.footnote-ref{color:var(--o-accent)} + +/* ===================================================================== + 20. Bases（native 数据库视图）：接进 Opal 调色板 + ===================================================================== */ +.bases-view{ + --bases-table-header-background: var(--o-surface0); + --bases-table-header-color: var(--o-subtext0); + --bases-table-border-color: var(--o-surface1); + --bases-table-row-background-hover: color-mix(in oklab,var(--o-accent) 8%,transparent); + --bases-table-group-background: var(--o-mantle); + --bases-cards-background: var(--o-mantle); + --bases-cards-cover-background: var(--o-surface0); +} +.bases-table-container{border-radius:var(--radius-m)} +.bases-cards-item{border-radius:var(--radius-m)} +@supports (corner-shape: superellipse(1.2)){.opal-corner-squircle .bases-cards-item{corner-shape:var(--o-cshape)}} + +/* ===================================================================== + 21. 插件适配（用户已装、有明显 UI 的） + ===================================================================== */ +/* editing-toolbar：容器 id 选择器 + 官方变量 */ +#editingToolbarModalBar,.editingToolbarPopoverBar{ + --editing-toolbar-background-color: var(--o-mantle); + --editing-toolbar-icon-color: var(--o-subtext0); + background:var(--o-mantle);border:var(--o-bw) solid var(--o-surface1); + border-radius:var(--o-r);box-shadow:0 6px 22px -6px rgba(0,0,0,.45) +} +#editingToolbarModalBar .editingToolbarCommandItem:hover{background:var(--o-surface0);color:var(--o-text)} +.editingToolbar-Divider-Line{background:var(--o-surface1)} +.editingToolbarGlassAesthetic{backdrop-filter:blur(12px) saturate(1.2)} +/* calendar：只吃它文档化的 12 个稳定变量，作用域锁 #calendar-container */ +#calendar-container{ + --color-background-heading: transparent; + --color-background-weekend: color-mix(in oklab,var(--o-surface0) 40%,transparent); + --color-dot: var(--o-accent); + --color-arrow: var(--o-subtext0); + --color-button: var(--o-subtext0); + --color-text-title: var(--o-text); + --color-text-heading: var(--o-subtext0); + --color-text-day: var(--o-text); + --color-text-today: var(--o-accent); + --color-text-weeknum: var(--o-overlay1); +} +/* admonition：主体渲染成原生 callout，皮肤已自动套；这里补私有类兜底 */ +.admonition-title-content{font-weight:600} +/* timeline-view */ +.timeline-view--timeline{--timeline-view--item-color:var(--o-accent);--timeline-view--selected-item-color:var(--o-accent2);--canvas-background:var(--o-mantle)} +/* excel：吃它的外壳变量 */ +.workspace-leaf-content[data-type="excel-view"]{--sheet-toolbar-background-color:var(--o-mantle);--sheet-header-background-color:var(--o-surface0);--sheet-toolbar-divider-color:var(--o-surface1);--sheet-iframe-background-color:var(--o-base)} +/* d2：暗色下覆盖重编译按钮的硬白底 */ +.theme-dark .Preview__Recompile{background-color:var(--o-surface1)!important;color:var(--o-text)} + +/* ===================================================================== + 22. 编辑态（实时预览 CM6）补齐：把只在阅读态生效的装饰补到编辑器 + 作用域 .markdown-source-view.mod-cm6。表格挂件自带 .markdown-rendered，斑马/表头/hover/边框已自动生效； + 列表 bullet 走 .list-bullet::after 已两态通吃。此处补其余。 + ===================================================================== */ +/* 标题：字体到行级 + 每级色调变量 --o-hcol（不给 # 标记重上色）；渐变下划/单线底边跟随档位 */ +.markdown-source-view.mod-cm6 .cm-line.HyperMD-header{font-family:var(--o-font-heading)} +.markdown-source-view.mod-cm6 .HyperMD-header-1{--o-hcol:var(--h1-color)} +.markdown-source-view.mod-cm6 .HyperMD-header-2{--o-hcol:var(--h2-color)} +.markdown-source-view.mod-cm6 .HyperMD-header-3{--o-hcol:var(--h3-color)} +.markdown-source-view.mod-cm6 .HyperMD-header-4{--o-hcol:var(--h4-color)} +.markdown-source-view.mod-cm6 .HyperMD-header-5{--o-hcol:var(--h5-color)} +.markdown-source-view.mod-cm6 .HyperMD-header-6{--o-hcol:var(--h6-color)} +.opal-hdl-gradient .markdown-source-view.mod-cm6 .cm-line.HyperMD-header{background-image:linear-gradient(90deg,var(--o-hcol),transparent 65%);background-size:100% 2px;background-position:0 100%;background-repeat:no-repeat} +.opal-hdl-underline .markdown-source-view.mod-cm6 .cm-line.HyperMD-header{border-bottom:var(--o-bw) solid color-mix(in oklab,var(--o-hcol) 45%,transparent)} + +/* 分隔线：编辑态真实线是 widget 里的
，镜像阅读态五档 */ +.markdown-source-view.mod-cm6 hr{border:none;height:2px;background:linear-gradient(90deg,transparent,var(--o-surface2),transparent)} +.opal-div-solid .markdown-source-view.mod-cm6 hr{height:0;border-top:var(--o-bw) solid var(--o-surface2);background:none} +.opal-div-dash .markdown-source-view.mod-cm6 hr{height:0;border-top:var(--o-bw) dashed var(--o-surface2);background:none} +.opal-div-double .markdown-source-view.mod-cm6 hr{height:0;border-top:3px double var(--o-surface2);background:none} +.opal-div-dot .markdown-source-view.mod-cm6 hr{height:4px;background:radial-gradient(circle,var(--o-surface2) 1.4px,transparent 1.4px);background-size:12px 4px} + +/* 标签药丸：底色/上下 border 走基类，圆角只给首末段（哈希/语义色因 token 无 href 无法移植，编辑态统一 orchid） */ +.markdown-source-view.mod-cm6 .cm-hashtag{background:var(--o-surface0);color:var(--o-orchid)} +.markdown-source-view.mod-cm6 .cm-hashtag-begin{border-top-left-radius:20px;border-bottom-left-radius:20px} +.markdown-source-view.mod-cm6 .cm-hashtag-end{border-top-right-radius:20px;border-bottom-right-radius:20px} + +/* 引用块：底色统一走原生 --blockquote-background-color（在绑定层已设 surface0），两态通吃， + 不用直设 .HyperMD-quote 背景（会被原生带 .is-live-preview 的更高特异度规则盖掉）；竖条走 --blockquote-border-color */ + +/* 未创建链接：编辑态 is-unresolved 是独立 mark，官方保证的写法（不赌复合选择器） */ +.opal-unres-dash .markdown-source-view.mod-cm6 .is-unresolved .cm-underline{text-decoration:underline dashed;text-underline-offset:2px} +.opal-unres-dim .markdown-source-view.mod-cm6 .is-unresolved{opacity:.5} +.opal-unres-blur .markdown-source-view.mod-cm6 .is-unresolved{filter:blur(.4px);opacity:.7} +.opal-unres-badge .markdown-source-view.mod-cm6 .is-unresolved::after{content:"?";font-size:.7em;vertical-align:super;color:var(--o-amber);margin-left:1px} + +/* 任务扩展态：编辑态 data-task 挂在 .HyperMD-task-line 行上 */ +body:not(.opal-tasks-native) .HyperMD-task-line[data-task="/"] .task-list-item-checkbox{background:conic-gradient(var(--o-green) 0 42%,transparent 42%);border-color:var(--o-green)} +body:not(.opal-tasks-native) .HyperMD-task-line[data-task="-"]{text-decoration:line-through;color:var(--o-overlay1)} +body:not(.opal-tasks-native) .HyperMD-task-line[data-task="-"] .task-list-item-checkbox{border-color:var(--o-rose)} +body:not(.opal-tasks-native) .HyperMD-task-line[data-task=">"] .task-list-item-checkbox{border-color:var(--o-sky)} +body:not(.opal-tasks-native) .HyperMD-task-line[data-task="<"] .task-list-item-checkbox{border-color:var(--o-sky)} +body:not(.opal-tasks-native) .HyperMD-task-line[data-task="?"] .task-list-item-checkbox{border-color:var(--o-amber)} +body:not(.opal-tasks-native) .HyperMD-task-line[data-task="!"] .task-list-item-checkbox{border-color:var(--o-rose)} +body:not(.opal-tasks-native) .HyperMD-task-line[data-task="*"] .task-list-item-checkbox{border-color:var(--o-amber)} + +/* 内嵌图片：圆角/投影挂 img（两态通用类名） */ +.markdown-source-view.mod-cm6 .internal-embed.image-embed img{border-radius:var(--opal-img-radius,10px)} +.opal-img-shadow .markdown-source-view.mod-cm6 .internal-embed.image-embed img{box-shadow:0 6px 20px -8px rgba(0,0,0,.5)} + +/* 代码块 OpenType 特性 */ +.markdown-source-view.mod-cm6 .HyperMD-codeblock{font-feature-settings:var(--opal-font-features, normal)} + +/* ===================================================================== + 23. 打印 / 导出 + ===================================================================== */ +@media print { + body:not(.opal-print-dark){--background-primary:#fff!important;--background-primary-alt:#fff!important;--background-secondary:#fff!important;--text-normal:#222!important;--text-muted:#555!important} + .opal-pf-serif .markdown-rendered{font-family:var(--o-fallback-serif)} + .opal-pf-mono .markdown-rendered{font-family:var(--o-fallback-mono)} + .opal-pa-justify .markdown-rendered p{text-align:justify;text-indent:2em;hyphens:auto} + .opal-pa-left .markdown-rendered p{text-align:left;text-indent:0} + body:not(.opal-print-dark) .callout{box-shadow:none!important;background:#fff!important;border:1px solid #bbb!important;border-left:3px solid rgb(var(--callout-color))!important} + .markdown-rendered :is(h1,h2,h3,h4,h5,h6){break-after:avoid;background-image:none!important} + body:not(.opal-print-dark) .markdown-rendered :is(h1,h2,h3,h4,h5,h6){filter:saturate(.7) brightness(.55)} + .markdown-rendered p,.markdown-rendered li{orphans:2;widows:2} + .markdown-rendered *,.markdown-rendered{animation:none!important;transition:none!important;filter:none;text-shadow:none!important} + .hr-for-pagination hr{break-after:page;visibility:hidden} +}