标题收到最上顶头,标签下移一行;顶栏标题回当前软件;去掉跨软件引导
用户三个问题:
一、软件名/分类/状态三个标签挤在标题前面,把标题推到右边很难看
列表页: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:
+92
-3
@@ -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}
|
||||
|
||||
@@ -165,12 +165,17 @@ fb_layout_head($sw ? fb_software_site_title($sw) : $headTitle, ['software' => $s
|
||||
<?php else: ?>
|
||||
<?php foreach ($threads as $t): ?>
|
||||
<a class="item" href="thread.php?id=<?php echo (int)$t['id']; ?>">
|
||||
<div class="item-top">
|
||||
<span class="badge cat"><?php echo e(fb_category_label($t['category_id'])); ?></span>
|
||||
<span class="badge st st-<?php echo e($t['status']); ?>"><?php echo e(fb_status_label($t['status'])); ?></span>
|
||||
<?php /* 标题单独占第一行、从最左边顶头开始 ——
|
||||
用户 2026-11-03:标签放在标题前面会把标题挤到右边,很难看。
|
||||
顺序改为「标题 → 标签」:标题在上,分类/状态另起一行。 */ ?>
|
||||
<div class="item-head">
|
||||
<span class="item-title"><?php echo e($t['title']); ?></span>
|
||||
<span class="item-id" title="问题编号">#<?php echo (int)$t['id']; ?></span>
|
||||
</div>
|
||||
<div class="item-tags">
|
||||
<span class="badge cat"><?php echo e(fb_category_label($t['category_id'])); ?></span>
|
||||
<span class="badge st st-<?php echo e($t['status']); ?>"><?php echo e(fb_status_label($t['status'])); ?></span>
|
||||
</div>
|
||||
<p class="item-ex"><?php echo e(fb_excerpt($t['excerpt'], 120)); ?></p>
|
||||
<?php if (!empty($attImgs[(int)$t['id']])): ?>
|
||||
<div class="thumbs">
|
||||
|
||||
+1
-1
@@ -8,7 +8,7 @@ if (!defined('FB_ROOT')) {
|
||||
define('FB_ROOT', dirname(__DIR__));
|
||||
// 静态资源版本号:改 assets/ 下的 css/js 后把这个数字 +1,
|
||||
// 让浏览器与 CDN 缓存失效。全站只此一处,别再往页面里写死数字。
|
||||
if (!defined('FB_ASSET_V')) { define('FB_ASSET_V', 32); }
|
||||
if (!defined('FB_ASSET_V')) { define('FB_ASSET_V', 34); }
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------------
|
||||
|
||||
+9
-1
@@ -71,7 +71,15 @@ function fb_layout_head($title, array $opt = []) {
|
||||
list($curSwColor) = fb_software_colors($curSw);
|
||||
if ($curSwColor === '') { $curSwColor = '#0057B8'; }
|
||||
?>
|
||||
<a class="brand-mini" href="./"
|
||||
<?php /* 🔴 点标题回到**当前软件**的列表,不是回首页。
|
||||
用户 2026-11-03:「点完之后应该还是进入这个反馈系统,而不是进到首页,
|
||||
首页其实没有太大作用 —— 它只是演示/说明用的。
|
||||
正常人用的时候都是每个软件独立使用,要让用户觉得这套反馈系统
|
||||
就是专门为这个软件做的。」
|
||||
⇒ 在某个软件的反馈系统里,标题 / 「问题列表」/「我要反馈」
|
||||
全都只跟这个软件有关,跟其他软件无关。
|
||||
想切别的软件,只有右上角三横线那一个入口。 */ ?>
|
||||
<a class="brand-mini" href="<?php echo e(fb_software_list_url($curSw)); ?>"
|
||||
style="--swc:<?php echo e($curSwColor); ?>"
|
||||
title="<?php echo e(fb_software_site_title($curSw)); ?>">
|
||||
<?php echo fb_software_badge($curSw, 'brand', fb_software_site_title($curSw)); ?>
|
||||
|
||||
@@ -179,7 +179,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
* 🔴 关键取舍:**不跳转、不用 302**。跳转会让用户失去"我刚提交成功"这一帧,
|
||||
* 而且详情页此刻还是「未公开」状态,跳过去反而像出错了。
|
||||
* 这里直接把成功页渲染出来,把 token 明明白白摆在眼前。 */
|
||||
fb_render_submitted($sw, $newId, $trackToken, $form, $swList);
|
||||
fb_render_submitted($sw, $newId, $trackToken, $form);
|
||||
exit;
|
||||
}
|
||||
}
|
||||
@@ -289,7 +289,7 @@ fb_layout_foot();
|
||||
* 邮件可能进垃圾箱、也可能被误删。把码当场亮出来,用户至少能复制存档,
|
||||
* 不至于彻底失去跟踪能力。这是"唯一凭据",丢了就找不回来(我们不认人)。
|
||||
* ================================================================== */
|
||||
function fb_render_submitted($sw, $newId, $token, array $form, array $swList) {
|
||||
function fb_render_submitted($sw, $newId, $token, array $form) {
|
||||
$swName = $sw ? (string)$sw['name'] : '';
|
||||
fb_layout_head('反馈已提交', ['robots' => 'noindex,nofollow', 'software' => $sw]);
|
||||
?>
|
||||
@@ -326,38 +326,25 @@ function fb_render_submitted($sw, $newId, $token, array $form, array $swList) {
|
||||
查看这条反馈
|
||||
</a>
|
||||
<a class="btn" href="new.php<?php echo $sw ? '?sw=' . e(urlencode((string)$sw['slug'])) : ''; ?>">继续提交一条</a>
|
||||
<?php /* 不再放「返回首页」—— 在某个软件的反馈系统里,首页(全局介绍页)
|
||||
对用户没有意义。要回就回这个软件的问题列表。
|
||||
想看别的软件,只有右上角三横线一个入口。 */ ?>
|
||||
<a class="btn" href="<?php echo e(fb_software_list_url($sw)); ?>">
|
||||
<?php echo $swName !== '' ? '看看「' . e($swName) . '」的其他反馈' : '返回问题列表'; ?>
|
||||
</a>
|
||||
<a class="btn" href="index.php">返回首页</a>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
/* 其他软件的入口:只列除了当前这个之外的,避免重复 */
|
||||
$others = [];
|
||||
foreach ($swList as $s) {
|
||||
if ($sw && (int)$s['id'] === (int)$sw['id']) { continue; }
|
||||
$others[] = $s;
|
||||
}
|
||||
if ($others):
|
||||
/* ⚠️ 这里原来有一个「也可以去其他软件反馈」的列表,已删除。
|
||||
*
|
||||
* 用户 2026-11-03:「在某个软件的反馈系统里面,什么我要反馈、问题列表、
|
||||
* 还有左上角的那个链接,全部都是这个软件相关的内容,跟其他软件没关系 ——
|
||||
* 相对来讲它是独立的。他如果想进别的软件,只有右上角三个横线点开。」
|
||||
*
|
||||
* 所以在软件内部(列表 / 详情 / 提交页 / 成功页)都不引导用户去别的软件。
|
||||
* 唯一的跨软件入口就是顶栏那个三横线菜单。
|
||||
*/
|
||||
?>
|
||||
<div class="submitted-others">
|
||||
<div class="submitted-others-hd">也可以去其他软件反馈</div>
|
||||
<div class="submitted-others-list">
|
||||
<?php foreach ($others as $s): ?>
|
||||
<?php
|
||||
list($c) = fb_software_colors($s);
|
||||
if ($c === '') { $c = '#0057B8'; }
|
||||
?>
|
||||
<a class="submitted-sw" href="new.php?sw=<?php echo e(urlencode((string)$s['slug'])); ?>"
|
||||
style="--swc:<?php echo e($c); ?>">
|
||||
<?php echo fb_software_chip($s); ?>
|
||||
<span class="submitted-sw-go">去反馈 →</span>
|
||||
</a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php
|
||||
$creditUrl = (string)fb_cfg('footer.credit_url', fb_credit_url_default());
|
||||
|
||||
+8
-3
@@ -195,16 +195,21 @@ fb_layout_head(fb_excerpt($thread['title'], 50), ['software' => $thSwForColor]);
|
||||
<?php endif; ?>
|
||||
|
||||
<article class="subject">
|
||||
<div class="item-top">
|
||||
<?php
|
||||
$thSw = !empty($thread['software_id']) ? fb_software((int)$thread['software_id']) : null;
|
||||
$thCat = !empty($thread['category_id']) ? fb_category((int)$thread['category_id']) : null;
|
||||
?>
|
||||
<?php /* 标题在最上面、顶头开始;软件名/分类/状态另起一行放下面。
|
||||
用户 2026-11-03:这三个标签挤在标题前面,把标题推到右边很难看。
|
||||
⚠️ 顺序是「行1 标题 → 行2 标签 → 行3 作者信息」,别把标签挪回前面。 */ ?>
|
||||
<div class="subject-head">
|
||||
<h1 class="subject-title"><?php echo e($thread['title']); ?></h1>
|
||||
<span class="item-id" title="问题编号">#<?php echo (int)$id; ?></span>
|
||||
</div>
|
||||
<div class="subject-tags">
|
||||
<?php if ($thSw): ?><?php echo fb_software_chip($thSw); ?><?php endif; ?>
|
||||
<?php if ($thCat): ?><span class="badge cat"><?php echo e((string)$thCat['name']); ?></span><?php endif; ?>
|
||||
<span class="badge st st-<?php echo e($thread['status']); ?>"><?php echo e(fb_status_label($thread['status'])); ?></span>
|
||||
<h1 class="subject-title"><?php echo e($thread['title']); ?></h1>
|
||||
<span class="item-id" title="问题编号">#<?php echo (int)$id; ?></span>
|
||||
</div>
|
||||
<div class="item-meta">
|
||||
<span class="who"><?php echo e($thread['author_name']); ?></span>
|
||||
|
||||
Reference in New Issue
Block a user