标题收到最上顶头,标签下移一行;顶栏标题回当前软件;去掉跨软件引导

用户三个问题:

一、软件名/分类/状态三个标签挤在标题前面,把标题推到右边很难看
  列表页:item-top 里 badges 在前、标题在后 → 标题被挤到右边
  详情页:同一个毛病
  改法(两处一致):
    行1 标题(顶头、独占一行)
    行2 标签(分类/状态;详情页还有软件名)
    行3 摘要 / 作者信息
  列表页新增 .item-head + .item-tags;详情页新增 .subject-head + .subject-tags。
  ⚠️ .item-top 保留 —— admin.php 有三处内部列表还在用,删了后台会塌。

二、顶栏「XX 反馈系统」点完跳首页
  用户:「点完之后应该还是进入这个反馈系统,而不是进到首页。首页没有太大作用,
        只是演示说明用的。正常使用都是每个软件独立,要让用户觉得
        这套反馈系统就是专门为这个软件做的。」
  改法:brand-mini 的 href 从 "./" 改为 fb_software_list_url()。

三、软件内部不该引导去其他软件
  用户:「在一个反馈系统里面,我要反馈、问题列表、左上角那个链接,
        全部都是这个软件相关的内容,跟其他软件没关系。」
  - 提交成功页删掉整个「也可以去其他软件反馈」区块及其 CSS
  - 删掉成功页的「返回首页」按钮(已有「看该软件其他反馈」,重复且无意义)
  - 跨软件只剩顶栏三横线菜单一个入口

验证:列表页/详情页 DOM 顺序均为 标题→标签→作者(实测 item-title 58 < item-tags 171;
subject-title 49 < subject-tags 151 < item-meta 592);
浏览器实测标题 top=282 标签 top=315(列表)、155→194(详情),标签确实在下方;
标题左边缘距卡片边 18/23px,就是卡片自身 padding,没有额外缩进;
顶栏标题 href=index.php?sw=synccalendar,不再指向根路径;全站 8 个路由 200。
This commit is contained in:
2026-11-03 13:43:15 +08:00
parent bec5b09bd6
commit c09a9875a3
6 changed files with 136 additions and 42 deletions
+92 -3
View File
@@ -449,8 +449,21 @@ main.wrap{padding-top:24px; padding-bottom:40px; min-height:60vh}
border-radius:13px; padding:15px 17px; box-shadow:var(--shadow); color:inherit;
}
.item:hover{border-color:var(--brand); text-decoration:none; box-shadow:0 3px 12px rgba(0,87,184,.10)}
/* 列表项:
* 行1 = 标题(顶头、单独一行)
* 行2 = 分类 / 状态 标签
* 行3 = 摘要、缩略图、作者信息
*
* 🔴 用户 2026-11-03:标签别放在标题前面。
* 以前 badges 和标题挤在同一个 flex 行里,标签占掉左边一大截,
* 标题被推到右边、长度不够就换行,很难看。
* 现在标题独占一行、从左边缘开始,标签另起一行。 */
/* ⚠️ .item-top 仍被 admin.php 的三处内部列表使用(后台待审核 / 详情头 / 操作日志)。
* 前台列表已改用 .item-head + .item-tags(标题独占一行),这里保留供后台用。 */
.item-top{display:flex; align-items:center; flex-wrap:wrap; gap:8px}
.item-title{font-weight:600; font-size:16px; flex:1; min-width:160px}
.item-head{display:flex; align-items:flex-start; gap:8px}
.item-title{font-weight:600; font-size:16px; flex:1; min-width:0; line-height:1.45; word-break:break-word}
.item-tags{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:7px}
.item-ex{color:var(--muted); font-size:14px; margin:8px 0 8px; word-break:break-word}
.item-meta{display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:13px; color:var(--muted)}
.item-meta .who{color:#3a424d; font-weight:600}
@@ -564,7 +577,12 @@ main.wrap{padding-top:24px; padding-bottom:40px; min-height:60vh}
/* ---------- 主题 / 回复 ---------- */
.subject{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px 22px; box-shadow:var(--shadow)}
.subject-title{font-size:21px; margin:0; flex:1; min-width:200px}
/* 详情页三段:标题(顶头独占一行)→ 标签行 → 作者信息行。
* 🔴 用户 2026-11-03:软件名/分类/状态这三个标签原来在标题前面,
* 把标题挤到右边去了。现在标题在最上面顶头,标签另起一行放下面。 */
.subject-head{display:flex; align-items:flex-start; gap:10px}
.subject-title{font-size:21px; margin:0; flex:1; min-width:0; line-height:1.4; word-break:break-word}
.subject-tags{display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:10px 0 0}
.subject-body{margin-top:14px; white-space:normal; word-break:break-word; line-height:1.85}
.subject-body br{content:""}
@@ -579,7 +597,78 @@ main.wrap{padding-top:24px; padding-bottom:40px; min-height:60vh}
.reply-body{word-break:break-word; line-height:1.8}
/* ---------- 表单 ---------- */
.narrow{max-width:640px}
/* 提交页容器。
* 🔴 原来只有 max-width:640px,**没有居中** —— 在 880px 的内容区里,
* 表单贴左边、右侧空出 240px 白,看起来像"页面缺了一块"。
* 用户 2026-11-03 指出这一点。现在:加 margin 居中,宽度放到 720px,
* 既不至于像正文那么宽(长行难读),也不会显得抠掉一块。 */
.narrow{max-width:720px; margin-left:auto; margin-right:auto}
/* ---------- 提交成功页 ----------
* 用户 2026-11-03:提交完不要跳走,要给回执 + 凭据 + 后续去处。 */
.submitted{
background:var(--card); border:1px solid var(--line);
border-radius:16px; padding:30px 32px 26px; margin-top:14px;
box-shadow:var(--shadow);
text-align:center;
}
.submitted-ok{
width:52px; height:52px; margin:0 auto 14px; border-radius:50%;
background:var(--ok-soft, #e8f6ee); color:var(--ok, #16794a);
font-size:26px; line-height:52px; font-weight:700;
}
.submitted h1{font-size:22px; margin:0 0 10px}
.submitted-lead{
font-size:14px; line-height:1.75; color:var(--muted);
margin:0 auto 20px; max-width:520px;
}
.submitted-lead b{color:var(--fg)}
/* 凭据框:要显眼但不能吓人 —— 用中性浅底 + 等宽字,看起来像"码" */
.token-box{
text-align:left; margin:0 0 22px; padding:15px 16px;
background:var(--bg, #f6f8fb); border:1px solid var(--line);
border-radius:11px;
}
.token-box-hd{
font-size:12.5px; font-weight:700; color:var(--muted);
letter-spacing:.3px; margin-bottom:8px;
}
.token-code{
font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
font-size:14px; font-weight:600; color:var(--fg);
padding:10px 12px; background:var(--card);
border:1px dashed var(--line-strong); border-radius:8px;
word-break:break-all; user-select:all; line-height:1.5;
}
.token-box-tip{
font-size:12.5px; line-height:1.7; color:var(--muted); margin:10px 0 0;
}
.token-box-warn{
font-size:12.5px; line-height:1.7; color:#8a5a10; margin:8px 0 0;
padding:7px 10px; background:#fff8e6; border-radius:6px;
}
.submitted-next{
font-size:13px; color:var(--muted); margin:0 0 10px; text-align:left;
}
.submitted-actions{
display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-start;
margin:0 0 22px;
}
/* (已删)submitted-others / submitted-sw ——
* 成功页不再列其他软件的入口,跨软件只有顶栏三横线菜单一个入口。 */
.submitted-credit{
margin:18px 0 0; padding-top:16px; border-top:1px solid var(--line);
font-size:12.5px; color:var(--muted); text-align:left;
word-break:break-all;
}
@media (max-width:600px){
.submitted{padding:24px 18px 20px}
.submitted-actions .btn{flex:1 1 auto; text-align:center}
}
.card-form{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px 22px; box-shadow:var(--shadow); margin-top:14px}
.field{display:block; margin-bottom:16px}
.field > span{display:block; font-size:14px; font-weight:600; margin-bottom:6px}