把一套 React 视觉原型完整适配为 Zola 0.23.3 主题，并补齐中文界面、代码高亮、响应式布局与文章图片灯箱。
Zulqer 是一套面向长篇写作和技术笔记的 Zola 主题。它的视觉基调来自暗色编辑页面：接近黑色的背景、克制的暖金色强调、衬线标题，以及尽量少打断阅读的交互。
适配时，我把页面结构重新实现为 Zola 的 Tera 模板。文章、标签、归档、搜索和分页仍然由 Zola 生成，浏览器里不需要运行前端框架。
从视觉原型到静态主题 首页保留了原设计最明确的几处特征：固定导航、焦点文章、横向标签栏和不对称文章网格。第一张文章卡片跨两列，其余卡片自动适应可用宽度；卡片保持 12px 圆角，并在鼠标悬停时轻微上移、改变边框颜色。
Zulqer 暗色编辑主题首页设计
Zulqer 首页设计。点击图片可以放大查看原图。
主题使用 Fraunces 处理标题，Outfit 处理正文，DM Mono 处理日期、标签和代码信息。中文环境会继续使用系统自带的中文字体作为后备，不会因为西文字体加载失败而影响阅读。
Zola 0.23.3 适配 主题按 Zola 0.23.3 的模板和 Markdown 配置编写。代码高亮交给 Zola 在构建阶段完成，浏览器只负责展示结果，因此代码块不需要再加载一套客户端语法解析器。
theme = "zulqer" default_language = "en" preserve_dotfiles_in_output = true
[markdown.highlighting] theme = "catppuccin-mocha"
这里的 default_language 保持为 en，是因为 Zola 当前使用的 Elasticlunr 搜索索引不支持 zh。页面本身仍然输出 lang="zh-CN"，导航、阅读时间、分页和搜索提示也全部使用中文。
内容与交互 文章页沿用原设计的窄栏阅读宽度、顶部阅读进度和信息标签。Markdown 图片会显示为圆角大图，点击后进入带背景模糊的灯箱；同一篇文章中有多张图片时，可以使用左右按钮或方向键切换，按 Esc 关闭。
代码块会显示语言名称，并提供复制按钮。窄屏设备上保留横向滚动，不会为了塞进屏幕而缩小代码字体或折断长命令。
fn theme_name() -> &'static str { "Zulqer" }
主题同时处理了键盘焦点、移动端菜单和 prefers-reduced-motion。减少动态效果的系统偏好开启后，卡片和菜单的过渡会被关闭。
使用主题 仓库地址：github.com/menzil/zulqer，在线演示：orhan.cn。
git clone https://github.com/menzil/zulqer.git themes/zulqer
将 theme = "zulqer" 写入站点配置后即可使用。界面语言、默认焦点图、导航名称和仓库链接集中放在 [extra.zulqer] 中，站点不需要修改主题模板就能替换这些内容。
文章封面按文章单独设置，写在 Markdown 的 [extra] 中：
+++ title = "文章标题"
[extra] cover = "/images/article-cover.jpg" +++
设置后，这张图片会同时用于首页文章卡片和文章详情页。普通文章可以不设置，卡片会显示深色渐变占位；首页焦点文章没有单独封面时，则使用站点配置里的 default_cover。正文中的 Markdown 图片只属于文章内容，不会自动变成封面。
Zulqer 由 Ruzaji Yasin 设计并完成 Zola 适配。