All Projects → Zuoqiu-Yingyi → siyuan-theme-dark-plus

Zuoqiu-Yingyi / siyuan-theme-dark-plus

Licence: AGPL-3.0 License
思源笔记的一款双色主题(A bicolor theme of SiYuan Note)

Programming Languages

CSS
56736 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to siyuan-theme-dark-plus

siyuan-themes-tsundoku-dark
a editor theme for siyuan note
Stars: ✭ 34 (+47.83%)
Mutual labels:  siyuan-note, siyuan-theme
siyuan-chrome
思源笔记 Chrome 扩展。A Chrome extension for SiYuan.
Stars: ✭ 34 (+47.83%)
Mutual labels:  siyuan
parsers
Specify is a central platform for companies who want to unify their brand identity, by connecting their design system tools.
Stars: ✭ 50 (+117.39%)
Mutual labels:  theme-ui
oceanpress
将 Markdown 文件转换为 HTML 生成静态站点的工具,专为思源笔记实现了许多特有渲染效果。
Stars: ✭ 61 (+165.22%)
Mutual labels:  siyuan
gatsby-themes
A collection of open source, well designed, highly customizable and 100% free Gatsby themes for blazing fast sites. We are working on the next version of the Flex theme. See https://github.com/reflexjs/reflexjs
Stars: ✭ 296 (+1186.96%)
Mutual labels:  theme-ui
gatsby-starter-specimens
Leverage the wide variety of powerful React components to build your design system. Display colors, typography or any other design tokens with ease. Works seamlessly with MDX.
Stars: ✭ 35 (+52.17%)
Mutual labels:  theme-ui
system-ui.com
Standards for creating consistent, interoperable user interfaces
Stars: ✭ 64 (+178.26%)
Mutual labels:  theme-ui
postcss-theme-ui
PostCSS plugin for accessing Theme UI variables
Stars: ✭ 22 (-4.35%)
Mutual labels:  theme-ui
gunfunded
Analyzing the gun lobby’s funding of Congress.
Stars: ✭ 32 (+39.13%)
Mutual labels:  theme-ui
lovelace-light-soft-ui-theme
🎨 Home Assistant soft UI light theme, with help from @JuanMTech, @thomasloven, and @N-l1.
Stars: ✭ 59 (+156.52%)
Mutual labels:  theme-ui
theme-starter
🐤 A sample Next.js project for getting started with MDX, Theme UI, & Hack Club Theme.
Stars: ✭ 71 (+208.7%)
Mutual labels:  theme-ui
firefly-theme
Firefly Glows to attract Mates, Firefly Pro Glows to attract Developers. A Pure Colourful Dark Theme for VsCode that Glows in Night, inspired by Fireflies.
Stars: ✭ 29 (+26.09%)
Mutual labels:  theme-ui
gatsby-minimal-portfolio
👔 JAMstack (Gatsby JS) content-focused portfolio blog starter. Features include dark-mode, installable PWA, SEO, code highlighting, form, CI/CD.
Stars: ✭ 36 (+56.52%)
Mutual labels:  theme-ui
TwoDark
Atom's OneDark inspired theme for Sublime Text
Stars: ✭ 19 (-17.39%)
Mutual labels:  theme-ui
Mdx Deck
♠️ React MDX-based presentation decks
Stars: ✭ 10,487 (+45495.65%)
Mutual labels:  theme-ui
theme
ImageGlass theme packs
Stars: ✭ 28 (+21.74%)
Mutual labels:  theme-ui
skin-ui
A Theme UI Live Preview and Code Editor 🎟️
Stars: ✭ 73 (+217.39%)
Mutual labels:  theme-ui
typora-nord-theme
A port of the popular Nord theme for Typora!
Stars: ✭ 25 (+8.7%)
Mutual labels:  theme-ui
llDark
适用于iOS深色模式的令人愉快的主题框架
Stars: ✭ 75 (+226.09%)
Mutual labels:  theme-ui
bazaar
思源笔记社区集市。SiYuan community bazaar.
Stars: ✭ 18 (-21.74%)
Mutual labels:  siyuan

🌙Dark+

GitHub release (latest by date including pre-releases) GitHub Release Date GitHub License GitHub last commit GitHub repo size hits GitHub all releases All Contributors

思源笔记的一款深色主题 (同时支持浅色模式, 没想到吧~)
A dark theme (which also supports light mode, can you imagine that ~) of SiYuan Note.

现已上架思源笔记社区集市, 如果您需要订阅思源笔记增值服务,欢迎使用我的推荐码: h0sc9rc
It is now on the shelves of the Siyuan Notes Community Bazaar. If you need to subscribe to the value-added services of siyuan note, please use my referral code: h0sc9rc

预览 | PREVIEW

浅色

深色

行级元素对齐

  • 使用等宽字体时所有行内元素对齐
    All inline elements are aligned when using a monospaced font.
  • 行内元素样式适配所有字号
    Inline element styles are adapted to all font sizes.

列表缩进对齐

  • 使用等宽字体时列表以 4 个半宽字符(2 个全宽字符)的宽度缩进
    When using a monospaced font, list indentation is 4 half-width characters (2 full-width characters).
  • 列表缩进样式适配所有字号
    List indentation styles are adapted to all font sizes.

常用中西文 2:1 等宽字体: 仿宋, 黑体, 楷体, 隶书, 宋体, 新宋体, 幼圆

介绍 | INTRODUCTION

贡献者介绍 | CONTRIBUTOR INTRODUCTION

功能 | Function 贡献者 | Contributor 项目 | Project
行内批注与注释
inline comments and notes
langzhou siyuan-note/siyuan-comment at main · langzhou/siyuan-note · GitHub

thxnder

💻

langzhou

💻

注: 该表格使用 All Contributors · GitHub 自动生成, 请到 emoji key 查看贡献类型
PS: The table is generated automatically using All Contributors · GitHub, go to emoji key to see the contribution type.

快捷键 | SHORTCUT KEYS

快捷键 | Shortcut Key 操作对象 | Operational objectives 功能 | Function
鼠标中键
Middle Mouse Button
整个窗口
entire window
在新窗口打开块或超链接
open the block or hyperlink in a new window
Shift + 鼠标中键
Shift + Middle Mouse Button
整个窗口
entire window
在新窗口打开块并聚焦
open the block in a new window and focus
Ctrl/⌘ + 鼠标中键
Ctrl/⌘ + Middle Mouse Button
超链接
hyperlink
设置自定义块属性
set the custom block attributes
Ctrl/⌘ + 鼠标中键
Ctrl/⌘ + Middle Mouse Button
视频块/音频块/iframe块
video block/audio block/iframe block
将当前时间戳写入剪贴板
write the current timestamp to the clipboard
Ctrl/⌘ + 鼠标左键
Ctrl/⌘ + Lift Mouse Button
视频块/音频块/iframe块
video block/audio block/iframe block
跳转到自定义块属性 time 所设置的时间点
jump to the point in time set by the custom block attribute time
Ctrl/⌘ + 鼠标左键
Ctrl/⌘ + Lift Mouse Button
挂件块/iframe块
widget block/iframe block
重新加载块内容
reload the block contents
Ctrl/⌘ + F1 当前文档
current document
渲染当前文档所有块的自定义样式
render the custom style for all blocks in the current document
Ctrl/⌘ + F5 整个窗口
entire window
重新加载整个窗口
reload the entire window
Shift + Alt + R 整个窗口
entire window
使用网络背景图片
use the web background images
Shift + Alt + T 整个窗口
entire window
启动/关闭打字机模式
turn on/off typewriter mode
Shift + Alt + I 整个窗口
entire window
启动/关闭反色模式
turn on/off invert color mode
Shift + Alt + C 当前文档
current document
复制当前文档 markdown 全文至剪贴板
copy the full markdown text of the current document to the clipboard
Shift + Alt + X 当前文档
current document
剪切当前文档 markdown 全文至剪贴板
cut the full markdown text of the current document to the clipboard
Shift + Alt + D 当前文档
current document
删除当前文档全文
delete the full content of the current documen
Ctrl/⌘ + Shift + Alt + R 整个窗口
entire window
使用自定义背景图片
use the custom background images
Ctrl/⌘ + Shift + Alt + O 当前文档
current document
复制当前文档大纲为有序列表
copy the current document outline as an ordered list
Ctrl/⌘ + Shift + Alt + U 当前文档
current document
复制当前文档大纲为无序列表
copy the current document outline as an unordered list
Ctrl/⌘ + Shift + Alt + T 当前文档
current document
复制当前文档大纲为任务列表
copy the current document outline as a task list

自定义块属性 | CUSTOM BLOCKS ATTRIBUTES

操作对象 | Operational objectives 属性名 | Attribute Name 属性值 | Attribute Value 功能 | Function
所有块
all types of blocks
font-family 等线
方正舒体
方正姚体
仿宋
黑体
华文彩云
华文仿宋
华文琥珀
华文楷体
华文隶书
华文宋体
华文细黑
华文新魏
华文行楷
华文中宋
楷体
隶书
宋体
微软雅黑
新宋体
幼圆
设置块所用字体族
Sets the font family used by the block.
所有块
all types of blocks
render danmaku
弹幕
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
将块设置为滚动弹幕样式
Set the block to the scrolling danmaku block style.
所有块
all types of blocks
render scroll
滚屏
滚动
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
为过长块设置纵向滚动条
Set the vertical scroll bar for the overly long block.
所有块
all types of blocks
render invert
反色
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
将图片渲染为反色
Render all images as inverted colors.
文档块
document blocks
background 01 ~ 12 设置文档的自定义背景图片
Sets a custom background image for the document.
文档块
document blocks
auto-num-h 0
false
禁用
关闭
禁用该文档子标题的自动编号
Disables automatic numbering of subheading in the document.
文档块
document blocks
auto-num-f
图片
Fig.
figure
Figure
FIGURE
启用该文档中图片的自动编号
Enable automatic numbering of pictures in the document.
文档块
document blocks
auto-num-t
表格
Tab.
table
Table
TABLE
启用该文档中表格的自动编号
Enable automatic numbering of tables in the document.
文档块
document blocks
render id
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
渲染每个块的块 ID
Renders the ID of each block.
文档块
document blocks
render index
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
渲染当前块在文档中的序号
Renders the ordinal number of the current block in the document.
文档块
document blocks
render content
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
渲染输入框中的内容
Renders the contents of the input box.
文档块
document blocks
render outline
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
渲染鼠标悬浮的块的轮廓
Renders the outline of a hovering block.
非文档块
non-document blocks
style css 样式
CSS styles
设置块的自定义样式
Set a custom style for the block.
非文档块
non-document blocks
title 任何值
Any value
设置块标题
Sets the title of the block.
视频块/音频块
video blocks/audio blocks
time ss
ss.ms
mm:ss
mm:ss.ms
hh:mm:ss
hh:mm:ss.ms
时间戳
Timestamp.
列表块
list blocks
type table
表格
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
列表渲染为表格
Renders the list as a table.
列表块
list blocks
list-guides 任何值
Any value
启用动态列表辅助线
Enable dynamic list guides.
表格块
table blocks
table-width auto
自动
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
启动表格内容自动换行
Enable table content wraps.
表格块
table blocks
table-width monospaced
等宽
(可使用空格分隔多个属性值 | You can separate multiple attribute values with spaces)
启动单元格等宽
Enable monospaced cell.
段落块
paragraph blocks
type 图标题
表标题
figure-title
table-title
(使用空格分隔多个属性值 | Separate multiple attribute values with spaces)
图标题/表标题自动计数
Figure titles/table titles are counted automatically.
段落块
paragraph blocks
writing-mode horizontal-tb
vertical-rl
vertical-lr
(默认)从左到右自上而下的书写方式 | (default)left-right-top-bottom
从上到下自右而左的书写方式 | top-bottom-right-left
从上到下自左而右的书写方式 | top-bottom-left-right

功能介绍 | FUNCTIONAL DESCRIPTION

  • 在其他主题中引用本主题模块
    Reference this theme modules in other themes.
    • <工作空间>/conf/appearance/themes/Dark+/theme.css 文件中直接粘贴所需模块到其他主题的 theme.css 文件或 custom.css 文件中
      Paste the desired module into theme.css file or custom.css file for another theme in the <workspace>/conf/appearance/themes/Dark+/theme.css file.
    • <工作空间>/conf/appearance/themes/Dark+/theme.js 文件复制到其他主题的目录下
      Copy the <workspace>/conf/appearance/themes/Dark+/theme.js file to the directory of the other theme.
    • 在其他主题中引用本主题模块时, 自定义配置文件 <工作空间>/data/widgets/custom.css<工作空间>/data/widgets/custom.js 依然生效
      Custom configuration files <workspace>/data/widgets/custom.css and <workspace>/data/widgets/custom.js also work when this theme modules were referenced in other theme modules.

  • 指向到思源 Web 静态文件服务目录的超链接显示图标
    Hyperlinks to the Siyuan Web Static File Service directory displays icons.
    • assets assets/: 资源文件目录 | Asset file directory
      • data/**/assets/
    • emojis emojis/: 表情文件目录 | Emoji file directory
      • data/emojis/
    • widgets widgets/: 挂件文件目录 | Widget file directory
      • data/widgets/
    • appearance appearance/: 外观文件目录 | Appearance file directory
      • conf/appearance/
    • export export/: 导出文件目录 | Export file directory
      • temp/export/
  • 指向资源文件目录下常见文件的超链接显示图标
    Hyperlinks to common files under the resource file directory display icons.
    • export: PDF
    • export: Word
    • export: PowerPoint
    • export: Excel
    • export: Image
    • export: Audio
    • export: Video
    • export: ZIP
    • export: Other
  • 指向第三方资源(URL Scheme)的超链接显示图标
    Hyperlinks(URL Scheme) to the third-party resource displays icons.
  • 使用 URL 参数 id=<内容块 ID> 从浏览器外跳转到 Web 端的指定块(必须已经打开至少一个页签)
    Jump from outside the browser to a specified block on the web side using the URL parameter id=<content block ID> (at least one tab must already be open)
    • 示例: http(s)://host:port/stage/build/desktop/?id=20220128124308-bancmue
      exanple: http(s)://host:port/stage/build/desktop/?id=20220128124308-bancmue
  • 使用 鼠标中键 单击块/超链接/块引用在新窗口打开
    Click on a block/link/block-reference to open a new window using the Middle Mouse Button.
  • 使用 Shift + 鼠标中键 单击块/超链接/块引用在新窗口打开并聚焦
    Click on a block/link/block-reference to open a window and focus using the Shift + Middle Mouse Button.
  • 使用超链接设置块属性
    Use hyperlinks to set block attributes.
    • 超文本引用: 指向想要设置块属性的块的超链接
      href: A hyperlink to the block for which you want to set the block attributes.
      • 示例 | example: siyuan://blocks/20220213230830-g1amobi
    • 标题: json 格式的一组键值对
      title: A set of key-value pairs in json format.
      • 示例 | example: {"memo": "timestamp", "custom-time": "00:00:01"}
    • 使用快捷键 Ctrl/⌘ + 鼠标中键 单击超链接设置自定义块属性
      Use the shortcut keys Ctrl/⌘ + Middle Mouse Button click the hyperlink to set the custom block attributes.
  • 使用快捷键 Ctrl/⌘ + 鼠标中键 单击视频块/音频块将当前时间戳写入剪贴板
    Use the shortcut keys Ctrl/⌘ + Middle Mouse Button click the video block or the audio block to write the current timestamp to the clipboard.
  • 使用快捷键 Ctrl/⌘ + 鼠标中键 单击 iframe 块将自定义块属性 time 所设置的时间点格式化为时间戳并写入剪贴板
    Use the shortcut keys Ctrl/⌘ + Middle Mouse Button click the iframe block to format the point in time set by the custom block attribute time as a timestamp and writes it to the clipboard.
  • 使用快捷键 Ctrl/⌘ + 鼠标左键 单击视频块/音频块/iframe 块跳转到自定义块属性 time 所设置的时间点
    Use the shortcut keys Ctrl/⌘ + Left Mouse Button click the video block, the audio block or iframe block to jump to the point in time set by the custom block attribute time.
  • 使用快捷键 Ctrl/⌘ + 鼠标左键 单击 Iframe 块或挂件块重新加载块内容
    Use the shortcut keys Ctrl/⌘ + Left Mouse Button click the iframe block or the widget block to reload the block contents.
  • 使用快捷键 Ctrl/⌘ + F5 重新加载整个窗口
    Use the shortcut key Ctrl/⌘ + F5 to reload the entire window.
  • 使用快捷键 Shift + Alt + R 使用网络背景图片
    Use the shortcut key Shift + Alt + R to use the web background images.
  • 使用快捷键 Shift + Alt + T 启动/关闭打字机模式
    Use the shortcut key Shift + Alt + T to turn on/off typewriter mode.
  • 使用快捷键 Shift + Alt + I 启动/关闭反色模式
    Use the shortcut key Shift + Alt + I to turn on/off invert color mode.
  • 使用快捷键 Shift + Alt + C 复制当前文档 markdown 全文至剪贴板
    Use the shortcut keys Shift + Alt + C to copy the full markdown text of the current document to the clipboard.
  • 使用快捷键 Shift + Alt + X 剪切当前文档 markdown 全文至剪贴板
    Use the shortcut keys Shift + Alt + X to cut the full markdown text of the current document to the clipboard.
  • 使用快捷键 Shift + Alt + D 删除当前文档全部内容
    Use the shortcut keys Shift + Alt + D to delete the full content of the current documen.
  • 使用快捷键 Ctrl/⌘ + Shift + Alt + R 使用自定义背景图片
    Use shortcut key Ctrl/⌘ + Shift + Alt + R to use the custom background images.
  • 使用快捷键 Ctrl/⌘ + Shift + Alt + O 复制当前文档大纲为有序列表
    Use shortcut key Ctrl/⌘ + Shift + Alt + O to copy the current document outline as an ordered list.
  • 使用快捷键 Ctrl/⌘ + Shift + Alt + U 复制当前文档大纲为无序列表
    Use shortcut key Ctrl/⌘ + Shift + Alt + U to copy the current document outline as an unordered list.
  • 使用快捷键 Ctrl/⌘ + Shift + Alt + T 复制当前文档大纲为任务列表
    Use shortcut key Ctrl/⌘ + Shift + Alt + T to copy the current document outline as a task list.
  • 块自定义属性 Block custom attributes.
    • font-family: 属性名 | key
      • 适用于所有块 | Applies to all blocks
      • 字体 | font
      • 属性值: 字体名称
        Attribute value: Font name
        • 等线
        • 方正舒体
        • 方正姚体
        • 仿宋
        • 黑体
        • 华文彩云
        • 华文仿宋
        • 华文琥珀
        • 华文楷体
        • 华文隶书
        • 华文宋体
        • 华文细黑
        • 华文新魏
        • 华文行楷
        • 华文中宋
        • 楷体
        • 隶书
        • 宋体
        • 微软雅黑
        • 新宋体
        • 幼圆
    • render: 属性名 | key
      • danmaku / 弹幕: 属性值 | value
        • 适用于所有块 | Applies to all blocks
          • 若为文档块, 将当前文档中所有最顶级的块设置为滚动弹幕样式
            If the block is a document block, set all the top-level blocks in the current document to the scrolling danmaku block style.
          • 若为非文档块, 将当前块设置为滚动弹幕样式
            If the block is not a document block, set the current block to the scrolling danmaku block style.
        • 将块设置为滚动弹幕样式
          Set the block to the scrolling danmaku block style.
      • scroll / 滚屏 / 滚动: 属性值 | value
        • 适用于所有块 | Applies to all blocks
          • 若为文档块, 为当前文档中所有最顶级的块添加滚动条
            If the block is a document block, add scroll bars to all the top-level blocks in the current document.
          • 若为非文档块, 为当前块添加滚动条
            If the block is not a document block, add a scroll bar to the current block.
      • invert / 反色: 属性值 | value
        • 适用于所有块 | Applies to all blocks
          • 若为文档块, 将当前文档中所有图片渲染为反色
            If the block is a document block, render all images in the current document as inverted colors.
          • 若为非文档块, 将当前块中所有图片渲染为反色
            If the block is not a document block, render all images in the current block as inverted colors.
    • background: 属性名 | key
      • 01 ~ 12: 属性值 | value
      • 适用于文档块 | Applies to document blocks
      • 设置文档的自定义背景图片 | Sets a custom background image for the document.
    • auto-num-h: 属性名 | key
      • 0 / false / 禁用 / 关闭: 属性值 | value
      • 适用于文档块 | Applies to document blocks
      • 禁用该文档子标题的自动编号 | isables automatic numbering of subheading in the document.
    • auto-num-f: 属性名 | key
      • : 属性值 | value
      • 图片: 属性值 | value
      • Fig.: 属性值 | value
      • figure: 属性值 | value
      • Figure: 属性值 | value
      • FIGURE: 属性值 | value
      • 适用于文档块 | Applies to document blocks
      • 启用该文档中图片的自动编号 | Enable automatic numbering of pictures in the document.
    • auto-num-t: 属性名 | key
      • : 属性值 | value
      • 表格: 属性值 | value
      • Tab.: 属性值 | value
      • table: 属性值 | value
      • Table: 属性值 | value
      • TABLE: 属性值 | value
      • 适用于文档块 | Applies to document blocks
      • 启用该文档中表格的自动编号 | Enable automatic numbering of tables in the document.
    • render: 属性名 | key
      • id: 属性值 | value
        • 渲染每个块的块 ID | Renders the ID of each block.
      • index: 属性值 | value
        • 渲染当前块在文档中的序号 | Renders the ordinal number of the current block in the document.
      • content: 属性值 | value
        • 渲染输入框中的内容 | Renders the contents of the input box.
      • outline: 属性值 | value
        • 渲染鼠标悬浮的块的轮廓 | Renders the outline of a hovering block.
      • 适用于文档块 | Applies to document blocks
    • style: 属性名 | key
      • 适用于所有块 | Applies to all blocks
      • 块样式 | block style
      • 设置后单击 确认 按钮将该自定义属性设置为块样式属性
        After setting, click the Confirm button to set the custom attribute to a block style attribute.
    • title: 属性名 | key
      • 适用于所有块 | Applies to all blocks
      • 在块的上方设置块标题 | Set the block title above the block.
    • time: 属性名 | key
      • <时间戳|timestamp>: 属性值 | value
        • 适用于视频块/音频块 | Applies to video blocks and audio blocks
        • 格式 | format
          • ss: ss >= 0
          • ss.ms: ss >= 0 && ms >= 0
          • mm:ss: mm >= 0 && 0 <= ss <= 59
          • mm:ss.ms: mm >= 0 && 0 <= ss <= 59 && ms >= 0
          • hh:mm:ss: hh >= 0 && 0 <= mm <= 59 && 0 <= ss <= 59
          • hh:mm:ss.ms: hh >= 0 && 0 <= mm <= 59 && 0 <= ss <= 59 && ms >= 0
        • 在视频块/音频块中设置该自定义属性后, 按住 Ctrl/⌘ 后单击视频/音频块可以跳转到该属性所设置的时间戳
          After you set this custom attribute in a video/audio block, clicking the video/audio block while ctrl/⌘-down jumps to the point in time.
    • type: 属性名 | key
      • table / 表格: 属性值 | value
      • 图标题表标题 | figure-title or table-title: 属性值 | value
        • 适用于段落块 | Applies to paragraph blocks
        • 图标题/表标题自动计数 | Figure titles/table titles are counted automatically
    • list-guides: 属性名 | key
      • 适用于列表块 | Applies to list blocks
      • 属性值可以设置为任意字符(不可为空)
        The attribute value can be set to any character(not nullable).
      • 启用动态列表辅助线 | Enable dynamic list guides
    • table-width: 属性名 | key
      • 适用于表格块 | Applies to table blocks
      • 设置表格宽度样式 | Sets the table width style.
      • auto / 自动: 属性值 | value
        • 表格宽度自动跟随文档宽度变化
          The table width automatically follows the document width.
      • monospaced / 等宽: 属性值 | value
        • 单元格等宽
          Cell is monospaced.
    • writing-mode: 属性名 | key
      • 适用于所有块 | Applies to all blocks
      • 文本排版模式 | text layout mode
      • 属性值 | attribute value
        • horizontal-tb
          • (默认)从左到右自上而下的书写方式 | (default)left-right-top-bottom
        • vertical-rl
          • 从上到下自右而左的书写方式 | top-bottom-right-left
        • vertical-lr
          • 从上到下自左而右的书写方式 | top-bottom-left-right
    • 其他自定义样式
      Other custom attributes.
      • 这些样式不会自动加载
        These styles are not loaded automatically.
      • 将自定义样式名添加到 <工作空间>/data/widgets/custom.jscustom.styles
        Add the custom style name to custom.styles in <workspace>/data/widgets/custom.js.
      • 在块的自定义属性中添加自定义样式名与样式值
        Add custom style names and style values to the block's custom attributes.
      • 使用快捷键 Ctrl + F1 / ⌘ + F1 渲染当前所有块的自定义样式
        Use the hot key Ctrl + F1 / ⌘ + F1 to render the custom style of all current blocks.

自定义配置 | CUSTOM CONFIG

自定义配置文件 | Custom configuration files 说明 | Product
<工作空间(workspace)>/data/widgets/custom.js 主题功能配置选项, 覆盖 <工作空间>/conf/appearance/themes/Dark+/style/module/config.js 中对应的值
Theme feature configuration, which overwrites the corresponding value in file <workspace>/conf/appearance/themes/Dark+/style/module/config.js
<工作空间(workspace)>/data/widgets/custom.css 主题共用样式配置, 覆盖 <工作空间>/conf/appearance/themes/Dark+/style/module/config.css 中对应的值
Themes share style configuration, which overwrites the corresponding value in file <workspace>/conf/appearance/themes/Dark+/style/module/config.css
<工作空间(workspace)>/data/widgets/custom-light.css 主题浅色样式配置, 覆盖 <工作空间>/conf/appearance/themes/Dark+/style/color/light.css 中对应的值
Theme light color style configuration, which overwrites the corresponding value in file <workspace>/conf/appearance/themes/Dark+/style/color/light.css
<工作空间(workspace)>/data/widgets/custom-dark.css 主题深色样式配置, 覆盖 <工作空间>/conf/appearance/themes/Dark+/style/color/dark.css 中对应的值
Theme dark color style configuration, which overwrites the corresponding value in file <workspace>/conf/appearance/themes/Dark+/style/color/dark.css

配置示例 | CONFIG EXAMPLE

custom.js

/* 路径 | Path
 * <工作空间>/data/widgets/custom.js
 * <workspace>/data/widgets/custom.js
 */

export var config = {
    token: '', // API token, 无需填写
    theme: {
        regs: {
            // 正则表达式
            url: /^siyuan:\/\/blocks\/(\d{14}\-[0-9a-z]{7})\/*(?:(?:\?)(\w+=\w+)(?:(?:\&)(\w+=\w+))+)?$/, // 思源 URL Scheme 正则表达式
            time: /^(\d+)(:[0-5]?[0-9]){0,2}(\.\d*)?$/, // 时间戳正则表达式
            id: /^\d{14}\-[0-9a-z]{7}$/, // 块 ID 正则表达式
        },
        goto: {
            enable: true, // 是否启用使用 URL 参数跳转指定块功能
        },
        style: {
            enable: false, // 是否启用自定义样式渲染
            save: {
                enable: true, // 是否启用保存自定义样式
            },
            render: {
                enable: true, // 是否启用自定义样式渲染
                toolbar: { // 菜单栏
                    enable: true,
                    id: 'theme-style-render',
                    label: '渲染自定义样式 [Ctrl + F1]\nRender custom styles',
                    icon: '#iconTheme',
                    index: 3,
                },
                styles: [
                    // 渲染的自定义样式
                    'font-size',
                ],
            },
            attribute: 'custom-style', // 自定义块属性名称
        },
        timestamp: {
            // 视频/音频时间戳
            enable: true, // 是否启用时间戳
            jump: {
                enable: true, // 是否启用跳转
            },
            create: {
                enable: true, // 是否启用生成时间戳
            },
            attribute: 'custom-time', // 自定义块属性名称
        },
        blockattrs: {
            // 块属性操作
            enable: true, // 是否启用块属性操作
            set: {
                enable: true, // 是否启用设置块属性
            },
        },
        reload: {
            // 重新加载
            enable: true, // 是否启用重新加载
            window: {
                enable: true, // 是否启用窗口重新加载
                toolbar: { // 菜单栏
                    enable: true,
                    id: 'theme-reload-window',
                    label: '重新加载窗口 [Ctrl + F5]\nReload the window',
                    icon: '#iconRefresh',
                    index: 0,
                },
            },
            iframe: {
                enable: true, // 是否启用 iframe 重新加载
            },
        },
        doc: {
            enable: true, // 是否启用文档扩展功能
            outline: {
                enable: true, // 是否启用当前文档大纲复制功能
                u: {
                    enable: true, // 无序列表
                    toolbar: { // 菜单栏
                        enable: true,
                        id: 'theme-doc-outline-u',
                        label: '复制当前文档大纲为无序列表 [Ctrl + Shift + Alt + U]\nCopy the current document outline as an unordered list',
                        icon: '#iconList',
                        index: 7,
                    },
                },
                o: {
                    enable: true, // 有序列表
                    toolbar: { // 菜单栏
                        enable: true,
                        id: 'theme-doc-outline-o',
                        label: '复制当前文档大纲为有序列表 [Ctrl + Shift + Alt + O]\nCopy the current document outline as an ordered list',
                        icon: '#iconOrderedList',
                        index: 8,
                    },
                },
                t: {
                    enable: true, // 任务列表
                    toolbar: { // 菜单栏
                        enable: true,
                        id: 'theme-doc-outline-t',
                        label: '复制当前文档大纲为任务列表 [Ctrl + Shift + Alt + T]\nCopy the current document outline as a task list',
                        icon: '#iconCheck',
                        index: 9,
                    },
                },
                style: {
                    // 大纲样式
                    content: 'link', // 内容样式('text': 文本, 'link': 链接, 'ref': 块引用)
                },
                headline: {
                    enable: false, // 是否在列表中添加标题级别标志
                    handler: (level, enable) => (enable ? `${'#'.repeat(level)} ` : ''),
                },
                top: 'h', // 大纲最顶层块类型('d': 文档块, 'h': 标题块)
            },
            copy: {
                enable: true, // 是否启用当前文档全文复制功能
                toolbar: { // 菜单栏
                    enable: true,
                    id: 'theme-doc-copy',
                    label: '复制当前文档内容 (Markdown) [Shift + Alt + C]\nCopy the current document content (Markdown)',
                    icon: '#iconCopy',
                    index: 10,
                },
            },
            delete: {
                enable: true, // 是否启用当前文档全文删除功能
                toolbar: { // 菜单栏
                    enable: false,
                    id: 'theme-doc-delete',
                    label: '删除当前文档内容 [Shift + Alt + D]\nDelete the current document content',
                    icon: '#iconTrashcan',
                    index: 12,
                },
            },
            cut: {
                enable: true, // 是否启用当前文档全文剪切功能
                toolbar: { // 菜单栏
                    enable: false,
                    id: 'theme-doc-cut',
                    label: '剪切当前文档内容 (Markdown) [Shift + Alt + X]\nDelete the current document content (Markdown)',
                    icon: '#iconCut',
                    index: 11,
                },
            },
        },
        typewriter: {
            // 打字机模式开关
            enable: true,
            switch: {
                enable: true, // 是否启用打字机模式开关
                toolbar: { // 菜单栏
                    enable: true,
                    id: 'theme-typewriter-switch',
                    label: '打字机模式 [Shift + Alt + T]\nTypewriter mode',
                    icon: '#iconKeymap',
                    index: -1,
                },
                NodeCodeBlock: {
                    enable: false, // 是否在代码块中启用打字机模式
                    mode: 'row', // 打字机模式,`row`: 聚焦行, 'block': 聚焦代码块
                },
                NodeTable: {
                    enable: true, // 是否在表格块中启用打字机模式
                    mode: 'row', // 打字机模式,`row`: 聚焦行, 'block': 聚焦表格块
                },
            },
        },
        invert: {
            // 反色功能开关
            enable: true,
            toolbar: { // 菜单栏
                enable: true,
                id: 'theme-invert',
                label: '反色显示 [Shift + Alt + I]\nDisplay in reverse color',
                icon: '#iconMoon',
                index: -2,
            },
            img: {
                // 图片反色
                enable: true,
                style: {
                    id: 'theme-invert-img-style', // 图片反色 ID
                    innerHTML: 'img:not(.emoji, .thumbnailImage), div.thumbnailSelectionRing {filter: invert(100%);}div.protyle-background__icon>img,span.b3-list-item__icon>img {filter: none;}', // 样式标签内容
                },
            },
            viewer: {
                // PDF 预览反色
                enable: true,
                style: {
                    id: 'theme-invert-viewer-style', // 图片反色 ID
                    innerHTML: '#viewer {filter: invert(100%);}', // 样式标签内容
                },
            },
            iframe: {
                // iframe 反色
                enable: true,
                style: {
                    id: 'theme-invert-iframe-style', // 图片反色 ID
                    innerHTML: 'iframe {filter: invert(100%);}', // 样式标签内容
                },
            },
            video: {
                // 视频反色
                enable: true,
                style: {
                    id: 'theme-invert-video-style', // 图片反色 ID
                    innerHTML: 'video {filter: invert(100%);}', // 样式标签内容
                },
            },
        },
        background: {
            // 背景图片功能开关
            enable: true,
            image: {
                enable: true, // 是否启用背景图片更改功能
                web: {
                    enable: true, // 网络背景图片
                    toolbar: { // 菜单栏
                        enable: true,
                        id: 'theme-background-image-random',
                        label: '更换背景图片 (网络) [Shift + Alt + R]\nChange background image (Web)',
                        icon: '#iconImage',
                        index: 5,
                    },
                    random: true, // 是否随机切换网络背景图片 URL
                    light: [ // 随机亮色背景图片 URL
                        'https://source.unsplash.com/random/1920x1080/?bright',
                        'https://api.dujin.org/bing/1920.php',
                        'https://unsplash.it/1920/1080?random',
                        // 'https://api.ixiaowai.cn/gqapi/gqapi.php⁠⁠⁠⁠⁠⁠',
                    ],
                    dark: [ // 随机暗色背景图片 URL
                        'https://source.unsplash.com/random/1920x1080/?night',
                        'https://source.unsplash.com/random/1920x1080/?starry',
                        'https://source.unsplash.com/random/1920x1080/?dark',
                    ],
                },
                custom: {
                    enable: true, // 自定义背景图片
                    toolbar: { // 菜单栏
                        enable: true,
                        id: 'theme-background-image-custom',
                        label: '更换背景图片 (自定义) [Ctrl + Shift + Alt + R]\nChange background image (Custom)',
                        icon: '#iconImage',
                        index: 6,
                    },
                    random: true, // 是否随机选择自定义背景图片
                    default: false, // 是否默认使用自定义背景图片
                    light: [ // 自定义亮色背景图片 URL 列表
                        '/appearance/themes/Dark+/image/light/background (01).jpeg',
                        '/appearance/themes/Dark+/image/light/background (02).jpeg',
                        '/appearance/themes/Dark+/image/light/background (03).jpeg',
                        '/appearance/themes/Dark+/image/light/background (04).jpeg',
                        '/appearance/themes/Dark+/image/light/background (05).jpeg',
                        '/appearance/themes/Dark+/image/light/background (06).jpeg',
                    ],
                    dark: [ // 自定义暗色背景图片 URL 列表
                        '/appearance/themes/Dark+/image/background (01).jpg',
                        '/appearance/themes/Dark+/image/background (02).jpg',
                        '/appearance/themes/Dark+/image/background (03).jpg',
                        '/appearance/themes/Dark+/image/background (04).jpg',
                        '/appearance/themes/Dark+/image/background (05).jpg',
                        '/appearance/themes/Dark+/image/background (06).jpg',
                        '/appearance/themes/Dark+/image/background (07).jpg',
                        '/appearance/themes/Dark+/image/background (08).jpg',
                        '/appearance/themes/Dark+/image/background (09).jpg',
                        '/appearance/themes/Dark+/image/background (10).jpg',
                        '/appearance/themes/Dark+/image/background (11).jpg',
                        '/appearance/themes/Dark+/image/background (12).jpg',
                    ],
                },
            },
        },
        window: {
            enable: true, // 窗口功能开关
            open: {
                enable: true, // 打开窗口功能开关
                windowParams: {
                    // 窗口参数
                    width: 720, // 窗口宽度
                    height: 480, // 窗口高度
                    frame: true, // 是否显示边缘框
                    fullscreen: false, // 是否全屏显示
                    alwaysOnTop: true, // 是否置顶显示
                },
                panel: {
                    enable: true, // 打开一个新窗口
                    url: null, // 新窗口的 URL, 值 null 则为 '/stage/build/desktop/'
                    toolbar: { // 菜单栏
                        enable: true,
                        id: 'theme-window-open-panel',
                        label: '打开一个新窗口\nOpen a new window',
                        icon: '#iconExport',
                        index: 1,
                    },
                },
                block: {
                    // 新窗口打开当前块, 否则打开当前文档
                    enable: true,
                    outfocus: {
                        // 新窗口打开当前块, 否则打开当前文档
                        enable: true,
                        toolbar: { // 菜单栏
                            enable: true,
                            id: 'theme-window-open-block-outfocus',
                            label: '在新窗口打开当前块 [Shift + Alt + N]\nOpen the current block in a new window',
                            icon: '#iconExport',
                            index: 2,
                        },
                    },
                    infocus: {
                        // 新窗口打开当前块并聚焦, 否则打开当前文档
                        enable: true,
                        toolbar: { // 菜单栏
                            enable: true,
                            id: 'theme-window-open-block-infocus',
                            label: '在新窗口打开当前块并聚焦 [Ctrl + Shift + Alt + N]\nOpen the current block in a new window and focuses',
                            icon: '#iconExport',
                            index: 3,
                        },
                    },
                },
                link: {
                    enable: true, // 新窗口打开当链接/块引用
                    outfocus: {
                        enable: true, // 不聚焦
                    },
                    infocus: {
                        enable: true, // 聚焦
                    },
                },
            },
        },
        comment: {
            // 批注功能开关
            enable: true,
        },
        hotkeys: {
            // 快捷键
            style: {
                render: {
                    // 渲染(Ctrl + F1)
                    ctrlKey: true,
                    metaKey: true,
                    shiftKey: false,
                    altKey: false,
                    key: 'F1',
                },
            },
            timestamp: {
                jump: {
                    // 跳转到指定时间点(Ctrl + 单击)
                    ctrlKey: true,
                    metaKey: true,
                    shiftKey: false,
                    altKey: false,
                    type: 'click',
                },
                create: {
                    // 新建时间戳(Ctrl + 鼠标中键)
                    ctrlKey: true,
                    metaKey: true,
                    shiftKey: false,
                    altKey: false,
                    button: 1, // 鼠标中键
                },
            },
            blockattrs: {
                set: {
                    // 设置块属性(Ctrl + 鼠标中键)
                    ctrlKey: true,
                    metaKey: true,
                    shiftKey: false,
                    altKey: false,
                    button: 1, // 鼠标中键
                },
            },
            reload: {
                window: {
                    // 刷新当前窗口(Ctrl + F5)
                    ctrlKey: true,
                    metaKey: true,
                    shiftKey: false,
                    altKey: false,
                    key: 'F5',
                },
                iframe: {
                    // 刷新 iframe 块(Ctrl + 单击)
                    ctrlKey: true,
                    metaKey: true,
                    shiftKey: false,
                    altKey: false,
                    type: 'click',
                },
            },
            doc: {
                copy: {
                    // 复制当前文档全文(Shift + Alt + C)
                    ctrlKey: false,
                    metaKey: false,
                    shiftKey: true,
                    altKey: true,
                    key: 'C',
                },
                delete: {
                    // 删除当前文档全文(Shift + Alt + D)
                    ctrlKey: false,
                    metaKey: false,
                    shiftKey: true,
                    altKey: true,
                    key: 'D',
                },
                cut: {
                    // 剪切当前文档全文(Shift + Alt + X)
                    ctrlKey: false,
                    metaKey: false,
                    shiftKey: true,
                    altKey: true,
                    key: 'X',
                },
                outline: {
                    u: {
                        // 复制当前文档大纲(无序列表)至剪贴板(Ctrl + Shift + Alt + U)
                        ctrlKey: true,
                        metaKey: true,
                        shiftKey: true,
                        altKey: true,
                        key: 'U',
                    },
                    o: {
                        // 复制当前文档大纲(有序列表)至剪贴板(Ctrl + Shift + Alt + O)
                        ctrlKey: true,
                        metaKey: true,
                        shiftKey: true,
                        altKey: true,
                        key: 'O',
                    },
                    t: {
                        // 复制当前文档大纲(任务列表)至剪贴板(Ctrl + Shift + Alt + T)
                        ctrlKey: true,
                        metaKey: true,
                        shiftKey: true,
                        altKey: true,
                        key: 'T',
                    },
                },
            },
            typewriter: {
                switch: {
                    // 打字机模式开关(Shift + Alt + T)
                    ctrlKey: false,
                    metaKey: false,
                    shiftKey: true,
                    altKey: true,
                    key: 'T',
                },
            },
            invert: {
                switch: {
                    // 反色开关(Shift + Alt + I)
                    ctrlKey: false,
                    metaKey: false,
                    shiftKey: true,
                    altKey: true,
                    key: 'I',
                },
            },
            background: {
                image: {
                    web: {
                        // 更换网络背景图片(Shift + Alt + R)
                        ctrlKey: false,
                        metaKey: false,
                        shiftKey: true,
                        altKey: true,
                        key: 'R',
                    },
                    custom: {
                        // 更换自定义背景图片(Ctrl + Shift + Alt + I)
                        ctrlKey: true,
                        metaKey: true,
                        shiftKey: true,
                        altKey: true,
                        key: 'R',
                    },
                },
            },
            window: {
                open: {
                    block: {
                        outfocus: {
                            // 新窗口打开当前块, 否则打开当前文档(Shift + Alt + N)
                            ctrlKey: false,
                            metaKey: false,
                            shiftKey: true,
                            altKey: true,
                            key: 'N',
                        },
                        infocus: {
                            // 新窗口打开当前块并聚焦, 否则打开当前文档(Ctrl + Shift + Alt + N)
                            ctrlKey: true,
                            metaKey: true,
                            shiftKey: true,
                            altKey: true,
                            key: 'N',
                        },
                    },
                    link: {
                        outfocus: {
                            // 新窗口打开链接(鼠标中键)
                            ctrlKey: false,
                            metaKey: false,
                            shiftKey: false,
                            altKey: false,
                            button: 1, // 鼠标中键
                        },
                        infocus: {
                            // 新窗口打开链接并聚焦(Shift + 鼠标中键)
                            ctrlKey: false,
                            metaKey: false,
                            shiftKey: true,
                            altKey: false,
                            button: 1, // 鼠标中键
                        },
                    },
                },
            },
        },
    },
};

custom.css

/* 路径 | Path
 * <工作空间>/data/widgets/custom.css
 * <workspace>/data/widgets/custom.css
 */
:root {
    /* 标题层级标记与标题之间宽度 */
    --custom-h-mark-blank: 4px;

    /* 子标题折叠标记 | Subheadings collapse marker */
    /* REF [箭头图案 - Unicode 字符百科](https://unicode-table.com/cn/sets/arrow-symbols/) 
     * ⭿ ⭱ ⭳ ↥ ↧ ↨ ⭻ ⇞ ⭽ ↕ ⇝ ⬳ ⟿ ⇼ ⮉ ⮋ ...
     */
    --custom-h-fold-mark: "⭿";

    /* 子标题层级标记 | Subheading level markers */
    --custom-h1-mark: "¹";
    --custom-h2-mark: "²";
    --custom-h3-mark: "³";
    --custom-h4-mark: "⁴";
    --custom-h5-mark: "⁵";
    --custom-h6-mark: "⁶";

    /* --custom-h1-mark: "₁";
    --custom-h2-mark: "₂";
    --custom-h3-mark: "₃";
    --custom-h4-mark: "₄";
    --custom-h5-mark: "₅";
    --custom-h6-mark: "₆"; */

    /* 子标题序号缩放 | Subheadings ordinal scaling */
    --custom-h-num-font-size: 50%;

    /* 子标题及其对应大纲颜色 | Subheadings and their corresponding outline colors */
    --custom-h1-color: var(--b3-theme-on-background);
    --custom-h2-color: var(--b3-card-info-color);
    --custom-h3-color: var(--b3-card-warning-color);
    --custom-h4-color: var(--b3-card-success-color);
    --custom-h5-color: var(--b3-card-error-color);
    --custom-h6-color: var(--custom-color-8-3);

    /* 子标题缩进宽度 | The width of the subheading indentation */
    --custom-h1-indentation: 0.5em;
    --custom-h2-indentation: 1em;
    --custom-h3-indentation: 1.5em;
    --custom-h4-indentation: 2em;
    --custom-h5-indentation: 2.5em;
    --custom-h6-indentation: 3em;

    /* 块引用标记 | Block reference mark */
    /* --custom-quote-l: "「";
    --custom-quote-r: "」"; */

    /* 
     * ⸢: U+2E22
     * ⸥: U+2E25
     */
    --custom-quote-l: "⸢";
    --custom-quote-r: "⸥";

    /* 背景图片 | Background image */
    --custom-background-image: url("/appearance/themes/Dark+/image/background (05).jpg");

    /* 对话框背景图片 | Dialog background image */
    --custom-background-image-dialog: url("/appearance/themes/Dark+/image/background (01).jpg");

    /* 标签图标 | The icon of tag */
    --custom-span-tag-icon: url(/appearance/themes/Dark+/icon/tag.svg);

    /* 块引用波浪线动画图标 | The icon of wavy line animation */
    --custom-span-ref-animation-icon: url(/appearance/themes/Dark+/icon/wavy-line.svg);

    /* 图片反色滤波器 | Image inverted filter */
    --custom-image-filter-invert: invert(100%);

    /* 背景图片滤波器 | Background image filter */
    /* --custom-backdrop-filter: blur(16px); */
    --custom-backdrop-filter: none;

    /* 悬浮面板滤波器(引用预览, 菜单) | Hover panel filters (reference preview, menu)*/
    /* --custom-backdrop-popover-filter: blur(2px); */
    --custom-backdrop-popover-filter: none;

    /* 悬浮预览窗口最小高度 | The minimum height of the hover preview window */
    --custom-popover-min-height: 50%;

    /* 悬浮预览窗口最大宽度 | The maximum width of the hover preview window */
    --custom-popover-max-width: 50%;

    /* 悬浮菜单宽度 | The width of popover menu */
    --custom-popover-menu-width: auto;

    /* 功能面板间隔距离 | Function panel spacing distance */
    --custom-panel-distance: 8px;

    /* 功能面板分隔线补偿距离 | Function panel dividers compensate for distance
     * 需要设置为 --custom-panel-distance 的负值 | A negative value of --custom-panel-distance is required
     */
    --custom-separator-distance-compensation: calc(0px - var(--custom-panel-distance));

    /* 超级块内边距 | The inner margin of the superblock */
    --custom-block-padding: 8px;

    /* 圆角弧度 | Rounded arc */
    --custom-border-radius: 4px;

    /* 列表辅助线弧度 | Rounded arc of list guides line */
    --custom-list-guides-line-radius: 16px;

    /* 列表辅助线宽度 | The width of list guides line */
    --custom-list-guides-line-width: 2px;

    /* 列表辅助线颜色 | The color of list guides line */
    --custom-list-guides-line-color: var(--b3-theme-background-light);

    /* 列表辅助线与上层节点的接缝 | The seams between the list guides line and the upper layer nodes */
    --custom-list-guides-line-top: -4px;

    /* 列表辅助线与本层节点的接缝 | The seams between the list guides line and the local layer nodes */
    --custom-list-guides-line-right-t: calc(22px + 5em / 16);
    --custom-list-guides-line-right-u: calc(22px + 5em / 16);
    --custom-list-guides-line-right-o: calc(14px + 1em);

    /* 透明组件颜色 | Transparent component color */
    --custom-transparent-lighter: #3338;
    --custom-transparent-light: #222A;
    --custom-transparent: #222C;
    --custom-transparent-deep: #222D;
    --custom-transparent-deeper: #222E;

    /* 不透明的组件颜色 | Opaque component color */
    --custom-components-light: #444;
    --custom-components: #222;
    --custom-components-deep: #111;

    /* 已完成任务列表项颜色 | The color of completed task list item */
    --custom-list-task-done-color: var(--b3-theme-on-surface);

    /* 菜单栏(功能坞)背景颜色 | Menu bar (dock) background color */
    --custom-dock-background-color: var(--custom-transparent);

    /* 顶部工具栏背景颜色 | The background color of the top toolbar */
    --custom-tool-bar-background-color: var(--custom-transparent);

    /* 编辑区背景颜色 | The background color of the edit area */
    --custom-editor-background-color: var(--custom-transparent);

    /* 编辑区标题栏背景颜色 | The background color of the edit area title bar */
    --custom-editor-title-bar-background-color: transparent;

    /* 编辑区导航栏(面包屑)背景颜色 | The background color of the edit area navigation bar (breadcrumbs) */
    --custom-editor-breadcrumb-bar-background-color: var(--custom-components);

    /* 编辑区内边距 | Padding of editor pannel */
    --custom-editor-padding-left: 24px;
    --custom-editor-padding-right: 24px;

    /* 编辑区页签栏背景颜色 | The background color of the  edit area tab bar */
    --custom-tab-bar-background-color: var(--custom-transparent);

    /* 弹出窗口背景颜色 | The background color of the popover */
    --custom-popover-background-color: var(--custom-editor-background-color);

    /* 弹出窗口标题栏背景颜色 | The background color of the popover title bar */
    --custom-popover-title-bar-background-color: var(--b3-theme-surface);

    /* 弹出窗口导航栏(面包屑)背景颜色 | The background color of the popover navigation bar (breadcrumbs) */
    --custom-popover-breadcrumb-bar-background-color: var(--custom-editor-breadcrumb-bar-background-color);

    /* 对话框遮罩背景颜色 | Dialog scrim background color */
    --custom-dialog-scrim-background-color: var(--custom-transparent-light);

    /* 对话框背景颜色 | Dialog background color */
    --custom-dialog-background-color: var(--custom-transparent);

    /* 搜索对话框尺寸 | The size of the search dialog box. */
    --custom-dialog-search-width: 96vw;
    --custom-dialog-search-height: 96vh;
    
    /* 对话框自述页面背景颜色 | Dialog readme page background color */
    --custom-dialog-readme-background-color: var(--custom-transparent-deeper);

    /* iframe 块背景颜色 | The background color of iframe block */
    --custom-block-iframe-background-color: var(--custom-transparent);

    /* 代码块背景颜色 | The background color of code block */
    --custom-block-code-background-color: var(--custom-transparent-lighter);
    /* 代码块行号背景颜色 | The background color of code block linenumber */
    --custom-block-code-linenumber-background-color: var(--custom-transparent);

    /* 嵌入块背景颜色 | The background color of embed block */
    --custom-block-embed-background-color: var(--custom-transparent-lighter);

    /* 引述块背景颜色 | The background color of quote block */
    --custom-block-quote-background-color: var(--custom-transparent-lighter);

    /* 超级块背景颜色 | The background color of super block */
    --custom-block-super-background-color: var(--custom-transparent-lighter);

    /* 表格块背景颜色 | The background color of table block */
    --custom-block-table-background-color: transparent;
    /* 表头 | thead */
    --custom-block-table-thead-background-color: var(--custom-components-light);
    /* 奇数行 | odd line */
    --custom-block-table-odd-background-color: var(--custom-transparent-lighter);
    /* 偶数行 | even line */
    --custom-block-table-even-background-color: var(--custom-transparent-light);
    /* 鼠标悬浮行 | hover line */
    --custom-block-table-hover-background-color: var(--custom-components-light);

    /* 列表转换成的表格鼠标悬浮背景颜色 | The background color of the mouse hover row of the table converted by a list */
    --custom-list-table-hover-background-color: #FFF1;

    /* 弹出菜单 | popover menu */
    /* 弹出功能菜单背景颜色 | The background color of the popover function menu */
    --custom-popover-function-menu-background-color: var(--custom-transparent-deep);
    /* 弹出菜单背景颜色 | The background color of the popover menu */
    --custom-popover-menu-background-color: var(--custom-transparent-deep);
    /* 弹出菜单分隔线颜色 | The color of the popover menu */
    --custom-popover-menu-separator-color: var(--b3-theme-on-surface);
    /* 弹出菜单中块属性字段颜色 | The color of the search menu block attribute field */
    --custom-popover-menu-attribute-color: var(--b3-card-warning-color);
    /* 弹出菜单中路径字段颜色 | The color of the path field */
    --custom-popover-menu-path-color: var(--b3-card-info-color);
    /* 弹出菜单内边距宽度 | The padding width of the popover menu */
    --custom-popover-menu-padding-width: 0.25em;
    /* 弹出菜单轮廓宽度 | The outline width of the popover menu */
    --custom-popover-menu-outline-width: 1px;
    /* 弹出菜单轮廓样式 | The outline style of the popover menu */
    --custom-popover-menu-outline-style: solid;
    /* 弹出菜单轮廓颜色 | The outline color of the popover menu */
    --custom-popover-menu-outline-color: var(--b3-scroll-color);
    /* 弹出菜单输入框最小宽度 | The min width of the popover menu input */
    /* --custom-popover-menu-input-min-width: 50vw; */
    --custom-popover-menu-input-min-width: none;

    /* 预览窗口 | preview window */
    /* 图片预览窗口背景颜色 | The background color of the image preview window */
    --custom-viewer-image-background-color: var(--custom-transparent-light);

    /* 阴影散布宽度 | Shadow spread */
    --custom-box-shadow-spread: 8px;

    /* 鲜明颜色 | Striking color */
    --custom-striking-color: var(--b3-font-color12);

    /* 自定义线条颜色 | Line color */
    --custom-line-color: var(--b3-scroll-color);

    /* 数学公式整体缩放比例 | The overall scale of the mathematical formula */
    --custom-math-size: 100%;

    /* 数学公式上下标缩放比例 | The mathematical formula superscript scaling */
    --custom-math-sub-size: 100%;

    /* 数学公式编号的位置 | The position of the mathematical formula number */
    /* 固定在页面右侧 | Pinned to the right side of the page
     * - 公式过长时会被遮挡 | Formulas can be obscured when they are too long
     */
    /* --custom-math-tag-position: absolute; */
    /* 跟随在公式右侧 | Follow to the right of the formula
     * - 公式过长时需要滑动滚动条才能看到编号 | Formulas that are too long require sliding the scroll bar to see
     */
    --custom-math-tag-position: relative;

    /* 块引用标志颜色 | Block reference flag color */
    --custom-ref-mark-color: var(--b3-protyle-inline-link-color);

    /* 列表项聚焦颜色 | List item focus color */
    --custom-list-item-color: var(--b3-protyle-inline-link-color);

    /* 标记文字背景颜色 | The background color of the marker text */
    --cusotm-span-mark-background-color: var(--b3-theme-primary-lighter);

    /* 删除线颜色 | The color of the strikethrough */
    --cusotm-span-strikethrough-color: var(--b3-theme-on-surface);

    /* 思源内部超链接颜色 | The color of SiYuan internal hyperlink */
    --custom-span-siyuan-link-color: var(--custom-color-8-3);

    /* 思源块引用颜色 | The color of SiYuan block reference */
    --custom-span-block-ref-color: var(--custom-striking-color);

    /* 思源文件注释引用颜色 | The color of SiYuan file comment reference */
    --custom-span-file-ref-color: var(--b3-card-warning-color);

    /* 思源标签颜色 | The color of tag */
    --custom-span-tag-color: var(--b3-theme-on-primary);

    /* 思源标签背景颜色 | The background color of tag */
    --custom-span-tag-background-color: var(--b3-font-background9);
    --custom-span-doc-tag-background-color: var(--b3-theme-primary-lighter);

    /* 思源虚拟引用背景颜色 | The background color of virtual block ref */
    --custom-span-virtual-ref-background-color: var(--custom-components-light);

    /* 思源标记颜色 | The color of mark */
    --custom-span-mark-color: var(--b3-card-info-color);

    /* 思源标记阴影颜色 | The shadow color of mark */
    --custom-span-mark-shadow-color: var(--b3-theme-on-primary);

    /* 思源标记阴影宽度 | The shadow width of mark */
    --custom-span-mark-shadow-width: 4px;

    /* 拖拽参考线颜色 | The color of drag guide */
    --custom-drag-top-shadow-color: var(--b3-theme-primary-lighter);
    --custom-drag-bottom-shadow-color: var(--b3-theme-primary-lighter);
    --custom-drag-left-shadow-color: var(--custom-striking-color);
    --custom-drag-right-shadow-color: var(--custom-striking-color);

    /* 空行聚焦提示 | Blank line focus prompt */
    --custom-empty-focus-p: "´・-・)ノ㊫";
    --custom-empty-focus-c: "´・-・)ノ↹";
    --custom-empty-focus-t: "´・-・)ノ☑";
    --custom-empty-focus-u: "´・-・)ノ◉";
    --custom-empty-focus-o: "´・-・)ノ①";

    /* 空行提示 | Blank line prompt */
    --custom-empty-p: "这里是空的 (´・-・)ノ㊫";
    --custom-empty-c: "这里是空的 (´・-・)ノ↹";
    --custom-empty-t: "这里是空的 (´・-・)ノ☑";
    --custom-empty-u: "这里是空的 (´・-・)ノ◉";
    --custom-empty-o: "这里是空的 (´・-・)ノ①";

    /* 面板内字段名显示样式 | The field name display style within the panel */

    /* 自动换行显示字段名 | Wrap displays the field names */
    /* --custom-backlink-display: table-cell; */
    /* --custom-bookmark-display: table-cell; */
    /* --custom-file-display: table-cell; */
    /* --custom-outline-display: table-cell; */
    /* --custom-tag-display: table-cell; */

    /* 过长时仅显示部分名称(默认样式) | Only partial names are displayed when too long (default style) */
    --custom-backlink-display: -webkit-box;
    --custom-bookmark-display: -webkit-box;
    --custom-file-display: -webkit-box;
    --custom-outline-display: -webkit-box;
    --custom-tag-display: -webkit-box;

    /* 文档树匹配标题颜色(文档标题尾匹配) | Document tree match header color (document end-of-title match) */
    /* * */
    --custom-doctree-end-asterisk-color: var(--b3-card-success-color);
    /* # */
    --custom-doctree-end-sharp-color: var(--b3-card-info-color);
    /* ? */
    --custom-doctree-end-question-color: var(--b3-card-warning-color);
    /* ! */
    --custom-doctree-end-exclamation-color: var(--b3-card-error-color);

    /* 文档树匹配文档标题颜色(文档标题头匹配) | Document tree matches document title color (document header match) */
    /* * */
    --custom-doctree-begin-asterisk-color: var(--custom-color-9-3);
    /* # */
    --custom-doctree-begin-sharp-color: var(--custom-color-8-3);
    /* ? */
    --custom-doctree-begin-question-color: var(--custom-color-4-0);
    /* ! */
    --custom-doctree-begin-exclamation-color: var(--custom-color-6-0);
    /* @ */
    --custom-doctree-begin-at-color: var(--custom-color-5-0);
    /* . */
    --custom-doctree-begin-period-color: #0000;

    /* 弹幕块移动周期 | Danmaku block movement cycle */
    --custom-render-danmaku-time: 16s;

    /* 滚动条轨道背景颜色 | The background color of scroll track */
    --custom-scroll-track-background-color: var(--b3-border-color);

    /* 过长块的溢出高度 | The overflow height of a overly long block */
    --custom-scroll-max-height: 50vh;

    /* 表格单元格等宽启用时单元格宽度 | Table cell width when cell monospaced function is enabled */
    --custom-table-cell-monospaced-width: 256px;

    /* 自定义背景图片路径 | The file path of customize background image. */
    --custom-background-01: url("/appearance/themes/Dark+/image/background (01).jpg");
    --custom-background-02: url("/appearance/themes/Dark+/image/background (02).jpg");
    --custom-background-03: url("/appearance/themes/Dark+/image/background (03).jpg");
    --custom-background-04: url("/appearance/themes/Dark+/image/background (04).jpg");
    --custom-background-05: url("/appearance/themes/Dark+/image/background (05).jpg");
    --custom-background-06: url("/appearance/themes/Dark+/image/background (06).jpg");
    --custom-background-07: url("/appearance/themes/Dark+/image/background (07).jpg");
    --custom-background-08: url("/appearance/themes/Dark+/image/background (08).jpg");
    --custom-background-09: url("/appearance/themes/Dark+/image/background (09).jpg");
    --custom-background-10: url("/appearance/themes/Dark+/image/background (10).jpg");
    --custom-background-11: url("/appearance/themes/Dark+/image/background (11).jpg");
    --custom-background-12: url("/appearance/themes/Dark+/image/background (12).jpg");
}

custom-light.css

/* 路径 | Path
 * <工作空间>/data/widgets/custom-light.css
 * <workspace>/data/widgets/custom-light.css
 */
:root {
    /* 背景图片 */
    --custom-background-image: url("/appearance/themes/Dark+/image/light/background (05).jpeg");

    /* 对话框背景图片 */
    --custom-background-image-dialog: url("/appearance/themes/Dark+/image/light/background (01).jpeg");

    /* 标签图标 | The icon of tag */
    --custom-span-tag-icon: url(/appearance/themes/Dark+/icon/tag-light.svg);

    /* 块引用波浪线动画图标 | The icon of wavy line animation */
    --custom-span-ref-animation-icon: url(/appearance/themes/Dark+/icon/wavy-line-light.svg);

    /* 透明组件颜色 | Transparent component color */
    --custom-transparent-lighter: #1111;
    --custom-transparent-light: #2222;
    --custom-transparent: #EEEC;
    --custom-transparent-deep: #EEED;
    --custom-transparent-deeper: #EEEE;

    /* 不透明的组件颜色 | Opaque component color */
    --custom-components-light: #CCC;
    --custom-components: #DDD;
    --custom-components-deep: #EEE;

    /* 鲜明颜色 | Striking color */
    --custom-striking-color: var(--b3-graph-listitem-point);

    /* 思源块引用颜色 | The color of SiYuan block reference */
    --custom-span-block-ref-color: var(--custom-striking-color);

    /* 思源内部超链接颜色 | The color of SiYuan internal hyperlink */
    --custom-span-siyuan-link-color: var(--b3-protyle-inline-blockref-color);

    /* 子标题及其对应大纲颜色 | Subheadings and their corresponding outline colors */
    /* --custom-h1-color: var(--custom-color-3-0); */
    --custom-h2-color: var(--custom-color-4-4);
    --custom-h3-color: var(--custom-color-7-4);
    --custom-h4-color: var(--custom-color-9-0);
    --custom-h5-color: var(--custom-color-6-0);
    --custom-h6-color: var(--custom-color-8-0);

    /* 代码块行号背景颜色 | The background color of code block linenumber */
    --custom-block-code-linenumber-background-color: var(--custom-transparent-light);

    /* 思源标签颜色 | The color of tag */
    --custom-span-tag-color: var(--b3-theme-on-surface);

    /* 思源标签背景颜色 | The background color of tag */
    --custom-span-tag-background-color: var(--b3-font-background9);

    /* 列表转换成的表格鼠标悬浮背景颜色 | The background color of the mouse hover row of the table converted by a list */
    --custom-list-table-hover-background-color: #0001;
}

计划 | TODO

  • 介绍
    • 自定义配置
      • 教程
      • 示例
    • 在其他主题中引用样式
    • 将所有的半透明背景颜色在配置中集中设置

开始 | START

自动安装 | AUTO INSTALL

该主题已在思源笔记社区集市上架, 可直接在集市中安装
The theme has been put on the shelves at SiYuan community bazaar and can be installed directly in the Bazaar.

手动安装 | MANUAL INSTALL

Releases 中下载发行包, 解压后放到思源笔记 <工作空间>/conf/appearance/themes/ 目录下
Download the release package in Releases, unzip it and place it in the <workspace>/conf/appearance/themes/ directory of SiYuan Note.

参考 & 感谢 | REFERENCE & THANKS

作者 | Author 项目 | Project 许可证 | License
Achuan-2 Achuan-2/siyuan-themes-tsundoku-dark: a editor theme for siyuan note Unknown
roeseth roeseth/Siyuan-Golden-Topaz-Refined: A ported Golen Topaz theme for Siyuan note with tweaks Unknown
Morganwan90 Morganwan90/Lightblue-siyuan-theme Unknown
Crowds21 Crowds21/Cliff-Light Unknown
Zhangwuji 希望能够增加根据大纲生成思维导图的功能 Unknown
Morganwan90 Morganwan90/Darkblue-siyuan-theme Unknown
leolee9086 leolee9086/cc-baselib Unknown
UserZYF UserZYF/zhang-light Unknown
langzhou langzhou/siyuan-note Unknown

注: 排序不分先后
ps: Sort in no particular order.

更改日志 | CHANGE LOGS

CHANGELOG

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].