检测到论坛CSS可能没有正确加载，如出现排版混乱请刷新重试。

We detected that the CSS might not be loaded correctly. If the website displays abnormally, Please refresh and try again.

DaleZ 是这个意思，例如：

(function () {
  function changeTitleColor(after) {
    var r = document.querySelector(':root');
    var rs = getComputedStyle(r);
    if (rs.getPropertyValue('--colored-titlebar') === 'false') {
      var m = document.querySelector('meta[name="theme-color"]');
      m.content = rs.getPropertyValue('--header-bg');
      if (typeof after === 'function') after();
    }
  }

  function createPromise() {
    return new Promise(function (resolve) {
      var id = setInterval(function () {
        if (flarum) {
          if (flarum.extensions) {
            clearInterval(id);
            resolve();
          }
        }
      }, 500);
    }).then(function () {
      if (flarum.extensions['fof-nightmode']) {
        document.addEventListener('fofnightmodechange', changeTitleColor);
      }
    });
  }

  changeTitleColor(createPromise);
})();

      Crazy Urus 感谢您的建议！不过 Promise 只用一次，就不必上函数了。我此刻有一个更加省字的办法[tieba=huaji]

      (function () {
    function changeTitleColor() {
        var r = document.querySelector(":root");
        var rs = getComputedStyle(r);
        if (rs.getPropertyValue("--colored-titlebar") === "false") {
            var m = document.querySelector(`meta[name="theme-color"]`);
            m.content = rs.getPropertyValue("--header-bg");
        };
    }

    changeTitleColor();
    new Promise(function (resolve) {
        var id = setInterval(function () {
            if (flarum) {
                if (flarum.extensions) {
                    clearInterval(id);
                    resolve();
                }
            }
        }, 500)
    }).then(function () {
        if (flarum.extensions["fof-nightmode"]) {
            document.addEventListener("fofnightmodechange", changeTitleColor);
        }
    });
})();

        v1.1.2

        更新内容

        包含所有来自 dev-main 的测试版本 DaleZ 的更新内容。
        更新通知布局。
        删除未使用的样式。
        新增 darkle/fancybox 布局刷新。
        更新脚本，提升其安全性（并可能含有肉眼不可见的性能提升）。

        预览

        pPdbjvn.png

          隐藏功能

          好了，现在让我来揭秘大家一直期待的隐藏功能吧！
          首先在浏览器中打开论坛，然后在地址栏上清空内容，接着键入javascript:。
          之后，粘贴解锁代码：

          (()=>{var a=document.querySelector('link[rel="manifest"]');a.href='data%3Aapplication%2Fjson%3Bbase64%2Cew0KICAgICJuYW1lIjogInd2YkNvbW11bml0eSIsDQogICAgImRlc2NyaXB0aW9uIjogInd2YkNvbW11bml0eTogd2hlcmUgVmlzdGEgYm9vbXMhIOi%2FmemHjOaYr%2BS4gOS4quato%2BWcqOaIkOS4uueUteiEkeaVsOeggeaKgOacr%2BS5kOWbreeahOWwj%2BWciOWtkOOAgiIsDQogICAgInN0YXJ0X3VybCI6ICIvIiwNCiAgICAic2NvcGUiOiAiLyIsDQogICAgImRpciI6ICJhdXRvIiwNCiAgICAidGhlbWVfY29sb3IiOiAiIzFCNzRFOCIsDQogICAgImRpc3BsYXkiOiAic3RhbmRhbG9uZSIsDQogICAgImljb25zIjogWw0KICAgICAgICB7DQogICAgICAgICAgICAic3JjIjogImh0dHBzOi8vY29tbXVuaXR5Lnd2YnRlY2guY29tL2Fzc2V0cy9wd2EtaWNvbi00OHg0OC5wbmciLA0KICAgICAgICAgICAgInNpemVzIjogIjQ4eDQ4IiwNCiAgICAgICAgICAgICJ0eXBlIjogImltYWdlL3BuZyINCiAgICAgICAgfSwNCiAgICAgICAgew0KICAgICAgICAgICAgInNyYyI6ICJodHRwczovL2NvbW11bml0eS53dmJ0ZWNoLmNvbS9hc3NldHMvcHdhLWljb24tNzJ4NzIucG5nIiwNCiAgICAgICAgICAgICJzaXplcyI6ICI3Mng3MiIsDQogICAgICAgICAgICAidHlwZSI6ICJpbWFnZS9wbmciDQogICAgICAgIH0sDQogICAgICAgIHsNCiAgICAgICAgICAgICJzcmMiOiAiaHR0cHM6Ly9jb21tdW5pdHkud3ZidGVjaC5jb20vYXNzZXRzL3B3YS1pY29uLTk2eDk2LnBuZyIsDQogICAgICAgICAgICAic2l6ZXMiOiAiOTZ4OTYiLA0KICAgICAgICAgICAgInR5cGUiOiAiaW1hZ2UvcG5nIg0KICAgICAgICB9LA0KICAgICAgICB7DQogICAgICAgICAgICAic3JjIjogImh0dHBzOi8vY29tbXVuaXR5Lnd2YnRlY2guY29tL2Fzc2V0cy9wd2EtaWNvbi0xNDR4MTQ0LnBuZyIsDQogICAgICAgICAgICAic2l6ZXMiOiAiMTQ0eDE0NCIsDQogICAgICAgICAgICAidHlwZSI6ICJpbWFnZS9wbmciDQogICAgICAgIH0sDQogICAgICAgIHsNCiAgICAgICAgICAgICJzcmMiOiAiaHR0cHM6Ly9jb21tdW5pdHkud3ZidGVjaC5jb20vYXNzZXRzL3B3YS1pY29uLTE5NngxOTYucG5nIiwNCiAgICAgICAgICAgICJzaXplcyI6ICIxOTZ4MTk2IiwNCiAgICAgICAgICAgICJ0eXBlIjogImltYWdlL3BuZyINCiAgICAgICAgfSwNCiAgICAgICAgew0KICAgICAgICAgICAgInNyYyI6ICJodHRwczovL2NvbW11bml0eS53dmJ0ZWNoLmNvbS9hc3NldHMvcHdhLWljb24tMjU2eDI1Ni5wbmciLA0KICAgICAgICAgICAgInNpemVzIjogIjI1NngyNTYiLA0KICAgICAgICAgICAgInR5cGUiOiAiaW1hZ2UvcG5nIg0KICAgICAgICB9LA0KICAgICAgICB7DQogICAgICAgICAgICAic3JjIjogImh0dHBzOi8vY29tbXVuaXR5Lnd2YnRlY2guY29tL2Fzc2V0cy9wd2EtaWNvbi01MTJ4NTEyLnBuZyIsDQogICAgICAgICAgICAic2l6ZXMiOiAiNTEyeDUxMiIsDQogICAgICAgICAgICAidHlwZSI6ICJpbWFnZS9wbmciDQogICAgICAgIH0NCiAgICBdLA0KICAgICJiYWNrZ3JvdW5kX2NvbG9yIjogIiMxQjc0RTgiLA0KICAgICJkaXNwbGF5X292ZXJyaWRlIjogWw0KICAgICAgICAid2luZG93LWNvbnRyb2xzLW92ZXJsYXkiLA0KICAgICAgICAic3RhbmRhbG9uZSINCiAgICBdDQp9';})();

          然后将论坛安装为 PWA，之后论坛看起来应该像这样：

          点一下标红线的地方，你就可以享受更加原生的论坛了！
          ——是的，我最后还是兑现了当初提供Window Controls Overlay的承诺！

          Crazy Urus 对照了 commit 记录也没有发现隐藏功能是什么

          现在您可能知道为什么了，这个功能是使用纯 CSS 实现的😉

          这种解锁方式并不是最佳方法，若干次后浏览器会自动滚回到standalone，所以请论坛管理员参考 Microsoft Learn 编辑 Manifest 文件，之后再安装为 PWA 就是持久的类原生 App 了！

          现在知道为什么要关彩色标题栏了吧[tieba=yinxian]，搭配一个正确的壁纸就像真的使用了 Mica 材质一样[tieba=huaji]
          甚至不用担心有人喜欢standalone模式，因为开不开启此功能用户是有选择权的，两全其美

          gyigi 另外 虽然已经提过了 但还是想说一句 这个搜索框 以及主页中这个论坛图标和链接是不是偏左了点

          现在看来这反而是 Feature——开启那个模式之后调整窗口大小每次都是在 Logo 马上要和搜索栏相撞的时候恰到好处地往左移动

                还是提醒一下吧，论坛更新哦，因为我想更新也没时间了，不用再担心要天天和 Composer 打交道了
                甚至可以用上一年（

                连我自己都无语了，自己竟然再次食言（捂脸）

                v1.1.3（可选更新）

                更新悬浮用户卡片外观。
                更改通知布局，现在已读内容将不再看起来像未读内容。
                在不更改移动端布局的情况下使用更好的 CSS 重写了样式。

                预览


                发现整个 Flarum 世界里面，做主题的人都寥寥无几。
                所以……[tieba=huaji]

                国际站有人早就期待了这个风格主题，真的没想到我在若干年后机缘巧合地做了这个项目😂
                但是看了那个链接之后，发现做得也不是很像，大概是2020年微软的设计还不成熟，无法体现特色？亦或是当时没有详细资料模仿不出细节？
                不过无论如何，现在有一个能够体现细节特色的主题出现了（自卖自夸🤪）

                  DaleZ 但是看了那个链接之后，发现做得也不是很像，大概是2020年微软的设计还不成熟，无法体现特色？亦或是当时没有详细资料模仿不出细节？

                  Fluent Design Theme Edition is a combination of Fluent Design styles Microsoft, iOS Design, Android Design and Google Design.

                  缝合怪了属于是

                    DaleZ 我想是因为fluent design的安卓系统就很少见吧（除了苏菲duo），而且绝大多数安卓app肯定是material design的（给安卓上fluent颇有为了这碟醋包了一盘饺子的感觉...）

                        DaleZ 好像是论坛后台就没开这个功能，之前开推送的情况下老是抽风
                        反正我仍然坚持认为pwa没卵用。。。🤪

                            焊锡锡 Flarent一直能收到最新主题的推送，如果我有时间可以再搞一搞

                              DaleZ 我明白，我是说考虑移动端的使用体验，上fluent可能会导致整体体验割裂

                                Progress Ring似乎有点锯齿，1080P，100%缩放

                                  何木槿 有点锯齿

                                  是的，任何浏览器任何缩放率都无法避免，浏览器渲染的锅

                                    焊锡锡 反正我仍然坚持认为pwa没卵用。。。🤪

                                    以外观作为第一生产力的强烈反对（

                                    綾瀬桃桃 那就怪了，难道真的是桌面端限制？

                                          DaleZ 以外观作为第一生产力的强烈反对（

                                          性能和实用性敏感型用户表示不敢苟同（

                                              DaleZ 一起欣赏大号标题栏后的 Flarum PWA。。。

                                                © 2025 wvbCommunity 管理团队

                                                删封申诉 | 知乎专栏 | 状态监控 | 用户协议(EULA) | 隐私政策

                                                本站文章除其作者特殊声明外，一律采用CC BY-NC-SA 4.0许可协议进行授权，进行转载或二次创作时务必以相同协议进行共享，严禁用于商业用途。