发布 1.0.1

CHANGELOG.md

@@ -1,5 +1,13 @@
 # 更新日志 / Changelog
 
+## 1.0.1（2026-05-15）
+
+- 完善文档树文档图标：README、TODO、CHANGELOG、API、PROMPTS、CURSOR、CLAUDE、AGENTS 与 `Bug_*.md`
+- Callout 图标改为 `icons/icons.woff` 内置 glyph，放大图标尺寸，并补齐 Monokai 风格背景色与左边框
+- 第二层及以后文件夹折叠图标改用 `folder-dimmed2`，根目录第一层保留 Obsidian 原生折叠图标
+- Style Settings 增加关闭文档树图标开关
+- 优化文件树紧凑模式的字号、行高与图标间距
+
 ## 1.0.0（未发布 / Unreleased）
 
 - Monokai Syntax 初始版本 / Initial release
@@ -10,4 +18,4 @@
 - Style Settings 集成（5 种滤镜主题、紧凑模式、单色图标、强调色覆盖）/ Style Settings integration (5 filter themes, compact mode, monochrome icons, accent overrides)
 - 关系图谱与 Canvas 插件样式 / Graph view and Canvas plugin styles
 - WCAG 对比度合规 / WCAG contrast ratio compliance
-- Callout 与块引用 Monokai Pro 风格重设计（语义色左竖线、代码符号图标）/ Callout & blockquote Monokai Pro redesign (semantic left border, code-symbol icons)
+- Callout 与块引用 Monokai Pro 风格重设计（语义色左竖线）/ Callout & blockquote Monokai Pro redesign (semantic left border)

README.md

@@ -16,6 +16,14 @@ Monokai Syntax is an Obsidian community theme inspired by the Monokai Pro visual
 - Style Settings support for palette filters, density, icons, typography, and accents.
 - No remote runtime assets in the final theme CSS.
 
+## 1.0.1 Update
+
+- Expanded document icons for README, TODO, CHANGELOG, API, PROMPTS, CURSOR, CLAUDE, AGENTS, and `Bug_*.md` notes.
+- Reworked callout icons with glyphs from `icons/icons.woff`, with larger icons and Monokai-style semantic backgrounds and left borders.
+- Updated the file explorer so second-level and deeper folder collapse icons use `folder-dimmed2`, while root-level folders keep Obsidian's native collapse icon.
+- Added a Style Settings toggle to hide file tree icons.
+- Improved compact mode density for the file explorer.
+
 ## Installation
 
 ### Community Theme

README.zh.md

@@ -16,6 +16,14 @@ Monokai Syntax 是一个受 Monokai Pro 视觉语言启发的 Obsidian 社区主
 - 支持 Style Settings 调整调色板滤镜、密度、图标、字体与强调色。
 - 最终主题 CSS 不加载远程运行时资源。
 
+## 1.0.1 更新
+
+- 扩展文档图标覆盖：README、TODO、CHANGELOG、API、PROMPTS、CURSOR、CLAUDE、AGENTS 与 `Bug_*.md`。
+- Callout 图标改用 `icons/icons.woff` 内置 glyph，并放大图标尺寸，补齐 Monokai 风格语义背景色与左边框。
+- 文件树第二层及以后文件夹折叠图标改用 `folder-dimmed2`，根目录第一层保留 Obsidian 原生折叠图标。
+- Style Settings 新增关闭文档树图标开关。
+- 优化文件树紧凑模式的字号、行高与图标间距。
+
 ## 安装
 
 ### 社区主题

manifest.json

@@ -1,6 +1,6 @@
 {
   "name": "Monokai Syntax",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "minAppVersion": "1.0.0",
   "author": "lat3ncy"
 }

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "monokai-syntax",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "monokai-syntax",
-      "version": "1.0.0",
+      "version": "1.0.1",
       "license": "MIT",
       "devDependencies": {
         "sass": "^1.99.0",

package.json

@@ -1,6 +1,6 @@
       {
   "name": "monokai-syntax",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "面向 Obsidian 的 Monokai Syntax 主题。",
   "author": "lat3ncy",
   "license": "MIT",

scripts/generate-icon-theme.js

@@ -19,14 +19,41 @@ function cssContent(value) {
   return String(value);
 }
 
-function resolveDefinition(theme, iconId) {
-  const definition = theme.iconDefinitions?.[iconId];
+function iconByClass(theme, fontClass) {
+  const glyph = theme.glyphs?.find((item) => item.font_class === fontClass);
 
-  if (!definition?.fontCharacter) {
-    return theme.iconDefinitions?.[theme.file];
+  if (!glyph?.unicode) {
+    throw new Error(`找不到图标 glyph：${fontClass}`);
   }
 
-  return definition;
+  return {
+    fontCharacter: `\\${glyph.unicode}`,
+    fontColor: glyph.color ?? colorForIcon(fontClass),
+  };
+}
+
+function colorForIcon(fontClass) {
+  const accentColors = {
+    accent1: "#ff6188",
+    accent2: "#fc9867",
+    accent3: "#ffd866",
+    accent4: "#a9dc76",
+    accent5: "#78dce8",
+    accent6: "#ab9df2",
+  };
+  const specialColors = {
+    agent: "#ab9df2",
+    api: "#78dce8",
+    bug: "#ff6188",
+    changelog: "#fc9867",
+    cursor: "#66d9ef",
+    prompts: "#e6db74",
+    readme: "#a9dc76",
+    todo: "#ffd866",
+  };
+  const accent = fontClass.match(/accent[1-6]$/)?.[0];
+
+  return specialColors[fontClass] ?? accentColors[accent] ?? "#ffd866";
 }
 
 function normalizeFileNameSelector(fileName) {
@@ -54,15 +81,78 @@ if (!existsSync(themePath) || !existsSync(fontPath)) {
 
 const theme = readJson(themePath);
 const fontBase64 = readFileSync(fontPath).toString("base64");
-const defaultFileIcon = resolveDefinition(theme, theme.file);
+const defaultFileIcon = iconByClass(theme, "default-accent3");
 const obsidianFileExtensions = {
-  canvas: theme.fileExtensions?.json ?? "_json",
-  md: theme.languageIds?.markdown ?? "_markdown",
+  "7z": "archive-accent3",
+  astro: "astro-accent6",
+  bash: "shell-accent4",
+  bmp: "image-accent3",
+  c: "c-accent1",
+  canvas: "json-accent6",
+  cjs: "js-accent3",
+  cpp: "cpp-accent5",
+  cs: "csharp-accent6",
+  css: "css-accent2",
+  csv: "csv-accent3",
+  dart: "dart-accent5",
+  dockerfile: "docker-accent5",
+  env: "env-accent3",
+  gif: "image-accent3",
+  go: "go-accent5",
+  gql: "graphql-accent1",
+  graphql: "graphql-accent1",
+  h: "c-accent1",
+  hpp: "cpp-accent5",
+  html: "markup-accent2",
+  jpeg: "image-accent3",
+  jpg: "image-accent3",
+  js: "js-accent3",
+  json: "json-accent6",
+  jsx: "react-accent5",
+  kt: "kotlin-accent6",
+  less: "less-accent6",
+  lua: "lua-accent5",
+  md: "markdown-accent4",
+  mdx: "markdownx-accent4",
+  mjs: "js-accent3",
+  png: "image-accent3",
+  py: "python-accent4",
+  rb: "ruby-accent1",
+  rs: "rust-accent2",
+  sass: "sass-accent1",
+  scss: "sass-accent1",
+  sh: "shell-accent4",
+  sql: "sql-accent6",
+  svg: "svg-accent2",
+  svelte: "svelte-accent1",
+  swift: "swift-accent1",
+  tex: "tex-accent2",
+  toml: "toml-accent6",
+  ts: "typescript-accent5",
+  tsx: "react-accent5",
+  vue: "vue-accent4",
+  yaml: "yaml-accent3",
+  yml: "yaml-accent3",
+  zip: "archive-accent3",
 };
 const obsidianFileNames = {
-  "AGENTS.md": "_settings",
-  "README.md": theme.languageIds?.markdown ?? "_markdown",
-  "TODO.md": "_todo",
+  "AGENTS.md": "agent",
+  "agents.md": "agent",
+  "API.md": "api",
+  "api.md": "api",
+  "CHANGELOG.md": "changelog",
+  "changelog.md": "changelog",
+  "CLAUDE.md": "agent",
+  "claude.md": "agent",
+  "CURSOR.md": "cursor",
+  "cursor.md": "cursor",
+  "PROMPTS.md": "prompts",
+  "prompts.md": "prompts",
+  "package.json": "npm-accent1",
+  "README.md": "readme",
+  "readme.md": "readme",
+  "TODO.md": "todo",
+  "todo.md": "todo",
 };
 
 const lines = [
@@ -104,21 +194,22 @@ const lines = [
   "",
 ];
 
-const fileExtensions = { ...theme.fileExtensions, ...obsidianFileExtensions };
-
-for (const [extension, iconId] of sortedEntries(fileExtensions)) {
-  const definition = resolveDefinition(theme, iconId);
+for (const [extension, iconId] of sortedEntries(obsidianFileExtensions)) {
+  const definition = iconByClass(theme, iconId);
   const escapedExtension = cssAttribute(extension);
   lines.push(iconRule([`.nav-file-title[data-path$=".${escapedExtension}"]::before`], definition));
 }
 
-const fileNames = { ...theme.fileNames, ...obsidianFileNames };
-
-for (const [fileName, iconId] of sortedEntries(fileNames)) {
-  const definition = resolveDefinition(theme, iconId);
+for (const [fileName, iconId] of sortedEntries(obsidianFileNames)) {
+  const definition = iconByClass(theme, iconId);
   lines.push(iconRule(normalizeFileNameSelector(fileName), definition));
 }
 
+lines.push(iconRule([
+  '.nav-file-title[data-path^="Bug_"][data-path$=".md"]::before',
+  '.nav-file-title[data-path*="/Bug_"][data-path$=".md"]::before',
+], iconByClass(theme, "bug")));
+
 mkdirSync(dirname(outputPath), { recursive: true });
 writeFileSync(outputPath, `${lines.join("\n")}\n`);
 

scripts/verify-icons.js

@@ -7,11 +7,15 @@ const wrapperPath = resolve(rootDir, "src/scss/components/_file-icons.scss");
 const componentIndexPath = resolve(rootDir, "src/scss/components/_index.scss");
 const packagePath = resolve(rootDir, "package.json");
 const auditPath = resolve(rootDir, "scripts/audit-css.js");
+const styleSettingsPath = resolve(rootDir, "src/css/style-settings/30-icons.css.md");
+const activeVisualPath = resolve(rootDir, "src/scss/_active-visual-overrides.scss");
 
 const files = {
   generated: existsSync(generatedPath) ? readFileSync(generatedPath, "utf8") : "",
   wrapper: existsSync(wrapperPath) ? readFileSync(wrapperPath, "utf8") : "",
   index: readFileSync(componentIndexPath, "utf8"),
+  styleSettings: readFileSync(styleSettingsPath, "utf8"),
+  activeVisual: readFileSync(activeVisualPath, "utf8"),
   packageJson: JSON.parse(readFileSync(packagePath, "utf8")),
   audit: readFileSync(auditPath, "utf8"),
 };
@@ -24,13 +28,28 @@ const checks = [
   ["构建前会生成图标", files.packageJson.scripts?.prebuild === "node scripts/generate-icon-theme.js"],
   ["存在验证脚本", files.packageJson.scripts?.["verify:icons"] === "node scripts/verify-icons.js"],
   ["内联 woff 字体", /data:font\/woff;base64,/.test(files.generated)],
-  ["图标 content 使用 CSS Unicode 转义", /content: "\\EA[0-9A-F]{2}";/.test(files.generated)],
-  ["图标 content 未被双重转义", !/content: "\\\\EA[0-9A-F]{2}";/.test(files.generated)],
+  ["图标 content 使用 CSS Unicode 转义", /content: "[\\][0-9a-f]{4}";/i.test(files.generated)],
+  ["图标 content 未被双重转义", !/content: "[\\][\\][0-9a-f]{4}";/i.test(files.generated)],
   ["默认文件图标规则", /\.nav-file-title::before/.test(files.generated)],
   ["Markdown 扩展名规则", /\[data-path\$="\.md"\]::before/.test(files.generated)],
   ["package.json 文件名规则", /\[data-path\$="\/package\.json"\]::before/.test(files.generated)],
-  ["TODO.md 文件名规则", /\[data-path\$="\/TODO\.md"\]::before/.test(files.generated)],
-  ["不生成额外文件夹图标", !/\.nav-folder-title::before/.test(files.generated)],
+  ["README.md/readme.md 文件名规则", /\[data-path\$="\/README\.md"\]::before/.test(files.generated) && /\[data-path\$="\/readme\.md"\]::before/.test(files.generated)],
+  ["TODO.md/todo.md 文件名规则", /\[data-path\$="\/TODO\.md"\]::before/.test(files.generated) && /\[data-path\$="\/todo\.md"\]::before/.test(files.generated)],
+  ["CHANGELOG.md/changelog.md 文件名规则", /\[data-path\$="\/CHANGELOG\.md"\]::before/.test(files.generated) && /\[data-path\$="\/changelog\.md"\]::before/.test(files.generated)],
+  ["API.md/api.md 文件名规则", /\[data-path\$="\/API\.md"\]::before/.test(files.generated) && /\[data-path\$="\/api\.md"\]::before/.test(files.generated)],
+  ["PROMPTS.md/prompts.md 文件名规则", /\[data-path\$="\/PROMPTS\.md"\]::before/.test(files.generated) && /\[data-path\$="\/prompts\.md"\]::before/.test(files.generated)],
+  ["CURSOR.md/cursor.md 文件名规则", /\[data-path\$="\/CURSOR\.md"\]::before/.test(files.generated) && /\[data-path\$="\/cursor\.md"\]::before/.test(files.generated)],
+  ["CLAUDE.md/claude.md 文件名规则", /\[data-path\$="\/CLAUDE\.md"\]::before/.test(files.generated) && /\[data-path\$="\/claude\.md"\]::before/.test(files.generated)],
+  ["AGENTS.md/agents.md 文件名规则", /\[data-path\$="\/AGENTS\.md"\]::before/.test(files.generated) && /\[data-path\$="\/agents\.md"\]::before/.test(files.generated)],
+  ["Bug_ 开头文档规则", /\[data-path\*="\/Bug_"\]\[data-path\$="\.md"\]::before/.test(files.generated)],
+  ["第二层文件夹使用 folder-dimmed2 折叠图标", /\.nav-folder-children\s+\.nav-folder-children\s+\.nav-folder-title\s+\.collapse-icon[\s\S]*content:\s*"\\e64d";/.test(files.wrapper)],
+  ["兼容 Obsidian 折叠图标类名", /\.nav-folder-collapse-indicator/.test(files.wrapper) && /\.collapse-icon/.test(files.wrapper)],
+  ["第一层文件夹保留 Obsidian 原生折叠图标", !/\.nav-folder\.mod-root\s*>\s*\.nav-folder-children\s*>\s*\.nav-folder\s*>\s*\.nav-folder-title\s+\.nav-folder-collapse-indicator[\s\S]*content:\s*"\\e64d";/.test(files.wrapper)],
+  ["Style Settings 可关闭文档树图标", /monokai-syntax-hide-file-tree-icons/.test(files.styleSettings) && /body\.monokai-syntax-hide-file-tree-icons/.test(files.wrapper)],
+  ["Callout 图标使用 icons.woff 字体", /font-family:\s*monokai-pro-icons/.test(files.activeVisual) && /callout\[data-callout="bug"\][\s\S]*content:\s*"\\e675";/.test(files.activeVisual)],
+  ["所有默认 Callout 类型都有背景与边框映射", ["note", "abstract", "info", "todo", "tip", "question", "warning", "failure", "bug", "success", "example", "quote"].every((name) => new RegExp(`--monokai-callout-${name}-bg`).test(files.activeVisual) || new RegExp(`--monokai-callout-${name}-bg`).test(readFileSync(resolve(rootDir, "src/scss/components/_editor.scss"), "utf8")))],
+  ["Callout 图标尺寸放大", /--callout-icon-size:\s*1\.25em/.test(readFileSync(resolve(rootDir, "src/scss/components/_editor.scss"), "utf8"))],
+  ["文件树扩展名颜色多样", /--monokai-file-icon-color:\s*#ff6188/.test(files.generated) && /--monokai-file-icon-color:\s*#fc9867/.test(files.generated) && /--monokai-file-icon-color:\s*#ffd866/.test(files.generated) && /--monokai-file-icon-color:\s*#a9dc76/.test(files.generated) && /--monokai-file-icon-color:\s*#78dce8/.test(files.generated) && /--monokai-file-icon-color:\s*#ab9df2/.test(files.generated)],
   ["保留 Obsidian 默认文件夹折叠指示器", /\.nav-folder-collapse-indicator/.test(readFileSync(resolve(rootDir, "src/scss/_base.scss"), "utf8"))],
   ["单色图标模式规则", /body\.monokai-syntax-monochrome-icons/.test(files.wrapper)],
   ["保留彩色图标模式", /--monokai-file-icon-color/.test(files.generated)],

scripts/verify-pip-editor.js

@@ -2,31 +2,34 @@ import { readFileSync } from "node:fs";
 import { resolve } from "node:path";
 
 const editorPath = resolve(import.meta.dirname, "../src/scss/components/_editor.scss");
+const activeVisualPath = resolve(import.meta.dirname, "../src/scss/_active-visual-overrides.scss");
 const editorScss = readFileSync(editorPath, "utf8");
+const activeVisualScss = readFileSync(activeVisualPath, "utf8");
 
 const checks = [
   ["行内代码使用强调背景变量", /--monokai-inline-code-background:/],
   ["行内代码不使用着色边框变量", !/--monokai-inline-code-border:/.test(editorScss)],
   ["阅读视图行内代码不使用边框阴影", /\.markdown-rendered[\s\S]*?code[\s\S]*?box-shadow:\s*none;/],
-  ["阅读视图块引用使用轻量背景变量", /\.markdown-rendered[\s\S]*?blockquote[\s\S]*?background-color:\s*var\(--monokai-blockquote-background\);/],
-  ["Obsidian 块引用原生变量同步轻量背景", /--blockquote-background-color:\s*var\(--monokai-blockquote-background\);/],
+  ["阅读视图块引用背景保持透明", /\.markdown-rendered[\s\S]*?blockquote[\s\S]*?background-color:\s*transparent;/],
+  ["Obsidian 块引用原生变量同步透明背景", /--blockquote-background-color:\s*transparent;/],
   ["Obsidian 块引用原生变量同步细边框", /--blockquote-border-thickness:\s*2px;/],
-  ["阅读视图块引用增加左侧呼吸感", /\.markdown-rendered[\s\S]*?blockquote[\s\S]*?padding:\s*var\(--spacing-3\) var\(--spacing-4\) var\(--spacing-3\) calc\(var\(--spacing-5\) \+ var\(--spacing-5\)\);/],
-  ["深色块引用背景保持克制", /\.theme-dark[\s\S]*?--monokai-blockquote-background:\s*rgb\(169 220 118 \/ 11%\);/],
-  ["浅色块引用背景保持克制", /\.theme-light[\s\S]*?--monokai-blockquote-background:\s*rgb\(38 157 105 \/ 9%\);/],
+  ["阅读视图块引用使用左边框", /\.markdown-rendered[\s\S]*?blockquote[\s\S]*?border-inline-start:\s*2px solid var\(--monokai-blockquote-border\);/],
+  ["阅读视图块引用增加左侧呼吸感", /\.markdown-rendered[\s\S]*?blockquote[\s\S]*?padding:\s*#\{\$spacing-3\} #\{\$spacing-3\} #\{\$spacing-3\} 1\.25rem;/],
+  ["深色块引用边框使用 Monokai 黄色", /\.theme-dark[\s\S]*?--monokai-blockquote-border:\s*#\{\$color-dark-blockquote-border\};/],
+  ["浅色块引用边框使用 Monokai 黄色", /\.theme-light[\s\S]*?--monokai-blockquote-border:\s*#\{\$color-light-blockquote-border\};/],
   ["Live Preview 块引用取消默认格式符号显示", /\.cm-formatting-quote[\s\S]*?display:\s*none;/],
   ["Live Preview 块引用标记不重复绘制边框", /\.cm-quote[\s\S]*?border-inline-start:\s*0;/],
-  ["Live Preview 块引用使用轻量背景变量", /\.HyperMD-quote[\s\S]*?background-color:\s*var\(--monokai-blockquote-background\);/],
-  ["Live Preview 块引用增加左侧呼吸感", /\.HyperMD-quote[\s\S]*?padding-inline-start:\s*calc\(var\(--spacing-5\) \+ var\(--spacing-5\)\);/],
-  ["Live Preview 块引用文本自身保留间距", /\.HyperMD-quote[\s\S]*?\.cm-quote[\s\S]*?padding-inline-start:\s*var\(--spacing-4\);/],
+  ["Live Preview 块引用背景保持透明", /\.HyperMD-quote[\s\S]*?background-color:\s*transparent;/],
+  ["Live Preview 块引用使用左边框", /\.HyperMD-quote[\s\S]*?border-inline-start:\s*2px solid var\(--monokai-blockquote-border\);/],
+  ["Live Preview 块引用文本自身保留间距", /\.HyperMD-quote[\s\S]*?\.cm-quote[\s\S]*?margin-left:\s*0\.6rem;/],
   ["浅色模式 H1-H3 字重为 700", /\.theme-light[\s\S]*?--monokai-heading-weight:\s*700;/],
   ["深色模式 H1-H3 字重为 600", /\.theme-dark[\s\S]*?--monokai-heading-weight:\s*600;/],
   ["标题样式使用 PIP 字重变量", /font-weight:\s*var\(--monokai-heading-weight\)/],
   ["高分屏文本平滑策略", /-webkit-font-smoothing:\s*antialiased;/],
-  ["深色 Callout 使用克制背景变量", /\.theme-dark[\s\S]*?--monokai-callout-background:\s*rgb\(102 217 239 \/ 14%\);/],
-  ["Obsidian Callout 原生变量同步面板 padding", /--callout-padding:\s*var\(--spacing-5\) calc\(var\(--spacing-5\) \+ var\(--spacing-2\)\);/],
-  ["Obsidian Callout 原生变量同步内容 padding", /--callout-content-padding:\s*var\(--spacing-3\) 0 0 0;/],
-  ["Callout 面板使用克制背景变量", /\.callout[\s\S]*?background-color:\s*var\(--monokai-callout-background\);/],
+  ["深色 Callout 使用语义背景变量", /\.theme-dark[\s\S]*?--monokai-callout-note-bg:\s*rgb\(102 217 239 \/ 12%\);/],
+  ["Obsidian Callout 原生变量同步面板 padding", /--callout-padding:\s*1\.25rem;/],
+  ["Obsidian Callout 原生变量同步内容 padding", /--callout-content-padding:\s*var\(--spacing-4\) 0 0 0;/],
+  ["Callout 面板使用语义背景变量", /\.callout[\s\S]*?background-color:\s*var\(--callout-background, transparent\);/],
   ["表格边框使用增强变量", /(?:\.markdown-rendered[\s\S]*?table|\.markdown-rendered[\s\S]*?th,[\s\S]*?\.markdown-rendered[\s\S]*?td)[\s\S]*?border:\s*1px solid var\(--monokai-table-border\);/],
   ["已完成任务保持可见", /\.markdown-rendered[\s\S]*?\.task-list-item\.is-checked[\s\S]*?color:\s*var\(--monokai-task-done-color\);/],
   ["未使用 !important", /^((?!important).)*$/s],
@@ -35,7 +38,10 @@ const checks = [
 let hasFailure = false;
 
 for (const [label, pattern] of checks) {
-  const passed = typeof pattern === "boolean" ? pattern : pattern.test(editorScss);
+  const scss = label.includes("块引用") || label.includes("Callout") || label.includes("Obsidian")
+    ? `${editorScss}\n${activeVisualScss}`
+    : editorScss;
+  const passed = typeof pattern === "boolean" ? pattern : pattern.test(scss);
   console.log(`${label}: ${passed ? "通过" : "失败"}`);
 
   if (!passed) {

src/css/style-settings/30-icons.css.md

@@ -9,4 +9,9 @@ settings:
     title: 单色图标
     type: class-toggle
     default: false
+  -
+    id: monokai-syntax-hide-file-tree-icons
+    title: 关闭文档树图标
+    type: class-toggle
+    default: false
 */

src/scss/_active-visual-overrides.scss

@@ -107,13 +107,73 @@ body .markdown-source-view.mod-cm6 .cm-line:has(.cm-callout-content) {
 body .markdown-preview-view.markdown-rendered .callout[data-callout="note"],
 body .markdown-rendered .callout[data-callout="note"],
 body .markdown-source-view.mod-cm6 .callout[data-callout="note"],
-body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="note"]),
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="note"]) {
+  --callout-background: var(--monokai-callout-note-bg);
+  --callout-border: var(--monokai-callout-note-border);
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="abstract"],
+body .markdown-rendered .callout[data-callout="abstract"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="abstract"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="abstract"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="summary"],
+body .markdown-rendered .callout[data-callout="summary"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="summary"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="summary"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="tldr"],
+body .markdown-rendered .callout[data-callout="tldr"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="tldr"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="tldr"]) {
+  --callout-background: var(--monokai-callout-abstract-bg);
+  --callout-border: var(--monokai-callout-abstract-border);
+}
+
 body .markdown-preview-view.markdown-rendered .callout[data-callout="info"],
 body .markdown-rendered .callout[data-callout="info"],
 body .markdown-source-view.mod-cm6 .callout[data-callout="info"],
 body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="info"]) {
-  --callout-background: var(--monokai-callout-note-bg);
-  --callout-border: var(--monokai-callout-note-border);
+  --callout-background: var(--monokai-callout-info-bg);
+  --callout-border: var(--monokai-callout-info-border);
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="todo"],
+body .markdown-rendered .callout[data-callout="todo"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="todo"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="todo"]) {
+  --callout-background: var(--monokai-callout-todo-bg);
+  --callout-border: var(--monokai-callout-todo-border);
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="tip"],
+body .markdown-rendered .callout[data-callout="tip"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="tip"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="tip"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="hint"],
+body .markdown-rendered .callout[data-callout="hint"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="hint"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="hint"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="important"],
+body .markdown-rendered .callout[data-callout="important"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="important"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="important"]) {
+  --callout-background: var(--monokai-callout-tip-bg);
+  --callout-border: var(--monokai-callout-tip-border);
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="question"],
+body .markdown-rendered .callout[data-callout="question"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="question"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="question"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="help"],
+body .markdown-rendered .callout[data-callout="help"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="help"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="help"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="faq"],
+body .markdown-rendered .callout[data-callout="faq"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="faq"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="faq"]) {
+  --callout-background: var(--monokai-callout-question-bg);
+  --callout-border: var(--monokai-callout-question-border);
 }
 
 body .markdown-preview-view.markdown-rendered .callout[data-callout="warning"],
@@ -123,7 +183,11 @@ body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="warning"]
 body .markdown-preview-view.markdown-rendered .callout[data-callout="caution"],
 body .markdown-rendered .callout[data-callout="caution"],
 body .markdown-source-view.mod-cm6 .callout[data-callout="caution"],
-body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="caution"]) {
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="caution"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="attention"],
+body .markdown-rendered .callout[data-callout="attention"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="attention"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="attention"]) {
   --callout-background: var(--monokai-callout-warning-bg);
   --callout-border: var(--monokai-callout-warning-border);
 }
@@ -140,6 +204,30 @@ body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="danger"])
   --callout-border: var(--monokai-callout-error-border);
 }
 
+body .markdown-preview-view.markdown-rendered .callout[data-callout="failure"],
+body .markdown-rendered .callout[data-callout="failure"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="failure"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="failure"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="fail"],
+body .markdown-rendered .callout[data-callout="fail"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="fail"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="fail"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="missing"],
+body .markdown-rendered .callout[data-callout="missing"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="missing"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="missing"]) {
+  --callout-background: var(--monokai-callout-failure-bg);
+  --callout-border: var(--monokai-callout-failure-border);
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="bug"],
+body .markdown-rendered .callout[data-callout="bug"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="bug"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="bug"]) {
+  --callout-background: var(--monokai-callout-bug-bg);
+  --callout-border: var(--monokai-callout-bug-border);
+}
+
 body .markdown-preview-view.markdown-rendered .callout[data-callout="success"],
 body .markdown-rendered .callout[data-callout="success"],
 body .markdown-source-view.mod-cm6 .callout[data-callout="success"],
@@ -147,11 +235,35 @@ body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="success"]
 body .markdown-preview-view.markdown-rendered .callout[data-callout="check"],
 body .markdown-rendered .callout[data-callout="check"],
 body .markdown-source-view.mod-cm6 .callout[data-callout="check"],
-body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="check"]) {
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="check"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="done"],
+body .markdown-rendered .callout[data-callout="done"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="done"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="done"]) {
   --callout-background: var(--monokai-callout-success-bg);
   --callout-border: var(--monokai-callout-success-border);
 }
 
+body .markdown-preview-view.markdown-rendered .callout[data-callout="example"],
+body .markdown-rendered .callout[data-callout="example"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="example"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="example"]) {
+  --callout-background: var(--monokai-callout-example-bg);
+  --callout-border: var(--monokai-callout-example-border);
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="quote"],
+body .markdown-rendered .callout[data-callout="quote"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="quote"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="quote"]),
+body .markdown-preview-view.markdown-rendered .callout[data-callout="cite"],
+body .markdown-rendered .callout[data-callout="cite"],
+body .markdown-source-view.mod-cm6 .callout[data-callout="cite"],
+body .markdown-source-view.mod-cm6 .cm-line:has(.callout[data-callout="cite"]) {
+  --callout-background: var(--monokai-callout-quote-bg);
+  --callout-border: var(--monokai-callout-quote-border);
+}
+
 /* ===== Callout 图标 ===== */
 
 body .markdown-preview-view.markdown-rendered .callout-icon,
@@ -164,6 +276,7 @@ body .markdown-source-view.mod-cm6 .cm-callout-icon {
   justify-content: center;
   overflow: visible;
   margin-right: 0.35em;
+  min-width: var(--callout-icon-size);
 }
 
 body .markdown-preview-view.markdown-rendered .callout-icon svg,
@@ -177,24 +290,45 @@ body .markdown-preview-view.markdown-rendered .callout-icon::before,
 body .markdown-rendered .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout-icon::before,
 body .markdown-source-view.mod-cm6 .cm-callout-icon::before {
-  display: inline;
-  font-family: var(--font-monospace-theme);
-  font-weight: 700;
-  font-size: 0.95em;
+  display: inline-block;
+  font-family: monokai-pro-icons, monospace;
+  font-size: var(--callout-icon-size);
+  font-style: normal;
+  font-weight: 400;
+  line-height: 1;
   color: var(--callout-border, var(--monokai-callout-note-border));
-  white-space: nowrap;
   -webkit-font-smoothing: antialiased;
+  speak: never;
+  text-rendering: auto;
 }
 
 body .markdown-preview-view.markdown-rendered .callout[data-callout="note"] .callout-icon::before,
 body .markdown-rendered .callout[data-callout="note"] .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout[data-callout="note"] .callout-icon::before,
-body .markdown-source-view.mod-cm6 .callout[data-callout="note"] .cm-callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="note"] .cm-callout-icon::before {
+  content: "\e66d";
+}
+
 body .markdown-preview-view.markdown-rendered .callout[data-callout="info"] .callout-icon::before,
 body .markdown-rendered .callout[data-callout="info"] .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout[data-callout="info"] .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout[data-callout="info"] .cm-callout-icon::before {
-  content: "#[i]";
+  content: "\e66f";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="abstract"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="abstract"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="abstract"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="abstract"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="summary"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="summary"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="summary"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="summary"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="tldr"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="tldr"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="tldr"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="tldr"] .cm-callout-icon::before {
+  content: "\e668";
 }
 
 body .markdown-preview-view.markdown-rendered .callout[data-callout="warning"] .callout-icon::before,
@@ -204,8 +338,12 @@ body .markdown-source-view.mod-cm6 .callout[data-callout="warning"] .cm-callout-
 body .markdown-preview-view.markdown-rendered .callout[data-callout="caution"] .callout-icon::before,
 body .markdown-rendered .callout[data-callout="caution"] .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout[data-callout="caution"] .callout-icon::before,
-body .markdown-source-view.mod-cm6 .callout[data-callout="caution"] .cm-callout-icon::before {
-  content: "<!>";
+body .markdown-source-view.mod-cm6 .callout[data-callout="caution"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="attention"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="attention"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="attention"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="attention"] .cm-callout-icon::before {
+  content: "\e671";
 }
 
 body .markdown-preview-view.markdown-rendered .callout[data-callout="error"] .callout-icon::before,
@@ -216,7 +354,29 @@ body .markdown-preview-view.markdown-rendered .callout[data-callout="danger"] .c
 body .markdown-rendered .callout[data-callout="danger"] .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout[data-callout="danger"] .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout[data-callout="danger"] .cm-callout-icon::before {
-  content: "[\00D7]";
+  content: "\e676";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="failure"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="failure"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="failure"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="failure"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="fail"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="fail"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="fail"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="fail"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="missing"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="missing"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="missing"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="missing"] .cm-callout-icon::before {
+  content: "\e66a";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="bug"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="bug"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="bug"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="bug"] .cm-callout-icon::before {
+  content: "\e675";
 }
 
 body .markdown-preview-view.markdown-rendered .callout[data-callout="success"] .callout-icon::before,
@@ -226,8 +386,67 @@ body .markdown-source-view.mod-cm6 .callout[data-callout="success"] .cm-callout-
 body .markdown-preview-view.markdown-rendered .callout[data-callout="check"] .callout-icon::before,
 body .markdown-rendered .callout[data-callout="check"] .callout-icon::before,
 body .markdown-source-view.mod-cm6 .callout[data-callout="check"] .callout-icon::before,
-body .markdown-source-view.mod-cm6 .callout[data-callout="check"] .cm-callout-icon::before {
-  content: "{\2713}";
+body .markdown-source-view.mod-cm6 .callout[data-callout="check"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="done"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="done"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="done"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="done"] .cm-callout-icon::before {
+  content: "\e66b";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="question"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="question"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="question"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="question"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="help"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="help"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="help"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="help"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="faq"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="faq"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="faq"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="faq"] .cm-callout-icon::before {
+  content: "\e66c";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="tip"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="tip"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="tip"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="tip"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="hint"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="hint"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="hint"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="hint"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="important"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="important"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="important"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="important"] .cm-callout-icon::before {
+  content: "\e66e";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="todo"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="todo"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="todo"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="todo"] .cm-callout-icon::before {
+  content: "\e670";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="quote"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="quote"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="quote"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="quote"] .cm-callout-icon::before,
+body .markdown-preview-view.markdown-rendered .callout[data-callout="cite"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="cite"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="cite"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="cite"] .cm-callout-icon::before {
+  content: "\e672";
+}
+
+body .markdown-preview-view.markdown-rendered .callout[data-callout="example"] .callout-icon::before,
+body .markdown-rendered .callout[data-callout="example"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="example"] .callout-icon::before,
+body .markdown-source-view.mod-cm6 .callout[data-callout="example"] .cm-callout-icon::before {
+  content: "\e674";
 }
 
 /* stylelint-enable selector-class-pattern */

src/scss/_mixins.scss

@@ -4,7 +4,8 @@
 }
 
 @mixin compact-density {
-  --nav-item-size: 26px;
+  --monokai-nav-font-size: 13px;
+  --nav-item-size: 22px;
   --ribbon-item-size: 32px;
   --input-height: 28px;
 }

src/scss/components/_editor.scss

@@ -10,7 +10,7 @@
   --monokai-inline-code-color: #a6e22e;
   --monokai-inline-code-background: var(--code-background);
   --callout-blend-mode: normal;
-  --callout-icon-size: 1em;
+  --callout-icon-size: 1.25em;
   --p-spacing: #{$spacing-3};
 
   -webkit-font-smoothing: antialiased;
@@ -23,12 +23,30 @@
   --monokai-blockquote-border: #{$color-dark-blockquote-border};
   --monokai-callout-note-bg: rgb(102 217 239 / 12%);
   --monokai-callout-note-border: #66d9ef;
+  --monokai-callout-abstract-bg: rgb(174 129 255 / 12%);
+  --monokai-callout-abstract-border: #ae81ff;
+  --monokai-callout-info-bg: rgb(102 217 239 / 12%);
+  --monokai-callout-info-border: #66d9ef;
+  --monokai-callout-todo-bg: rgb(230 219 116 / 12%);
+  --monokai-callout-todo-border: #e6db74;
+  --monokai-callout-tip-bg: rgb(166 226 46 / 12%);
+  --monokai-callout-tip-border: #a6e22e;
+  --monokai-callout-question-bg: rgb(174 129 255 / 12%);
+  --monokai-callout-question-border: #ae81ff;
   --monokai-callout-warning-bg: rgb(253 151 31 / 12%);
   --monokai-callout-warning-border: #fd971f;
   --monokai-callout-error-bg: rgb(249 38 114 / 12%);
   --monokai-callout-error-border: #f92672;
+  --monokai-callout-failure-bg: rgb(249 38 114 / 12%);
+  --monokai-callout-failure-border: #f92672;
+  --monokai-callout-bug-bg: rgb(249 38 114 / 12%);
+  --monokai-callout-bug-border: #f92672;
   --monokai-callout-success-bg: rgb(166 226 46 / 12%);
   --monokai-callout-success-border: #a6e22e;
+  --monokai-callout-example-bg: rgb(253 151 31 / 12%);
+  --monokai-callout-example-border: #fd971f;
+  --monokai-callout-quote-bg: rgb(248 248 242 / 8%);
+  --monokai-callout-quote-border: #8f908a;
   --monokai-inline-code-color: #a6e22e;
   --monokai-inline-code-background: var(--code-background);
   --monokai-table-border: rgb(248 248 242 / 18%);
@@ -41,12 +59,30 @@
   --monokai-blockquote-border: #{$color-light-blockquote-border};
   --monokai-callout-note-bg: rgb(20 116 138 / 14%);
   --monokai-callout-note-border: #14748a;
+  --monokai-callout-abstract-bg: rgb(107 83 148 / 13%);
+  --monokai-callout-abstract-border: #6b5394;
+  --monokai-callout-info-bg: rgb(20 116 138 / 14%);
+  --monokai-callout-info-border: #14748a;
+  --monokai-callout-todo-bg: rgb(151 116 0 / 14%);
+  --monokai-callout-todo-border: #977400;
+  --monokai-callout-tip-bg: rgb(38 157 105 / 14%);
+  --monokai-callout-tip-border: #269d69;
+  --monokai-callout-question-bg: rgb(107 83 148 / 13%);
+  --monokai-callout-question-border: #6b5394;
   --monokai-callout-warning-bg: rgb(225 96 50 / 14%);
   --monokai-callout-warning-border: #e16032;
   --monokai-callout-error-bg: rgb(225 71 117 / 14%);
   --monokai-callout-error-border: #e14775;
+  --monokai-callout-failure-bg: rgb(225 71 117 / 14%);
+  --monokai-callout-failure-border: #e14775;
+  --monokai-callout-bug-bg: rgb(225 71 117 / 14%);
+  --monokai-callout-bug-border: #e14775;
   --monokai-callout-success-bg: rgb(38 157 105 / 14%);
   --monokai-callout-success-border: #269d69;
+  --monokai-callout-example-bg: rgb(225 96 50 / 14%);
+  --monokai-callout-example-border: #e16032;
+  --monokai-callout-quote-bg: rgb(61 61 61 / 8%);
+  --monokai-callout-quote-border: #6f6f6f;
   --monokai-inline-code-color: #269d69;
   --monokai-inline-code-background: var(--code-background);
   --monokai-table-border: rgb(61 61 61 / 18%);

src/scss/components/_file-icons.scss

@@ -5,6 +5,53 @@
   align-items: center;
 }
 
+.nav-folder-title[data-path*="/"] .nav-folder-collapse-indicator,
+.nav-folder-title[data-path*="/"] .collapse-icon,
+.nav-folder[data-path*="/"] > .nav-folder-title .nav-folder-collapse-indicator,
+.nav-folder[data-path*="/"] > .nav-folder-title .collapse-icon,
+.nav-folder-children .nav-folder-children .nav-folder-title .nav-folder-collapse-indicator,
+.nav-folder-children .nav-folder-children .nav-folder-title .collapse-icon {
+  width: 1rem;
+
+  &::before {
+    content: "\e64d";
+    display: inline-block;
+    color: var(--icon-color);
+    font-family: monokai-pro-icons, monospace;
+    font-size: 1rem;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 1;
+    text-align: center;
+    text-rendering: auto;
+  }
+
+  svg {
+    display: none;
+  }
+}
+
+body.monokai-syntax-hide-file-tree-icons {
+  .nav-file-title::before,
+  .nav-folder-title[data-path*="/"] .nav-folder-collapse-indicator::before,
+  .nav-folder-title[data-path*="/"] .collapse-icon::before,
+  .nav-folder[data-path*="/"] > .nav-folder-title .nav-folder-collapse-indicator::before,
+  .nav-folder[data-path*="/"] > .nav-folder-title .collapse-icon::before,
+  .nav-folder-children .nav-folder-children .nav-folder-title .nav-folder-collapse-indicator::before,
+  .nav-folder-children .nav-folder-children .nav-folder-title .collapse-icon::before {
+    display: none;
+  }
+
+  .nav-folder-title[data-path*="/"] .nav-folder-collapse-indicator svg,
+  .nav-folder-title[data-path*="/"] .collapse-icon svg,
+  .nav-folder[data-path*="/"] > .nav-folder-title .nav-folder-collapse-indicator svg,
+  .nav-folder[data-path*="/"] > .nav-folder-title .collapse-icon svg,
+  .nav-folder-children .nav-folder-children .nav-folder-title .nav-folder-collapse-indicator svg,
+  .nav-folder-children .nav-folder-children .nav-folder-title .collapse-icon svg {
+    display: initial;
+  }
+}
+
 body.monokai-syntax-monochrome-icons {
   .nav-file-title::before {
     --monokai-file-icon-color: var(--icon-color);

src/scss/plugins/_style-settings.scss

@@ -42,10 +42,42 @@ body.monokai-syntax-filter-spectrum {
 body.monokai-syntax-compact {
   @include compact-density;
 
+  .nav-files-container {
+    font-size: var(--monokai-nav-font-size);
+  }
+
   .nav-file-title,
   .nav-folder-title {
+    min-height: var(--nav-item-size);
     line-height: var(--nav-item-size);
-    padding-block: 0;
+    padding: 0 6px;
+  }
+
+  .nav-file-title-content,
+  .nav-folder-title-content {
+    font-size: var(--monokai-nav-font-size);
+    line-height: var(--nav-item-size);
+  }
+
+  .nav-file-title::before {
+    width: 13px;
+    flex: 0 0 13px;
+    margin-inline-end: 4px;
+    font-size: 13px;
+  }
+
+  .nav-folder-collapse-indicator {
+    width: 14px;
+    margin-inline-end: 1px;
+  }
+
+  .nav-folder-title[data-path*="/"] .nav-folder-collapse-indicator::before,
+  .nav-folder-title[data-path*="/"] .collapse-icon::before,
+  .nav-folder[data-path*="/"] > .nav-folder-title .nav-folder-collapse-indicator::before,
+  .nav-folder[data-path*="/"] > .nav-folder-title .collapse-icon::before,
+  .nav-folder-children .nav-folder-children .nav-folder-title .nav-folder-collapse-indicator::before,
+  .nav-folder-children .nav-folder-children .nav-folder-title .collapse-icon::before {
+    font-size: 13px;
   }
 
   .side-dock-ribbon-action {

versions.json

@@ -1,3 +1,4 @@
 {
-  "1.0.0": "1.0.0"
+  "1.0.0": "1.0.0",
+  "1.0.1": "1.0.0"
 }