mirrors2/ONE
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
15 Commits 1 Branch 0 Tags
815eff9f9a3f2a4f8588645662361ed406388e9b
Commit Graph
10 Commits
Author SHA1 Message Date
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 a1d515e435 余白 UI：手机端适配（☰ 全屏菜单 + 筛选条收口）+ 若干层叠与卡片修正 
手机端（≤720 / ≤640）
- 窄屏导航不再平铺：设计稿在窄屏把导航整个 display:none，手机上会没有任何
  入口，之前的做法是在品牌行下再摊一条横向滚动行，5 个中文项挤成一条读起来
  很碎。改为顶栏只留「头像 + ☰」，点 ☰ 开全屏菜单：竖排大字 + 英文小标、
  当前项高亮、底部放主题切换；顶行复用同款标头（关掉时视觉不跳），
  Esc / 点击空白 / 路由变化 / 窗口拉宽回桌面 都会关闭，
  打开时锁背景滚动并把焦点交给对话框（preventScroll）
- 顶栏主题切换 ◐ 在窄屏收进 ☰：两边各一个就是重复。桌面没有 ☰，
  且那枚 ◐ 是设计稿顶栏自带的（index.html:782），所以只在窄屏藏
- 筛选条：≤640 收起标签 chips（会折三四行）与搜索框，只留类型分段；
  标签仍有 /tags 整页入口
- viewport 补 viewport-fit=cover / interactive-widget；触屏补
  -webkit-tap-highlight-color、touch-action:manipulation、44px 可点目标、
  16px 输入框（防 iOS 聚焦缩放）

层叠（这次量出来的真问题）
- 新增 mobile.css 并在 main.ts 里最后 import：.hero/.wrap/.paper/.about-card/
  .toolbar 的窄屏覆盖原本写在 chrome.css（第 2 个 import），同特指度被
  home/article/pages.css 全程压掉 —— 媒体查询不加特指度，「后导入者赢」，
  所以手机上左右留白一直是 28px 而不是设计意图的 18px，圆角/内边距也没换过。
  现统一到 20px，实测 hero / wrap / showcase 左边缘对齐；
  同时删掉 home.css 里那条 ≤860 的 showcase 18px（与同宽度下 hero 的 28px 错开）
- .icon-btn 的 44px 触屏尺寸从 tokens.css 挪回 chrome.css 自己那边：
  原位置被后导入的同特指度 36px 反压，触屏上实际是 36×44 的椭圆
- .toolbar 防线补 border:0：只中和 top 会漏出左右两道边框
- 后台 3 处 100vh 补 100dvh 兜底；9 处 transition:all 展开为显式属性列表；
  19 处 :hover 收进 @media (hover:hover) and (pointer:fine)（触屏不再粘住 hover）

组件修正
- 首页作品卡片改用与 /projects 同一套结构：文字包进 .body（.proj 自身
  padding:0，原来 h3/p 直接贴左边框）、有封面才渲染 .cov（原来无封面时留
  150px 空色块）、无封面时用 .st-plain 显示状态
- .proj-grid 轨道下限改 min(300px,100%)：320px 视口下裸 300px 会顶破容器，
  被 body 的 overflow-x:hidden 裁掉右边
- 「全部作品 / 查看所有作品」改 RouterLink（原为 <a href>，会整页重载）

清理
- 删除 panels.css：.panels/.panel/.cloud/.plist/.about-box 在 vivid 里已无任何
  使用者（后台走 data-ui=classic，命中不到），连带 tokens.css 里的死规则与
  main.ts 的 import
- 修正注释里残留的 panels 描述

验证：headless Chromium 同源 iframe 探针 + 截图，390 / 320 / 1200 三档；
/admin 确认 classic 未被带坏；npm run build 无警告。
 2026-09-23 23:20:51 +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
Sakurasan 3238175ef0 作品展示页：前端展示 + 后台增删改查 
- 新增 projects 表与迁移（唯一 slug 索引）
- 后端：公开 GET /api/projects，后台 GET/POST/PUT/DELETE /api/admin/projects
- 前端：/projects 双虚线边框卡片页（参考 diygod.cc/projects），后台管理页
- 左栏/手机顶栏/后台侧栏均加「作品」入口
- 补充项目 CRUD 单元测试与后台鉴权拦截测试
 2026-09-22 01:47:59 +08:00
Sakurasan 2b53eb976b 流体交互层：按压反馈 + 真半透明材质 + 主题交叉过渡 + 弹层材质化 
按 apple-design（Designing Fluid Interfaces）审查落地：
- 全站补 :active 按压缩放反馈（按钮/tab/链接/命令面板/前后栏导航），交互元素加 touch-action
- TopBar、首页标题栏、浮动主题钮改 color-mix 半透明 + blur 真材质，配 reduced-transparency 回退
- 主题切换 250ms 交叉过渡（theme-anim 瞬时类），消除亮度突变
- CommandPalette/ShortcutsPanel 过 <Transition name="pop">：scrim 淡入 + 面板自顶部锚点 scale 进入，退出原路返回
- 首页标题栏收缩由二值跳变改为滚动进度 --sq 连续插值（16–56px）
- reduced-motion 例外：弹层保留短交叉淡入，禁位移与主题过渡
- 触控目标增大（主题钮 40/44px、tab、后台导航项），文章大标题负字距 + 收紧行高
 2026-09-22 00:45:51 +08:00
Sakurasan dd2994189a 安全加固 + 结构清理：修注入/串写/竞态，DOMPurify 上线，后端补事务与 handler 测试 
后端：
- ORDER BY 白名单（sanitizeOrder）堵住 ?order= SQL 注入，补回归测试
- 登录限速（每 IP 10 次失败/10 分钟 429）、TLS/反代下 Secure cookie、NewAPI 构造器
- Delete/setTags/MergeTags/DeleteTag 包事务；Archive 去 500 篇上限
- 列表接口裁剪：不传 content_md，长文 content_html 截 600，新增 content_len；health 探 DB

前端：
- EditorView 路由复用串写修复（RouterView :key + sync watch 回写原文章）
- v-html 出口统一过 DOMPurify（sanitizeHtml），stripTags 改 DOMParser
- 列表竞态防护（Home/Tag/Posts 请求序号）、TagView 分页修复
- 侧栏接口 30s 缓存去重；one:unauthorized 监听器泄漏修复
- 删 styles.css 498 行重复块；移除 tailwind/marked/vue-tsc 死依赖；CommandPalette a11y 语义
 2026-09-21 23:59:09 +08:00
Sakurasan c762f06cd7 首页：右侧栏收窄 + 标题栏滚动收缩贴顶 
- --col-right 306→264，右侧卡片更紧凑
- HomeView 加滚动监听，滚动后 .sticky-head 进入 is-compact：大标题平滑折叠，仅 tabs 贴顶
- ≤780px 时 sticky-head top:54px 避让吸顶 TopBar
 2026-09-21 22:53:18 +08:00
cjun a721e26e45 后台管理重塑 + 主题 / 皮肤双轴 + a11y 与编辑器增强 
Backend
- Post 加 cover_url，Tag 加 color；老库 ALTER 兼容
- admin API: GET /api/admin/dashboard，POST /bulk，POST /tags/:id/merge，
  PUT /tags/:id 接 {name,color}，Settings 加 light_skin_id（兼容老 theme_id）
- 白名单兜底（非法 light_skin_id 落 paper）
- 新增合并 / Dashboard / Theme 测试覆盖

Frontend
- AdminLayout 改为侧边栏布局；新增 Dashboard 总览页
- PostsView 卡片化预览 + 筛选 chip + 批量操作 + 排序
- EditorView 增强：封面图 / WYSIWYG↔MD 双模式 / 实时大纲 / 字数统计 /
  自动保存条 / ⌘S / unsaved 守卫（beforeunload + beforeRouteLeave）
- TagsView 加色板 + 合并到目标
- SettingsView 主题外观改为「亮色皮肤」三选一 + 「暗色皮肤」固定墨色说明
- 新增 CommandPalette（⌘K）+ ShortcutsPanel（?）
- api.js 接新接口；router.js 拆 /admin → /admin/posts

主题 / 皮肤双轴
- site.js: themeMode（light/dark/auto）+ light_skin_id；data-theme 前台，
  data-admin-theme 后台（仅跟随 mode 切明暗）
- styles.css: :root[data-theme] 四套皮肤 + :root[data-admin-theme=dark] 后台墨感
- 修 sticky head / ThemeSwitcher / 表单 / 批量条 等 token 引用
- 后台用独立 --admin-* 系列，与前台主题解耦
- 左栏底部放 inline 形态 ThemeSwitcher（图标按钮 36×36），mobile 保留浮窗

a11y
- 全局 :focus-visible 描边（前后台跟随 token）
- prefers-reduced-motion 全局降级
- color-scheme 随主题切
- meta theme-color 双套（light/dark）
- 命令面板 / 快捷键面板：role=dialog aria-modal aria-label + 搜索框 aria-label
- icon-only 按钮加 aria-label（tag × / 清除选择 / 移除封面等）
- 输入框 aria-label + spellcheck=false
- PostsView 筛选同步 URL（可分享、可刷新保留）
- img width/height + loading=lazy
- utils.js 用 Intl.DateTimeFormat（zh-CN / sv-SE）
 2026-09-21 22:14:58 +08:00
Sakurasan 4d8f2de3a4 MVP: 按 07 风格重写前端 + Go 后端落地（长文/短文、编辑器、后台管理） 2026-09-20 20:56:03 +08:00
Sakurasan edee708802 baseline: 保留 07 风格重写前的 Vue 前端原件 2026-09-20 20:48:00 +08:00