hexo-theme-stellar 2.0.0-rc.6 → 2.0.0

package/CHANGELOG.md

@@ -1,5 +1,45 @@
 # Changelog
 
+## 2.0.0
+
+> 发布日期：2026-09-30
+
+### 新功能
+
+- 配置、Collection YAML 与页面 Front Matter 采用声明式严格 Schema，字段类型、枚举与未知字段在构建前由 Doctor 报告来源与字段路径。
+- Post、Topic、Wiki、Notebook、Note 与索引页共用同一内容模型与构建管线；`listed/searchable` 分别控制聚合展示与搜索收录，Article 与 Notebook 的列表、横幅、许可、分享、标签和排序默认值收敛到内容模型。
+- 页面外壳统一为 Topbar、Leftbar、Rightbar Region，Brand、Menu、Widget、Footer 和 13 个 Profile 使用结构化配置与明确的覆盖语义；Leftbar 菜单支持 1–5 列，Tree、Linklist、Related 与右栏目录支持折叠，右栏随左栏收起显示紧凑目录。
+- 新增 `card/glass/minimal/flat` 外观预设、明暗模式切换、颜色／渐变／排版／形状／背景设置，以及独立设置页。
+- 浏览器功能改为原生 ES 模块按需加载，搜索、评论、动态效果、数据服务与请求缓存拥有明确的加载、取消与卸载生命周期；共享脚本、样式与图标不再逐页内联。
+- 搜索改为注册式 provider（内置 `local` 与 `algolia`），入口位于 Leftbar Brand；本地搜索按章节组织结果并分批查询、渲染，浮层带开合转场与滚动条槽位补位，支持 `Command+K` / `Ctrl+K`。
+- Wiki Hero 支持图片与视频背景、滚动视差，以及 `galaxy`、`light-rays`、`ferrofluid`、`Strands` 可选效果；标签目录新增 `gist`。
+- 图片在 `hexo server` / `hexo generate` 时增量提取尺寸与 HSLA 平均色并持久缓存，补全生成 HTML 且不修改 Markdown 或原图；新增 `hexo stellar images`（含 `--dry-run/--page/--refresh`）。
+- 新增 `hexo stellar doctor` 与 `hexo stellar new note`；目录驱动的完整 Blueprint 改由 Stellar Examples 仓库维护。
+- 文章横幅背景、访客头像镜像 `services.gravatar.base_url`、Reveal 的 `duration/interval/distance/blur` 与卡片 Spotlight／Tilt 均可独立配置。
+
+### 行为与样式变化
+
+- 内容横幅与列表共用页面 `cover`；`article.banner.background`（默认 `true`）与 Front Matter `banner.background: false` 控制内容页横幅是否使用封面作为背景，关闭时只影响内容页，列表卡片、SEO 与分享仍使用 `cover`。博客列表页附加导航默认开启。
+- 笔记本总索引卡片复用 Wiki 卡片的封面与项目栏视觉：`listing.cover` 作为封面、`listing.headline` 只取显式配置的大标题、`listing.caption` 作为项目副标题，未配置封面时降级为纯色卡片。
+- 正文图片统一 `max-width: 100%` 与 `height: auto`，按原图比例约束高度；图片元数据只采集会被主题消费的图片，分享二维码、评论、侧边栏与页脚等页面框架图片不触发下载或写入缓存。
+- 侧栏集合、Navbar、Dropdown、Grid、文章卡片、下载按钮与 Topbar 对齐改用统一的形状与状态反馈；设置页、单选框、标题装饰、导航下划线、目录指示条与移动端留白一并收敛。
+- 运行环境升级为 Node.js 22+、Hexo 8+；源码读取兼容 Windows CRLF 与 BOM，避免 Front Matter 整体丢失。
+
+### 升级注意（配置变更与破坏性改动）
+
+- v1 的 `logo/menubar/site_tree/style/tag_plugins/plugins/data_services/search.service` 等结构不会被兼容读取；请按[公开迁移说明](https://xaoxuu.com/wiki/stellar/migration/v1-to-v2/)逐项迁移到 `topbar/leftbar/rightbar/footer/profiles/appearance/tags/features/services/search`。
+- Collection 与 Front Matter 需要迁移为 `collection/route/navigation/listing/visibility/banner/article/comments/render/seo` 等分组字段；页面 `banner.image` 改为顶层 `cover`，横幅不再使用独立比例配置。未知字段、错误类型与非法枚举会在构建早期失败。
+- 分享服务由 `[wechat, weibo, email, link]` 改为 `qrcode/weibo/x/telegram/whatsapp/email`，配置位置为 `article.footer.share` 或内容 `footer.share`。
+- `plugins.card_hover.enable` 改为独立的 `features.card_hover.spotlight` 与 `features.card_hover.tilt`，默认均为 `false`；`plugins.adaptive_text` 改为固定开启的内置行为。
+- Site Info、Rating、Vote 的服务 endpoint 默认留空，需要自行部署并填写地址；依赖这些服务的站点升级后请显式配置。
+- `features.partial_navigation.enabled` 与 `features.image_optimization.enabled` 默认开启，首次处理远程图片会增加构建时间；Hero 背景默认启用 0.2 强度视差，设为 0 关闭位移。
+- `about`、`users` 标签以及对应的 `chat_users.yml`、`fcircle` 适配器已移除；`tip` 改为单标签 `{% tip 词句 pop:注解 %}`，`quot` 支持直接图标键与 `color`。
+- 博客列表页附加导航 `profiles.blog_index.listing_nav.enabled` 默认开启；语言文件不再使用 `settings.profile.provider_managed` 与 `settings.profile.provider_unknown`。
+- 浏览器后处理必须原样保留 `public/js/runtime/**/*.js` 的 ESM 语义、相对 import 与 JavaScript MIME 类型。
+- v2 源码从仓库 `main` 安装并需要执行 `npm install --prefix themes/stellar`；npm 安装的版本以实际公开版本为准。
+
+Full Changelog: [1.44.0...2.0.0](https://github.com/xaoxuu/hexo-theme-stellar/compare/1.44.0...2.0.0)
+
 ## 2.0.0-rc.6
 
 > 发布日期：2026-09-18

package/_config.yml

@@ -210,7 +210,7 @@ profiles:
     # 配置博客列表页的附加导航。
     listing_nav:
       # 控制是否显示附加导航。
-      enabled: false
+      enabled: true
       # 设置附加导航标签；空数组表示不添加标签。
       tabs: []
 
@@ -460,6 +460,11 @@ article:
   style: tech
   # 设置段落首行缩进策略；可选值为 auto、always 或 never。
   paragraph_indent: auto
+  # 配置文章页顶部横幅。
+  banner:
+    # 控制文章页横幅是否使用页面 cover 作为背景图；false 表示只显示纯色横幅。
+    # 可在文章 Front Matter 用 banner.background 覆盖此默认值。
+    background: true
   # 配置文章列表卡片。
   listing:
     # 设置置顶文章布局；可选值为 carousel 或 flat。

package/languages/en.yml

@@ -98,8 +98,6 @@ settings:
     url: URL
     save: Save
     logout: Log out
-    provider_managed: '%s manages comment identity outside the theme. Profile editing and logout are unavailable here.'
-    provider_unknown: The current comment provider
   cache:
     title: Cache
     search: Search cache

package/languages/zh-CN.yml

@@ -98,8 +98,6 @@ settings:
     url: URL
     save: 保存
     logout: 退出登录
-    provider_managed: '%s 的评论身份不由主题管理，无法在此编辑或退出。'
-    provider_unknown: 当前评论服务
   cache:
     title: 缓存
     search: 搜索缓存

package/languages/zh-TW.yml

@@ -98,8 +98,6 @@ settings:
     url: URL
     save: 儲存
     logout: 登出
-    provider_managed: '%s 的留言身分不由主題管理，無法在此編輯或登出。'
-    provider_unknown: 目前留言服務
   cache:
     title: 快取
     search: 搜尋快取

package/layout/_partial/main/navbar/article_banner.ejs

@@ -18,6 +18,15 @@ var banner = Object.assign({}, page.author
     : postViewModel ? postViewModel.item.presentation.banner : pageConfig.banner || {})
 
 var bannerImage = page.author ? page.author.cover : renderViewModel ? renderViewModel.item.cover : pageConfig.cover
+// 横幅背景图由 Front Matter banner.background 覆盖全局默认值；作者页不受全局开关影响。
+// 关闭时仅影响内容页横幅，列表卡片、SEO 与分享仍使用 cover。
+var bannerBackground = banner.background
+if (bannerBackground == null && !page.author) {
+  bannerBackground = stellar_config('article.banner.background')
+}
+if (bannerBackground === false) {
+  bannerImage = ''
+}
 
 // 标题
 if (banner.headline == null) {

package/layout/_partial/main/notebook/notebook_card.ejs

@@ -1,17 +1,37 @@
-<%# 笔记本信息卡片 %>
+<%# 笔记本卡片：复用 Wiki 卡片的 .wiki-card 视觉（cover 同图模糊层、底部信息层与项目栏） %>
 <% var listing = render.listing %>
-<article class="md-text">
-  <div class="preview">
-    <% if (listing.icon) { %>
-      <img src="<%= listing.icon %>" alt="icon"/>
-    <% } else { %>
-      <%- icon('default:documents') %>
-    <% } %>
-  </div>
-  <div class="excerpt">
-    <h2 class="post-title"><%= listing.headline || listing.name %></h2>
-    <% if (listing.description) { %>
-      <p><%= listing.description %></p>
+<% var cover = listing.cover || '' %>
+<% var headline = listing.headline || '' %>
+<% var caption = listing.caption || '' %>
+<%# 整个属性必须原样输出：EJS 转义输出会把属性里的引号变成实体，属性值带上一对引号，自适应颜色就失效 %>
+<% var adaptiveAttr = cover ? ' data-text-adaptive="split"' : '' %>
+<article class="wiki-card-content">
+  <div class="wiki-card-cover<%= cover ? '' : ' no-cover' %>" position="bottom">
+    <% if (cover) { %>
+      <img src="<%= cover %>" alt=""/>
     <% } %>
+    <div class="wiki-card-info" position="bottom"<%- adaptiveAttr %>>
+      <%# headline 是可选的大标题，只在显式配置时渲染；name 固定在底部项目栏 %>
+      <% if (headline) { %>
+      <div class="wiki-card-summary">
+        <h2 class="headline"><%= headline %></h2>
+      </div>
+      <% } %>
+      <div class="wiki-project">
+        <div class="project-icon">
+          <% if (listing.icon) { %>
+            <img src="<%= listing.icon %>" alt=""/>
+          <% } else { %>
+            <%- icon('default:documents') %>
+          <% } %>
+        </div>
+        <div class="project-text">
+          <div class="project-name"><%= listing.name %></div>
+          <% if (caption) { %>
+            <div class="project-subtitle"><%= caption %></div>
+          <% } %>
+        </div>
+      </div>
+    </div>
   </div>
 </article>

package/layout/notebooks.ejs

@@ -1,10 +1,12 @@
-<%# 笔记本列表页主体部分 %>
-<% for (var notebook of page.notebookIndex.items) { %>
-  <div class="post-list wiki">
+<%# 笔记本列表页主体部分：复用 Wiki 列表的网格与卡片组件 %>
+<div class="post-list wiki">
+  <% for (var notebook of page.notebookIndex.items) { %>
+    <% var cover = notebook.cover || '' %>
+    <% var coverStyle = cover ? ` style="--cover-url:url('${escape_html(cover.replace(/'/g, '%27'))}')"` : '' %>
     <div class="post-card-wrap<%= scrollreveal(' ') %>">
-    <a class="<%- ui_classes('post-card wiki', 'hoverCard') %>" href="<%= pretty_url(notebook.href) %>">
+    <a class="<%- ui_classes('wiki-card', 'hoverCard', cover ? '' : 'no-cover') %>"<%- coverStyle %> href="<%= pretty_url(notebook.href) %>">
       <%- include('_partial/main/notebook/notebook_card', { render: {listing: notebook} }) %>
     </a>
     </div>
-  </div>
-<% } %>
+  <% } %>
+</div>

package/layout/settings.ejs

@@ -29,6 +29,7 @@ function linkAttributes(url) {
     <h1><%- escape_html(__('settings.title')) %></h1>
   </header>
 
+  <% if (providerSupported) { %>
   <section class="settings-section" aria-labelledby="settings-profile">
     <h2 id="settings-profile"><%- escape_html(__('settings.profile.title')) %></h2>
     <div class="settings-section__body">
@@ -38,9 +39,6 @@ function linkAttributes(url) {
           <span data-profile-avatar-fallback hidden><%- icon('default:profile', '', true) %></span>
         </div>
         <div class="settings-profile__content">
-          <% if (!providerSupported) { %>
-          <p data-provider-note class="settings-provider-note"><%- escape_html(__('settings.profile.provider_managed', provider || __('settings.profile.provider_unknown'))) %></p>
-          <% } else { %>
           <form data-profile-form class="settings-form" novalidate>
             <label>
               <span><%- escape_html(__('settings.profile.nickname')) %></span>
@@ -60,11 +58,11 @@ function linkAttributes(url) {
             </div>
           </form>
           <p class="settings-result" data-profile-status role="status" aria-live="polite"></p>
-          <% } %>
         </div>
       </div>
     </div>
   </section>
+  <% } %>
 
   <section class="settings-section" aria-labelledby="settings-cache">
     <h2 id="settings-cache"><%- escape_html(__('settings.cache.title')) %></h2>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-stellar",
-  "version": "2.0.0-rc.6",
+  "version": "2.0.0",
   "description": "An all-in-one Hexo theme for blogs, project documentation, knowledge bases, series, and notebooks.",
   "main": "package.json",
   "scripts": {

package/scripts/events/lib/notebooks.js

@@ -137,9 +137,13 @@ module.exports = (ctx, pipeline) => {
           id: collectionId,
           href: baseDir,
           name: identity.name,
-          headline: identity.headline,
+          // 大标题只取显式配置的 headline；identity.headline 会回退到 name，
+          // 直接透传会让「删掉 headline」仍然渲染出同名大标题。
+          headline: typeof collectionConfig.headline === "string" ? collectionConfig.headline : "",
+          caption: identity.tagline || identity.description,
           description: identity.description,
           icon: identity.icon || "",
+          cover: collection.cover || "",
           order: collection.listing.order,
           listed: collection.visibility.listed !== false,
           navigation: {

package/scripts/lib/image-metadata.js

@@ -13,6 +13,20 @@ const MAX_BYTES = 32 * 1024 * 1024;
 const RETRY_DELAY = 24 * 60 * 60 * 1000;
 const stores = new WeakMap();
 
+// The store serves two runtime consumers: article content images (dimensions
+// for aspect ratio) and average-color backgrounds for adaptive text. Scan the
+// rendered article region plus the adaptive-text owners, matching
+// source/js/plugins/adaptive-text.js, so page chrome (share QR codes, comments,
+// sidebars, footers) never triggers downloads or store entries.
+const METADATA_IMAGE_SELECTOR = [
+  'article.md-text.content img',
+  '.banner img',
+  '.cover img',
+  '.wiki-card-cover img',
+  '.pin-slide img',
+  '.wiki-hero img'
+].join(', ');
+
 function metadataPath(ctx) {
   return path.join(ctx.source_dir || path.join(ctx.base_dir || process.cwd(), 'source'), '_data', 'caches', DATA_FILE);
 }
@@ -91,12 +105,13 @@ function complete(entry) {
   return (dimensionsReady(entry?.dimensions) || entry?.dimensions?.status === 'unsupported') && colorDone;
 }
 
-// Scan rendered img elements, so Markdown, tags, Front Matter and data-driven
-// covers use their actual output without maintaining another source-field list.
+// Scan rendered img elements in scope for the store, so Markdown, tags, Front
+// Matter and data-driven covers use their actual output without maintaining
+// another source-field list, while page chrome stays out of scope.
 function collectImages(html, base) {
   const urls = new Set();
   const $ = load(html, null, false);
-  $('img').each((_, element) => {
+  $(METADATA_IMAGE_SELECTOR).each((_, element) => {
     const img = $(element);
     const url = imageUrl(img.attr('data-src') || img.attr('src'), base);
     if (url) urls.add(url);
@@ -247,7 +262,7 @@ function enrichImages(html, ctx, locals = {}) {
   let changed = false;
   const autoRatio = (ctx.stellar?.config?.features?.lazyLoading?.autoAspectRatio
     ?? ctx.theme?.config?.features?.lazy_loading?.auto_aspect_ratio) !== false;
-  $('img').each((_, image) => {
+  $(METADATA_IMAGE_SELECTOR).each((_, image) => {
     const img = $(image);
     const src = img.attr('data-src') || img.attr('src');
     const entry = store.images[imageUrl(src, base)];

package/scripts/lib/source-config.js

@@ -7,6 +7,11 @@ const snapshots = new WeakMap();
 
 function sourcePathForData(key) { return `source/_data/${key}.yml`; }
 function sourcePathForPage(page) { return page.source ? `source/${page.source}` : (page.path || "<page>"); }
+// hexo-front-matter 只识别 LF；Hexo 宿主通过 hexo-fs 读取源码时会去除 BOM 并规范化 CRLF，
+// 直接读取源码必须保持一致，否则 Windows 上的 CRLF 内容会丢失全部 Front Matter。
+function readSourceText(file) {
+  return fs.readFileSync(file, "utf8").replace(/^\uFEFF/, "").replace(/\r\n/g, "\n");
+}
 function sourceCache(ctx) {
   if (!snapshots.has(ctx)) snapshots.set(ctx, new Map());
   return snapshots.get(ctx);
@@ -29,7 +34,7 @@ function readFrontMatter(ctx, page) {
   const stamp = [stat.ino, stat.size, stat.mtimeNs, stat.ctimeNs].join(":");
   const previous = cache.get(page.source);
   if (previous?.stamp === stamp) return previous.config;
-  const config = frontMatter.parse(fs.readFileSync(file, "utf8"));
+  const config = frontMatter.parse(readSourceText(file));
   delete config._content;
   cache.set(page.source, { stamp, config });
   return config;

package/scripts/schema/content-config-rules.js

@@ -212,6 +212,7 @@ const FRONT_MATTER_TARGET_DEFINITIONS = [
   ["tagline", ["string", "null"], literal(null)],
   ["banner", "object", literal({}), { boundary: "sealed" }],
   ["banner.enabled", ["boolean", "null"], literal(null)],
+  ["banner.background", ["boolean", "null"], literal(null)],
   ["banner.avatar", ["string", "null"], literal(null)],
   ["banner.headline", ["string", "null"], literal(null)],
   ["banner.tagline", ["string", "null"], literal(null)],

package/scripts/schema/model-schema.js

@@ -233,6 +233,7 @@ function bannerSchema(factory) {
   const { field, object } = factory;
   return object({
     enabled: field("boolean", { example: true }),
+    background: field("boolean", { example: true }),
     avatar: field("string", { example: "/avatar.webp" }),
     headline: field("string", { example: "开始使用 Stellar" }),
     tagline: field("string", { example: "十分钟搭好站点" })

package/source/css/_common/base.styl

@@ -20,6 +20,7 @@ hr
 
 img
   max-width: 100%
+  height: auto
 
 li
   font-size: 'calc(%s - 1px)' % var(--fs-content)

package/source/css/_common/input.styl

@@ -9,6 +9,8 @@ input.copy-area
   font-weight: $fw-700
   color: var(--text-p3)
 
+// 圆环与圆点画在同一个背景层上：元素落在非整数像素位置时，border 圆环与内部盒子会被
+// 分别对齐，Firefox 下圆点最多偏离圆心 1 个物理像素，因此不用 border 绘制圆环。
 input.ui-radio
   -webkit-appearance: none
   -moz-appearance: none
@@ -19,25 +21,20 @@ input.ui-radio
   width: 16px
   height: 16px
   margin: 0
-  border: 2px solid var(--text-p3)
+  border: 0
   border-radius: 50%
   corner-shape: round
-  background: none
+  --radio-ring: var(--text-p3)
+  --radio-dot-size: 0
+  // 外环：16px 内取 2px 环宽（半径 8px → 6px）；圆点：8px（半径 4px）
+  background-image: radial-gradient(circle closest-side, transparent 0 5.875px, var(--radio-ring) 6.125px 100%), radial-gradient(circle closest-side, var(--theme) 0 3.875px, transparent 4.125px)
+  background-position: center, center
+  background-repeat: no-repeat, no-repeat
+  background-size: 16px 16px, var(--radio-dot-size) var(--radio-dot-size)
   cursor: pointer
-  &:before
-    content: ""
-    display: block
-    width: 8px
-    height: 8px
-    margin: 2px
-    border-radius: 50%
-    background: var(--theme)
-    transform: scale(0)
   &:checked
-    border-color: var(--theme)
-  &:checked:before
-    background: var(--theme)
-    transform: scale(1)
+    --radio-ring: var(--theme)
+    --radio-dot-size: 8px
   &:focus-visible
     outline: 2px solid var(--theme)
     outline-offset: 2px

package/source/css/_components/pages/settings.styl

@@ -54,7 +54,6 @@
   grid-column: 1 / -1
   min-width: 0
 
-.settings-provider-note,
 .settings-empty
   margin: 0
   color: var(--text-p2)

package/source/css/_components/sidebar/search.styl

@@ -252,10 +252,62 @@ html[data-leftbar-state='collapsed'] .site-shell:not([data-drawer='leftbar']) .s
   background: var(--card)
   box-shadow: $boxshadow-card-float
   overflow: hidden
+  // 打开动画随 [open] 触发；关闭动画由 main.js 添加 .is-closing 并在动画结束后调用 close()
+  &[open]
+    animation: search-dialog-in 0.24s ease-out backwards
+  &.is-closing
+    animation: search-dialog-out 0.18s ease-in both
   &::backdrop
     background: rgba(black, .38)
     backdrop-filter: blur(8px)
     -webkit-backdrop-filter: blur(8px)
+    animation: search-backdrop-in 0.24s ease-out backwards
+  &.is-closing::backdrop
+    animation: search-backdrop-out 0.18s ease-in both
+
+@keyframes search-dialog-in
+  from
+    opacity: 0
+    transform: translateY(8px) scale(.97)
+  to
+    opacity: 1
+    transform: none
+
+@keyframes search-dialog-out
+  from
+    opacity: 1
+    transform: none
+  to
+    opacity: 0
+    transform: translateY(8px) scale(.97)
+
+@keyframes search-backdrop-in
+  from
+    opacity: 0
+  to
+    opacity: 1
+
+@keyframes search-backdrop-out
+  from
+    opacity: 1
+  to
+    opacity: 0
+
+@keyframes search-dialog-in-fluid
+  from
+    opacity: 0
+    transform: translateY(16px)
+  to
+    opacity: 1
+    transform: none
+
+@keyframes search-dialog-out-fluid
+  from
+    opacity: 1
+    transform: none
+  to
+    opacity: 0
+    transform: translateY(16px)
 
 .search-dialog__panel
   box-sizing: border-box
@@ -359,6 +411,9 @@ html[data-leftbar-state='collapsed'] .site-shell:not([data-drawer='leftbar']) .s
 
 html[data-search-open]
   overflow: hidden
+  // 锁定滚动会移除常驻滚动条槽位，按 main.js 实测宽度补位，避免页面内容宽度变化后重排
+  body
+    padding-right: var(--stellar-scrollbar-gutter, 0px)
 
 @media screen and (max-width: $device-tablet)
   .search-dialog
@@ -367,6 +422,11 @@ html[data-search-open]
     max-height: none
     border: 0
     border-radius: 0
+    // 全屏浮层不做缩放，避免露出被裁切的边缘
+    &[open]
+      animation-name: search-dialog-in-fluid
+    &.is-closing
+      animation-name: search-dialog-out-fluid
   .search-dialog__panel
     height: 100%
     padding: unquote('max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left))')
@@ -375,6 +435,10 @@ html[data-search-open]
 
 @media (prefers-reduced-motion: reduce)
   .search-dialog,
-  .search-dialog::backdrop
+  .search-dialog[open],
+  .search-dialog.is-closing,
+  .search-dialog::backdrop,
+  .search-dialog[open]::backdrop,
+  .search-dialog.is-closing::backdrop
     animation: none
     transition: none

package/source/css/_components/wiki-card.styl

@@ -185,7 +185,9 @@
     height: 2.5rem
     app-icon()
     background: var(--block)
-    color: var(--text-p2)
+    // 未配置 icon 时的默认图标：颜色跟随封面平均色自适应（深色封面显示为接近白色）。
+    // --text-banner 只在有封面时由 adaptive-text 写入 .wiki-card-info，无封面时回退到次要文字色。
+    color: var(--text-banner, var(--text-p2))
     img
       width: 100%
       height: 100%

package/source/js/main.js

@@ -103,6 +103,10 @@ const rightbarDrawerQuery = '(max-width: 1180px)';
 let shellDrawerTrigger = null;
 let searchDialogTrigger = null;
 let searchDialogRestoreFocus = true;
+// 退场动画的安全兜底时长，需大于 search.styl 中 search-dialog-out 的 0.18s
+const searchCloseFallbackDelay = 260;
+let searchCloseTimer = null;
+let searchCloseListener = null;
 let shellInputModality = 'pointer';
 
 function regionElement(region) {
@@ -244,6 +248,11 @@ function applySearchScope(dialog, value, refresh = true) {
   }
 }
 
+function searchMotionEnabled() {
+  if (typeof window.matchMedia !== 'function') return true;
+  return !window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+}
+
 function configureSearchScope(dialog, trigger) {
   const group = dialog?.querySelector('.search-dialog__scope');
   if (!group) return false;
@@ -265,10 +274,30 @@ function configureSearchScope(dialog, trigger) {
   return true;
 }
 
-function closeSearch() {
-  const dialog = searchDialogElement();
-  if (!dialog?.open) return;
-  dialog.close();
+function clearSearchClosePending(dialog) {
+  if (searchCloseTimer !== null) {
+    clearTimeout(searchCloseTimer);
+    searchCloseTimer = null;
+  }
+  if (searchCloseListener) {
+    dialog.removeEventListener('animationend', searchCloseListener);
+    searchCloseListener = null;
+  }
+  dialog.classList.remove('is-closing');
+}
+
+// 锁定页面滚动会移除常驻滚动条，先把槽位宽度写进 CSS 变量供补位使用
+function syncSearchScrollbarGutter() {
+  const root = document.documentElement;
+  if (root.hasAttribute('data-search-open')) return;
+  const gutter = Math.max(0, window.innerWidth - root.clientWidth);
+  root.style.setProperty('--stellar-scrollbar-gutter', gutter + 'px');
+}
+
+// 关闭动画播放期间浮层仍处于打开状态，退出动画结束或兜底超时后才真正 close 并恢复焦点
+function finishSearchClose(dialog) {
+  clearSearchClosePending(dialog);
+  if (dialog.open) dialog.close();
   document.documentElement.removeAttribute('data-search-open');
   if (searchDialogRestoreFocus && searchDialogTrigger?.focus) searchDialogTrigger.focus();
   else if (searchDialogTrigger?.blur) searchDialogTrigger.blur();
@@ -276,12 +305,29 @@ function closeSearch() {
   searchDialogRestoreFocus = true;
 }
 
+function closeSearch() {
+  const dialog = searchDialogElement();
+  if (!dialog?.open || searchCloseTimer !== null) return;
+  if (!searchMotionEnabled()) {
+    finishSearchClose(dialog);
+    return;
+  }
+  searchCloseListener = function (event) {
+    if (event.animationName !== 'search-dialog-out') return;
+    finishSearchClose(dialog);
+  };
+  dialog.classList.add('is-closing');
+  dialog.addEventListener('animationend', searchCloseListener);
+  searchCloseTimer = setTimeout(function () { finishSearchClose(dialog); }, searchCloseFallbackDelay);
+}
+
 function openSearch(trigger, restoreFocus = true) {
   const dialog = searchDialogElement();
   const input = dialog?.querySelector('.search-input');
   const wrapper = dialog?.querySelector('.search-wrapper');
   const result = dialog?.querySelector('.search-result');
   if (!dialog || !input) return;
+  clearSearchClosePending(dialog);
   searchDialogTrigger = trigger || document.activeElement;
   searchDialogRestoreFocus = restoreFocus;
   input.value = '';
@@ -294,6 +340,7 @@ function openSearch(trigger, restoreFocus = true) {
   }
   result?.replaceChildren();
   if (!dialog.open) dialog.showModal();
+  syncSearchScrollbarGutter();
   document.documentElement.setAttribute('data-search-open', '');
   input.focus();
 }

package/source/js/runtime/extensions/settings.js

@@ -90,7 +90,6 @@ export function mount(root, context) {
   const provider = String(page.dataset.provider || '').toLowerCase();
   const api = globalThis.window?.stellarProfile;
   const form = page.querySelector('[data-profile-form]');
-  const note = page.querySelector('[data-provider-note]');
   const status = page.querySelector('[data-profile-status]');
   const avatar = page.querySelector('[data-profile-avatar]');
   const avatarFallback = page.querySelector('[data-profile-avatar-fallback]');
@@ -174,8 +173,8 @@ export function mount(root, context) {
     if (urlInput) urlInput.value = identity.url || '';
     if (form) form.hidden = !supported;
     if (logoutButton) logoutButton.hidden = !supported;
-    if (note) note.hidden = supported;
-    renderAvatar(identity);
+    if (supported) renderAvatar(identity);
+    else if (avatar) avatar.hidden = true;
   }
 
   function onSubmit(event) {

package/source/js/runtime/image-color.js

@@ -195,7 +195,10 @@ export function readImageColor(image, options = {}) {
     function onLoad() {
       if (options.signal?.aborted || source(image) !== url) return finish(null);
       const displayed = normalize(image.currentSrc || image.getAttribute('src'), image);
-      if (displayed !== url) return; // The lazy placeholder finished loading.
+      // 懒加载占位图（src 仍是 1×1 data URI）：显示像素不可用，直接 return 会让本 Promise 永久挂起
+      // （懒加载运行时没执行时，真图永远不会被换进来），自适应文字与 --wiki-border-color 就全都缺失。
+      // 改为按 URL 单独取色，保证颜色不依赖懒加载是否跑通。
+      if (displayed !== url) return finish(waitForSample(sampleWithCors(image, url, size, key), options.signal));
       if (!image.naturalWidth || !image.naturalHeight) return finish(null);
       const existing = read(key);
       const raw = existing || sample(image, size);