广场轮播：书名号样式补上（rbk）

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

guangchang/index.html

@@ -486,13 +486,10 @@ button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:poin
 .rww .rwl{margin:0}
 /* 11-07 用户：祈福树下面「投稿被选中得 ¥30…」一条 → 改成轮播「哪些妈妈的笔记上了广场」：真实投稿（审核通过）排前，
    不够时用广场里点赞高的笔记补；只说「上了广场 / 入选精选」，不写某人领了多少钱。右边「我也投稿」= 原来的规则弹层 */
-.rwc{position:relative;display:flex;align-items:center;gap:9px;height:46px;padding:0 12px 0 7px;border-radius:15px;overflow:hidden;
+.rwc{position:relative;display:flex;align-items:center;gap:9px;height:46px;padding:0 12px 0 10px;border-radius:15px;overflow:hidden;
   background:linear-gradient(100deg,#FFF8F1 0%,#fff 38%);border:1px solid #FFE2D2;box-shadow:0 8px 20px -14px rgba(214,96,60,.45)}
-/* 11-07 用户：轮播要有设计感 → 左边金红「喜报」小标 + 白底卡；「入选精选」挪到标题右边做小标签 */
+/* 11-07 用户：轮播要有设计感 → 白底卡（「喜报」小标后来去掉了）；「入选精选」挪到标题右边做小标签 */
 .rwc::after{content:"";position:absolute;right:-18px;top:-26px;width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,rgba(255,196,150,.28),transparent 70%);pointer-events:none}
-.rwh{flex:none;display:flex;align-items:center;gap:3px;height:30px;padding:0 8px 0 7px;border-radius:10px;
-  background:linear-gradient(135deg,#FF7A4D,#E8343F);color:#FFE7A8;font-size:12px;font-weight:900;letter-spacing:1px;box-shadow:inset 0 0 0 1px rgba(255,220,150,.45),0 3px 8px -3px rgba(232,52,63,.6)}
-.rwh svg{width:13px;height:13px;fill:#FFD86B}
 .rwv{position:relative;flex:1;min-width:0;height:46px;overflow:hidden}
 .rwi{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:7px;height:46px;border:0;background:none;padding:0;font:inherit;text-align:left;color:#8A6A5E;font-size:12.5px;
   transition:transform .4s ease,opacity .4s ease}
@@ -500,7 +497,9 @@ button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:poin
 .rwi img{flex:none;width:24px;height:24px;border-radius:50%;object-fit:cover;background:#FFE3D3;box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px #FFD2BD}
 /* 11-07 用户：名字、「入选精选」都完整显示不省略，标题按剩下的宽度自动截 */
 .rwi b{flex:none;font-weight:800;color:#5A3226;white-space:nowrap}
-.rwi span{flex:1 1 auto;min-width:2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+/* 书名号《》放在标题外面，标题太长截成…时右边的》也留着 */
+.rwi .rbk{flex:none;font-style:normal;color:#8A6A5E;margin:0 -7px 0 0}.rwi .rbk.r{margin:0 0 0 -7px}
+.rwi span{flex:0 1 auto;min-width:2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .rwi em{flex:none;padding:0 7px;height:20px;line-height:20px;border-radius:99px;font-style:normal;font-size:10.5px;font-weight:800;color:#E8343F;background:#FFEDEA;box-shadow:inset 0 0 0 1px #FFD0C8}
 .rwb{flex:none;height:26px;padding:0 10px;border:0;border-radius:99px;background:linear-gradient(135deg,#FF8A65,#F2553A);color:#fff;font:inherit;font-size:11.5px;font-weight:800}
 .gtp{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:2px 14px 4px;padding:10px 12px;border-radius:14px;background:#fff;box-shadow:0 6px 16px -14px rgba(120,60,40,.35)}
@@ -1059,7 +1058,7 @@ html.night .gtg button.on{background:#F2725B;border-color:#F2725B;color:#fff}
   var CMD = null, CMERR = false;
   /* 头像编码：数字 = av/NNNN.webp（旧代码头像）；'av:c012' = av/c012.webp（卡通/可爱卡通）；'/…' = 站内绝对路径（内置头像库 /_bridge/avatars/）；其余 = assets/img/mom/xxx.jpg */
   var avP = function (a) { return typeof a === 'number' ? 'av/' + ('000' + a).slice(-4) + '.webp' : a.indexOf('av:') === 0 ? 'av/' + a.slice(3) + '.webp' : a.charAt(0) === '/' ? a : '../assets/img/mom/' + a + '.jpg'; };
-  fetch('cm.json?v=26110636').then(function (r) { return r.json(); }).then(function (j) {
+  fetch('cm.json?v=26110638').then(function (r) { return r.json(); }).then(function (j) {
     CMD = j; if (openId && NBY[openId]) { renderComments(NBY[openId]); syncBar(NBY[openId]); }
   }).catch(function () { CMERR = true; if (openId && NBY[openId]) renderComments(NBY[openId]); });
   function commentsOf(n) {
@@ -1685,7 +1684,7 @@ html.night .gtg button.on{background:#F2725B;border-color:#F2725B;color:#fff}
     var L = rwList(); if (!L.length) return '';
     var n = L[k % L.length];
     return '<button type="button" class="rwi" data-id="' + esc(n.id) + '"><img src="' + esc(avOf(n)) + '" alt="" loading="lazy"><b>' + esc(n.author) + '</b>' +
-      '<span>《' + esc(n.title) + '》</span>' + (n.real ? '<em>上了广场</em>' : '<em>入选精选</em>') + '</button>';   /* 11-07 用户：「入选精选」放到文章右边 */
+      '<i class="rbk">《</i><span>' + esc(n.title) + '</span><i class="rbk r">》</i>' + (n.real ? '<em>上了广场</em>' : '<em>入选精选</em>') + '</button>';   /* 11-07 用户：「入选精选」放到文章右边 */
   }
   function rwRun() {
     clearInterval(rwT); rwI = 0;
@@ -1708,7 +1707,7 @@ html.night .gtg button.on{background:#F2725B;border-color:#F2725B;color:#fff}
          标签作为唯一入口（末尾加「全部话题 ›」）；选中标签时标签下露出这一类的 2～3 个热门话题（用户同意）；投稿奖励一行挪到「大家在聊」上面。
          话题本身不变：投稿选话题、帖子卡上的 #话题#、话题详情页照旧。分类视图（catF）仍是原来的热门话题列表。 */
       el.innerHTML = qifuHTML() +
-        '<div class="rww"><div class="rwc"><span class="rwh"><svg viewBox="0 0 20 20" aria-hidden="true"><path d="M10 .5C10.9 7.4 12.6 9.1 19.5 10 12.6 10.9 10.9 12.6 10 19.5 9.1 12.6 7.4 10.9.5 10 7.4 9.1 9.1 7.4 10 .5Z"/></svg>喜报</span><div class="rwv" id="rwv">' + rwItem(0) + '</div></div></div>';   /* 11-07 用户：去掉礼物图标和「我也投稿」 */
+        '<div class="rww"><div class="rwc"><div class="rwv" id="rwv">' + rwItem(0) + '</div></div></div>';   /* 11-07 用户：去掉礼物图标和「我也投稿」 */
       rwRun();
       fh.className = 'shtg';
       fh.innerHTML = '<div class="sh"><h2>大家在聊</h2><small>孕妈们的分享</small></div>' +

index.html

@@ -9,10 +9,10 @@
 <title>兜爸心选 · 孕育陪伴</title>
 <!-- 11-04 UGC 总开关（孕妈广场 + 测一测，后台 /box_bm/plaza 顶部切换），见 js/ugc.js -->
 <script src="js/ugc.js?v=26110487"></script>
-<!-- V:26110636 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
+<!-- V:26110638 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
 <link rel="stylesheet" href="mama-box.css">
 <link rel="stylesheet" href="night.css?v=26110608">
-<link rel="stylesheet" href="js/wh-cm.css?v=26110636">
+<link rel="stylesheet" href="js/wh-cm.css?v=26110638">
 <!-- 11-04 用户：「顶部图片上的倒计时先删除掉」→ 不加载 hero-cd.css / hero-cd.js（文件留着，加回这两行即恢复），头图回到原样式 -->
 <!-- 夜晚模式：首屏绘制前就按上次的选择加 class，避免先白后黑闪一下（开关在首页右上角 #nightBtn，逻辑见 app.js） -->
 <script>try{if(localStorage.getItem('mmbox.night.v1')==='1'){document.documentElement.classList.add('night');document.querySelector('meta[name=theme-color]').content='#2A2340'}}catch(e){}</script>
@@ -2680,7 +2680,7 @@ html.night .rs-pan .rp-card{background:rgba(255,255,255,.06);border-color:rgba(2
 <script src="guangchang/topics.js?v=26110487"></script>
 <script src="js/ava-pool.js?v=26110487"></script>   <!-- 11-05 装饰头像分配表（各模块互不重复） -->
 <script src="js/wh-themes.js?v=26110609"></script>
-<script src="js/wh-cm.js?v=26110636" defer></script>
+<script src="js/wh-cm.js?v=26110638" defer></script>
 <script src="js/app.js"></script>
 <script src="js/kit.js?v=26110605"></script>
 <!-- 11-05 用户：孕期百问加上跟趣味小测试一样的底部 Tab（孕期百问 / 记一下 / 返回首页）。挂在 #detailQA 里，面板关着时跟着滑出屏外；

js/app.js

@@ -3,7 +3,7 @@
 (function () {
   'use strict';
   /* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */
-  var VER = '26110636';
+  var VER = '26110638';
   const $ = (s, c) => (c || document).querySelector(s);
   const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
 

js/wh-cm.css

@@ -25,7 +25,8 @@
 .wcs:not(.show) .wcs-rule,.wcs:not(.show) .wcm-tb{opacity:0}
 .wcs-x{display:none!important}
 .wcs.show .wcs-x{display:grid!important;margin-left:auto;align-self:center;display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff}
-.wcm-tb{display:flex;align-items:center;gap:6px;margin:10px 18px 2px}
+.wcm-tb{display:flex;align-items:center;gap:6px;margin:10px 14px 2px 18px}
+.wcm-tb button{flex:none}
 .wcm-tb button{height:26px;padding:0 12px;border-radius:99px;border:0;background:rgba(255,255,255,.07);color:rgba(232,222,255,.62);font:inherit;font-size:12.5px}
 .wcm-tb button.on{background:linear-gradient(135deg,rgba(255,214,170,.92),rgba(255,170,160,.92));color:#3A2312;font-weight:800}
 /* 重点：被赞 N 次就变成星星 */
@@ -168,3 +169,11 @@ p.wcm-mf{display:block;color:#FFC07A}
 .wcs-avs:empty{display:none}
 .wcs-avs img{width:18px;height:18px;border-radius:50%;object-fit:cover;border:1.5px solid #3A2C57;background:#4A3A6A}
 .wcs-avs img+img{margin-left:-7px}
+.wcs-avs img{transition:transform .26s ease,opacity .26s ease}.wcs-avs img.out{transform:scale(.4);opacity:0}.wcs-avs img.nw{animation:wavIn .45s cubic-bezier(.3,1.6,.5,1)}
+@keyframes wavIn{from{transform:scale(.3);opacity:0}}
+
+/* 11-07 规则横幅并进排序那一行 → 右边小胶囊 */
+.wcm-tb .wcs-rule{flex:0 1 auto;min-width:0;margin:0 0 0 auto;padding:0 10px 0 8px;height:26px;gap:4px;border-radius:99px;font-size:11.5px;white-space:nowrap}
+.wcm-tb .wcs-rule span{overflow:hidden;text-overflow:ellipsis}
+.wcm-tb .wcs-rule svg{width:13px;height:13px}
+.wcm-tb .wcs-rule b{font-size:13px}

js/wh-cm.js

@@ -37,8 +37,9 @@
   sh.innerHTML = '<div class="wcs-p" role="dialog" aria-label="妈妈们的留言">' +
     '<div class="wcs-hd"><i class="wcs-grab" aria-hidden="true"></i><div class="wcs-tt"><b>妈妈们的留言</b><span class="wcs-avs" id="wcmAv" aria-hidden="true"></span><span id="wcmN"></span><i class="wcs-up">上滑看看</i>' +
     '<button type="button" class="wcs-x" aria-label="收起"><svg viewBox="0 0 24 24" width="14" height="14"><path d="M6 6l12 12M18 6L6 18" stroke="currentColor" stroke-width="2.4" stroke-linecap="round"/></svg></button></div>' +
-    '<div class="wcs-rule"><svg viewBox="0 0 20 20"><path d="M10 .5C10.9 7.4 12.6 9.1 19.5 10 12.6 10.9 10.9 12.6 10 19.5 9.1 12.6 7.4 10.9.5 10 7.4 9.1 9.1 7.4 10 .5Z"/></svg><span>留言被赞 <b id="wcmRuleN">6</b> 次，就会变成一颗星星挂上去</span></div>' +
-    '<div class="wcm-tb" role="tablist"><button type="button" class="on" data-wso="hot">最热</button><button type="button" data-wso="new">最新</button><button type="button" data-wso="wk">同孕周</button></div></div>' +
+    /* 11-07 用户：「被赞 6 次变星星」放到 最热/最新/同孕周 同一行后边 */
+    '<div class="wcm-tb" role="tablist"><button type="button" class="on" data-wso="hot">最热</button><button type="button" data-wso="new">最新</button><button type="button" data-wso="wk">同孕周</button>' +
+    '<div class="wcs-rule"><svg viewBox="0 0 20 20"><path d="M10 .5C10.9 7.4 12.6 9.1 19.5 10 12.6 10.9 10.9 12.6 10 19.5 9.1 12.6 7.4 10.9.5 10 7.4 9.1 9.1 7.4 10 .5Z"/></svg><span>被赞 <b id="wcmRuleN">6</b> 次，就变成一颗星星</span></div></div></div>' +
     '<div class="wcs-ls" id="wcsLs"><div id="wcmLs"><p class="wcm-e">留言加载中…</p></div><button type="button" class="wcm-more" id="wcmMore" hidden>再看看</button></div>' +
     '<div class="wcs-in"><span class="wcs-to" id="wcsTo" hidden></span><input id="wcsIn" type="text" maxlength="200" enterkeyhint="send" placeholder="说点什么…"><button type="button" id="wcsSend">发送</button></div>' +
     '</div>';
@@ -69,7 +70,7 @@
   function repOf(c, me) { return { p: c.parent, n: me ? '我' : (c.nickname || '孕妈'), me: me, to: c.parentName, t: c.text, ts: c.at, st: me ? c.status : '' }; }
   function load() {
     if (loading || SIM) return; loading = true;
-    fetch('guangchang/cm.json?v=26110636').then(function (r) { return r.json(); }).then(function (j) {
+    fetch('guangchang/cm.json?v=26110638').then(function (r) { return r.json(); }).then(function (j) {
       var PP = j.p;
       SIM = (j.c[PID] || []).map(function (c, k) {
         var p = PP[c[0]];
@@ -87,6 +88,7 @@
         if (R.starLikes) STAR_N = R.starLikes;
         /* 11-07 用户改：别人的只出审核通过的；自己发的审核中也显示（标「审核中」，只有自己看得到），没通过的不出 */
         var mine = (R.mine || []).filter(function (c) { return c.status !== 'rejected'; });
+        avRealFrom((R.list || []).filter(top).concat(mine.filter(function (c) { return top(c) && c.status === 'approved'; })));
         REAL = (R.list || []).filter(top).map(realOf).concat(mine.filter(top).map(function (c) { var o = realOf(c); o.n = '我'; o.me = 1; o.st = c.status; return o; }));
         RREP = (R.list || []).filter(function (c) { return !top(c); }).map(function (c) { return repOf(c, 0); })
           .concat(mine.filter(function (c) { return !top(c); }).map(function (c) { return repOf(c, 1); }));
@@ -179,12 +181,47 @@
   function total() { return (REAL ? REAL.length : 0) + (SIM ? SIM.length : 0); }
   function paintGo() {
     document.getElementById('wcmN').textContent = total() ? total() + ' 条' : '';
-    /* 11-07 用户：「妈妈们的留言」后面加 6～8 个小头像 —— 取最热的 8 位 */
-    var av = document.getElementById('wcmAv');
-    if (av && SIM && SIM.length && !av.firstChild) av.innerHTML = SIM.slice().sort(function (a, b) { return b.likes - a.likes; }).slice(0, 8)
-      .map(function (c) { return '<img src="' + esc(c.av) + '" alt="" onerror="this.remove()">'; }).join('');
+    avPaint();
     document.getElementById('wcmRuleN').textContent = STAR_N;
   }
+  /* ---------- 「妈妈们的留言」后面的 8 个小头像（11-07 用户：随时换一些，有人新留言就变） ----------
+     最前面 = 最新留言（已通过）的真人头像，按时间倒序；不够 8 个用模拟留言的头像补（每次打开随机洗一遍）；
+     补位的每 5 秒换掉一个；页面开着时每 60 秒悄悄拉一次留言，只更新头像，不动正在看的列表。 */
+  var AVN = 8, AVPOOL = null, AVREAL = [], avPi = 0;
+  function avUniq(arr) { var seen = {}; return arr.filter(function (u) { if (!u || seen[u]) return false; seen[u] = 1; return true; }); }
+  function avPaint() {
+    var box = document.getElementById('wcmAv'); if (!box || !SIM || !SIM.length) return;
+    if (!AVPOOL) {
+      AVPOOL = avUniq(SIM.map(function (c) { return c.av; }));
+      for (var i = AVPOOL.length - 1; i > 0; i--) { var j = Math.floor(Math.random() * (i + 1)), t = AVPOOL[i]; AVPOOL[i] = AVPOOL[j]; AVPOOL[j] = t; }
+    }
+    var real = avUniq(AVREAL).slice(0, AVN), fill = [];
+    while (real.length + fill.length < AVN && avPi < AVPOOL.length * 2) { var u = AVPOOL[avPi++ % AVPOOL.length]; if (real.indexOf(u) < 0 && fill.indexOf(u) < 0) fill.push(u); }
+    var old = [].map.call(box.children, function (x) { return x.getAttribute('src'); });
+    box.innerHTML = real.concat(fill).map(function (u, k) {
+      return '<img src="' + esc(u) + '" alt=""' + (k < real.length ? ' data-r="1"' : '') + (old.indexOf(u) < 0 && old.length ? ' class="nw"' : '') + ' onerror="this.remove()">';
+    }).join('');
+  }
+  function avRealFrom(list) {
+    AVREAL = list.filter(function (c) { return c.status ? c.status === 'approved' : true; })
+      .sort(function (a, b) { return (b.at || 0) - (a.at || 0); }).map(function (c) { return c.avatar; });
+  }
+  setInterval(function () {   /* 补位的轮换 */
+    var box = document.getElementById('wcmAv'); if (!box || document.hidden || !AVPOOL || !page.classList.contains('show')) return;
+    var slots = [].filter.call(box.children, function (x) { return !x.dataset.r; }); if (!slots.length) return;
+    var have = [].map.call(box.children, function (x) { return x.getAttribute('src'); }), u, n = 0;
+    do { u = AVPOOL[avPi++ % AVPOOL.length]; } while (have.indexOf(u) >= 0 && ++n < AVPOOL.length);
+    var el = slots[Math.floor(Math.random() * slots.length)];
+    el.classList.add('out');
+    setTimeout(function () { el.src = u; el.classList.remove('out'); el.classList.add('nw'); setTimeout(function () { el.classList.remove('nw'); }, 500); }, 260);
+  }, 5000);
+  setInterval(function () {   /* 新留言 → 头像跟着变 */
+    if (document.hidden || !page.classList.contains('show') || !SIM) return;
+    fetch('/api/mp/public/mama-box/plaza/comments?kind=post&target=' + encodeURIComponent(PID)).then(function (r) { return r.json(); }).then(function (j) {
+      var R = j && j.code === 200 && j.result; if (!R) return;
+      var k0 = AVREAL.join('|'); avRealFrom((R.list || []).filter(top)); if (AVREAL.join('|') !== k0) avPaint();
+    }).catch(function () {});
+  }, 60000);
   function build() {
     if (!SIM || !REAL) return;
     SIM.forEach(simStar);