mirrors2/ONE
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
55 Commits 1 Branch 0 Tags
baf14897aac4a7152a4fb73755163285eb814e97
Commit Graph
7 Commits
Author SHA1 Message Date
Sakurasan b93fe9847c 长文图片缩放：编辑器拖拽把手的比例在文章页生效（alt 数字还原为宽度并居中）+ 把手默认半透明提高可发现性 2026-09-28 23:05:08 +08:00
Sakurasan 661d157b6c 短文支持链接预览卡片：新增 linkmeta 抓取 + 字符集解码 
- internal/linkmeta：取正文第一个 http(s) 链接，解析 og: → twitter: → <title>/
  description 逐级兜底，解 HTML 实体、相对图片补成绝对地址。按对外抓取设防：
  只放行 http(s)、读满 512KB 即停、最多 3 次跳转、整体限时；SSRF 防护做在拨号
  那一刻——解析出 IP 后筛掉回环/私网/链路本地/组播/CGNAT 再直连该 IP，堵住
  DNS 重绑定窗口
- 字符集转换：按「HTTP 头 charset → <meta charset> → UTF-8」解码，gb2312 归一
  成 gbk（超集，按声明解会漏字）；认不出的字符名退回原始字节不报错。为此引入
  golang.org/x/text（官方包，约 +1MB 二进制）。tidy 顺带把 aws-sdk 三个包从
  indirect 修正为直接依赖——storage/r2.go 本来就直接用它们
- posts 加 link_card 列（JSON，沿用 images 的编解码）；admin 保存短文时重算：
  同链接沿用旧卡片不重复打远端，删链接或抓取失败则清空，长文不参与
- 前端 LinkCard 组件接两套 UI 的时间线与详情页，配色写成 vivid 变量优先、
  classic 变量兜底，一份样式两边通用；外链图挂了自动隐藏不留空框
- 卡片用 div[role=link] 而非 <a>（vivid 整条短文包在 RouterLink 里，嵌套 <a>
  非法），点击必须 preventDefault——只 stop 挡不住祖先 <a> 的默认激活行为
 2026-09-28 17:13:20 +08:00
Sakurasan 740d47bbf6 短文配图：快发盒上传 + Twitter 式网格 + 全站 lightbox 预览；整卡点击进详情、时间线短文豁免首字 2026-09-27 23:41:34 +08:00
Sakurasan 815eff9f9a 评论阶段一（前端）：评论区 + 登录引导卡 + dev mock，经典头像留白修复 
评论区（按已批准的设计文档，阶段一=前端；后端与多用户为阶段二/三）
- classic / vivid 共用同一份 DOM：CommentSection + CommentItem（回复一层、
  自引用渲染，回复/编辑框模板只写一份）+ CommentMarkdown（唯一 v-html 出口，
  必过 sanitizeHtml）。比计划里的两套组件少一半文件，也避免两边结构漂移
- 数据层：api.js 追加 readerApi（me/providers/logout/comments/thread/create/
  edit/remove）；src/reader.js 读者身份 reactive 单例（仿 site.js，
  挂 one:unauthorized 清 user）；composables/useComments 按文章实例化
  （刻意不做单例，换文章必须重置），乐观插入按当前排序落位
- 交互：排序（默认/最新/最早）、发表、回复（一层 + 加载更多回复）、
  10 分钟内编辑、软删、分页（显示更多 N 条）、骨架屏、空态、错误态、审核中徽章
- 登录引导卡：三种 provider（GitHub/Google/Telegram）；redirect 类整页跳转，
  widget 类（Telegram）点击时内联官方脚本（无跳转、无回调，官方按钮落位）
- 样式：styles.css 追加 .cm-* 基础段（经典 token，vivid 靠别名继承同一份规则）；
  ui/yohaku/comments.css 只写 vivid 差异（全前缀、特指度盖过基础版），
  自己的窄屏/触屏规则写在文件内，不塞 mobile.css
- main.ts：comments.css 插在 pages 之后 mobile 之前（层叠契约不变）；
  dev mock 用 ?mock 门控动态 import，await 装完再挂载，否则首屏请求会打到真接口

修三处真问题
- vivid 的 a{color:inherit} 重置（特指度 0,1,2）把作者链接名拉回 body 色，
  暗色下暗底暗字 —— 用 a.cm-name-a 压回
- classic 文章页整页掉进 236px 左列：PostView import 了 LeftNav/RightRail
  却没渲染，补上（与 HomeView 三栏一致），文章页回到 640px
- classic 信息流头像贴死列边框：.row-feed 的负 margin 正好抵光左右内边距，
  改 padding 14/16 -> 14/30（30 = 16 出血 + 14 留白，hover 底色与分隔线仍铺满整列）

mock 假数据
- 8 位作者（三种登录方式、不同色相头像、两个走首字母兜底）、
  默认一屏 8 条各测一个排版点（代码块/引用/列表/已删除/审核中/已编辑/站长徽章/
  加载更多回复），长列表态 26 条测分页；右下角浮层切 9 个状态（?mock&state=），
  ?ui=classic 可强制 classic 壳（平时渲染不出来，没法做探针）

验证（headless Chromium + CDP 真实时间截图；virtual-time 对含动态 import 的页面
截图时机不稳，会截出全白，已换 CDP 方案）
- 头部计数 13px/tabular-nums、.seg 3 选 1；头像 50% 圆、36/24px；
  气泡圆角 3,20,20,20（缺角）；回复缩进 36px 且无二层嵌套；360 宽无横向溢出
- 暗色：气泡/输入框/名字全部适配（量的时候被 a 的 150ms 颜色 transition 骗过，
  t0 与 t400 两次测量值不同才看清，稳态正确）
- 产物：CSS 顺序 styles→pages→comments→mobile；49 条评论规则全带
  html[data-ui=vivid] 前缀；grep __COMMENT_MOCK__ 为空、无 mock chunk —— 生产零 mock
 2026-09-26 18:36:12 +08:00
Sakurasan 8fd8674910 余白：文章详情按 innei.in 重排题头与正文 + 顶栏宽度统一 + 纸面留白收紧 
参考 innei.in 的文章页（它本身也用 yohaku 命名，把它的 CSS 拆出来对了值）

题头居中
- 元信息行 justify-content:center + tabular-nums（日期/字数等宽，换行不左右跳），
  标题 text-align:center + text-wrap:balance（防居中标题折出「最后一行只落一两个字」）；
  正文仍回到左对齐，和参考一致
- 这几条都改成 > 直接子元素：原来的 .paper h1 会连正文里的 h1 一起命中
  （有的文章正文就是从 `# 标题` 开始的），把正文标题也居中了——手机截图上一眼看到

正文
- 段距 0 0 1.35em -> 上下各 1.5em（参考 .v10dui0 .rich-paragraph），首末元素吃掉外边距
- 补设计稿漏掉的 h1 / h3 / ol / img / figcaption（h1 之前是浏览器默认 2em+.67em 外边距、
  h3 是 1.17em，在 16.5px/1.95 的正文里很突兀；插图之前顶满整列且和文字紧贴）
- 链接改用 text-decoration（1px、underline-offset 2px、hover 加粗 2px）替掉 border-bottom
- 分隔线收成 60px 居中细线；.prose 加 text-autospace:normal（中英混排自动字距）

把 classic 的 .prose 挡回去
- styles.css 那段 .prose 不带 data-ui 前缀，vivid 也照样命中；我们的规则特指度更高，
  但只覆盖自己声明过的属性，没声明的就漏过来。量出来并逐条认领：
  a 的 border-bottom（和新下划线叠成双线）、hr 的 height+background（细线被垫成 2px）、
  h3::after（每条 h3 下方多一条 28×2 强调色横杠）、ul/ol 的 1.1em 下边距、
  blockquote 末段 p、pre 的 1px 边框、h4（用 classic 的 16.5px 不成层级）
- 首字下沉也在这批里：设计稿没有，是 classic 漏过来的固定 52px，参考站余白模式也有，
  于是认领成自己的 2.4em（跟着正文字号缩放），短文按 classic 的分法关掉

顶栏宽度
- 撤掉上一版按 /post/* 放宽到 1340 的 .top-in.wide：从首页点进文章时导航会跳一下。
  顶栏全站固定 1100，品牌与主题键在首页和文章页落在同一 x（实测 199 / 1207）

纸面与栅格收紧
- .paper padding 44/48/52 -> 30/24/40；--v-measure 680 -> 728；中列仍 776 = 728 + 24×2
  （这三个数是一组，只改内边距会让正文在列里偏左：实测离左栏 83px、离右栏 131px）
- .article-layout max-width 1340 -> 1272、padding 36/28/60 -> 24/24/44、gap 32 -> 24。
  上限必须正好等于「三栏 + 两个 gap + 左右内边距」，声明的 gap 才是渲染出来的 gap：
  180+776+220+24×2 = 1224 内容宽，+48 = 1272。否则 space-between 把富余塞回列间隙，
  数字改小也不动（实测只改 pad/gap 数字，正文到侧栏反而 78 -> 86）
- 手机 .article-layout padding 24/20/48 -> 20/20/40

实测（用列的实际位置反推，不信任声明值；正文宽度用 offsetWidth，.paper 有入场动画的 scale）
- 1456：正文到侧栏 78 -> 48，正文 728 不变，布局 1340 -> 1272
- 1280：正文 697 -> 721；1200：617 -> 641；三档实际列间隙都等于声明的 24
- 公网 138.2.17.73:8080 产物 md5 与磁盘一致；npm run build 无警告
 2026-09-24 01:03:59 +08:00
Sakurasan 5f82b6012f 余白：手机端文章去卡片 + 信息流元信息下移 + 标签统一为纯文本 #标签 
信息流（首页）
- 元信息（类型 / 日期 / 时长 / 字数）从标题上方挪到摘要之后，和标签同一块：
  卡片开头只留标题摘要，读完再看「什么时候、多长」
- 标签去掉 chip 样式，改为纯文本 #标签（# 走 ::before，链接的可读名仍是标签本身）；
  原来那排药丸看着能点，其实是卡片链接里的 span，点哪儿都进文章
- .card .tags / .note .tags 间距 6px -> 14px，配合纯文本

文章详情页
- 手机上不再套卡片：.article-layout 28px + .paper 22px + 卡片边框三层一共
  吃掉约 84px，390 屏上正文只剩 275px；平铺后 330px。同时关掉卡片右上角
  那团强调色渐晕（::before，卡片没了就只剩一块脏）。桌面 / 平板仍是卡片
- 底部标签跟信息流统一成纯文本 #标签，并去掉「标签」二字的小标
  （有 # 就是标签，再来两个字是重复）
- 详情页的标签是链接，补 padding:6px 0 —— 12.5px 裸文字按下去只有 ~18px 高，
  手机上不好点；不画背景不画边框，观感不变

标签样式只有 home.css 一处 .tg，信息流与详情页共用。

验证：headless Chromium 从站上量取计算样式 + 截图（390 / 1280）
- 详情页手机：paper bg=透明 border=0 radius=0 shadow=none padding=0，::before=none，
  正文 330px；桌面：bg=#fffefb border=1px radius=20px padding=48px，::before=block
- .end 子元素只剩 [A.tg, A.tg]；.tg 12.5px / padding 0 / ::before "#"；gap 14px
- 公网 138.2.17.73:8080 产物 md5 与磁盘一致；npm run build 无警告
 2026-09-24 00:09:29 +08:00
Sakurasan fbda293072 余白 UI：按设计稿模块化还原 + 站主自定义 CSS + 详情 neighbors + 静态缓存头 
前端（新增 ui/yohaku/，各视图按 ui_id=vivid 分支渲染；classic 与后台不受影响）
- 令牌层：设计稿数值原样落地，28 个 --v-* 为站主接口（自定义 CSS 可覆盖，
  放 @layer 让出优先级）；另加防线，中和 styles.css 裸选择器
  （h1 衬线 / body 行高 / 后台 .stat/.toolbar/.chip 卡片）漏进余白元素
- 顶栏（滚动收缩态）/ 阅读进度（顶部 2px + READ n%）/ 页脚
- 首页：hero（统计条）/ 筛选（类型分段 + 标签 chips + 搜索）/
  长文卡片与短文纸条 / 分页 / 作品展示区（3 件 + 查看所有，参照 diygod.cc）；
  面板栅格改 1.6fr 1fr 1fr 且高度自适应内容（标签云明显大一圈）
- 文章页：三栏「纸」—— 左时间线（前后各两篇）/ 中纸张 / 右目录与阅读进度；
  短文详情不显示标题（h1 视觉隐藏保留无障碍）
- 全部规则收敛在 html[data-ui='vivid'] 前缀下；无 !important

后端
- GET /api/posts/:slug 增 neighbors（前后各两篇，详情页侧栏时间线用）
- SPA 缓存头：index.html no-cache，assets/ 带 hash 长期 immutable
  （此前无缓存头，浏览器会一直拿旧构建）

其他
- 站主自定义 CSS 管线（customCss.js + ui/sections.js，按分区注入，仅 vivid）
- 删除旧 vivid 覆盖层实现（VividNav/Hero/Footer/Timeline/Toc、ui/vivid.css）
- 设计稿原型附于仓库根 index.html；作品表清掉外链 diygod.cc 的示例封面，
  改用本地占位图（public/covers/）
 2026-09-23 15:37:42 +08:00