阅读模式

阅读模式是一项功能，可以通过隐藏侧边栏和其他界面元素，让用户专注于内容。当启用时，它会提供一个简洁、无干扰的阅读体验。

配置

阅读模式默认启用。要禁用它，可以在 quartz.layout.ts 的布局配置中移除该组件：

// 移除或注释掉此行
Component.ReaderMode(),

使用方法

阅读模式切换按钮以一本书的图标显示。点击后：

• 侧边栏会被隐藏
• 鼠标悬停在内容区域时会临时显示侧边栏

与深色模式不同，阅读模式的状态不会在页面刷新后保留，但在站点内的 SPA 导航期间会保持。

自定义

你可以通过 CSS 变量和样式自定义阅读模式的外观。该组件使用以下类名：

• .readermode：切换按钮
• .readerIcon：书本图标
• [reader-mode="on"]：当阅读模式激活时应用于根元素

在自定义 CSS 中的示例：

.readermode {
  // 自定义按钮
  svg {
    stroke: var(--custom-color);
  }
}