Files

T

tamakyi 0c39afff3a theme v4: 装饰层 + 砂狼白子 Q 版插画

- base.css 新增装饰层令牌 --tb-deco / -size / -position：固定 6 个槽位、固定像素四角定位，
  不受 cover 裁切影响（竖屏桌面会把贴边的插画切掉）。多层背景的列表长度必须恒定，
  值一多一少会整层错位（表现为整页重复同一张图）。
- shiroko：4 个 Q 版人物（wave/cheer/think/sit/doze），以用户立绘为参考图 image-to-image
  生成后抠白底；左右各两个、立绘在右下当水印。顶部用固定 96px 避开顶栏，
  真实视口 ≥920px 才补中间两个，矮屏不放（否则与立绘重叠）。
  深色关掉装饰层，图案改为几何纹样。
- sakura：顶栏取页面底色、顶栏链接提到次要文字色、uk-alert-primary 改粉底。
- 主题注入补上 /user 后台与 /vote 投票页（跟随箱主/发布者的语言与配色）。
- StaticVersion → 20261019m

2026-10-19 20:37:28 +08:00

5.0 KiB

Raw Blame History

主题「砂狼白子」（shiroko）

阿拜多斯学园风格的灰蓝／银白配色，附带 Q 版人物插画。启用方式：

[theme]
available = default,sakura,shiroko

箱主在「账号设置 → 主题外观」里选择即可。作用范围与其他主题一致：提问箱页面、本人投票页、/user 后台。

配色

令牌	浅色	深色
`--tb-bg` / `--tb-navbar`	`#edf2f8`	`#141a22`
`--tb-surface`	`#ffffff`	`#1d2530`
`--tb-surface-2`	`#e5ecf5`	`#273140`
`--tb-border`	`#d6e0ec`	`#334052`
`--tb-text`	`#222d3b`	`#e3eaf4`
`--tb-primary`	`#4a7fc1`	`#6fa3e0`

插画布置

位置	内容	尺寸
右下角	用户提供的立绘（16% 透明，作背景水印）	`auto 520px`
左下角	`doze`（站着打瞌睡）	`auto 240px`
左上角	`wave`（挥手）	`auto 172px`
右上角	`cheer`（双手欢呼）	`auto 160px`
右中	`think`（托腮）	`auto 126px`
整页平铺	雪花 + 光环 + 圆环 + 点簇（320px 一铺）	`pattern.svg`
≤640px	只保留立绘 + `doze`，尺寸减半	`@media`

插画走 装饰层（--tb-deco / --tb-deco-size / --tb-deco-position），不是整页背景图：

固定像素尺寸 + 四角定位，任何视口比例都不会被裁切（cover 做不到，竖屏桌面会把贴边的插画切掉）；
固定 6 个槽位，必须写满 6 个值，缺的填 none —— 多背景各列表的层数必须恒定（1 图案 + 6 装饰 + 1 背景 = 8），值一多一少，分层就整体错位（会出现整页重复小人）；
深色模式关掉装饰层，只留底色与浅色图案。人物是银白／浅灰为主，压到深色底上会发灰发脏。

素材清单

位于 static/images/themes/shiroko/，已随二进制嵌入（static/fs.go 的 images/themes）。

文件	用途	尺寸	体积
`chibi/wave.webp`	挥手	324×620	27KB
`chibi/cheer.webp`	双手欢呼	354×620	27KB
`chibi/think.webp`	托腮	283×620	26KB
`chibi/doze.webp`	打瞌睡	274×620	26KB
`hero-fade.webp`	用户立绘，预乘 16% 透明度	275×620	18KB
`pattern.svg`	浅色平铺（几何纹样）	240×240	0.9KB
`pattern-dark.svg`	深色平铺	240×240	0.8KB

来源与授权

素材	来源
`static/images/shiroko-cutout.png` → `hero-fade.webp`	用户自行用 AI 生成的立绘，裁边后降透明度
`chibi/*.webp`	WorkBuddy ImageGen 以用户立绘为参考图（image-to-image）生成，再抠白底
`pattern.svg` / `pattern-dark.svg`	手写 SVG，纯几何，无外部素材

生成与抠图参数

参考图：static/images/shiroko-cutout.png，input_fidelity: high，保证角色造型与平涂风格一致；
提示词骨架（四个姿态共用，只改动作句）：

Same character, same art style as the reference image: flat vector illustration, no outlines, simple shapes, soft pastel colors, minimal detail. A chibi anime girl with short fluffy silver-grey bob hair, pointed grey wolf ears, a small tilted cyan halo ring above her head, pale blue dot eyes, cyan scarf, dark navy blazer, light grey pleated skirt, cyan and black sneakers. { 动作 } Plain pure white background (#FFFFFF), no shadow, no ground, no text, no watermark.
动作句：Standing full body, front view, one arm raised waving hello with a small smile / both arms raised up cheering happily, big smile / one hand resting on her cheek thinking, head slightly tilted / eyes closed sleeping peacefully, head drooping slightly to one side；
抠图：从四角 + 四边中点共 8 点做 floodfill（容差 16），再对 alpha 做 1px MinFilter 收边去白边，裁 bbox 后统一缩放到高 620、WebP q90。

关键经验：必须是"平涂无描边"。先试过用手写 SVG 线稿，风格和用户那张立绘（色块、无描边）冲突，而且没有真人手感会画得很抽象；用参考图 + image-to-image 出来的四张，角色特征和画风都稳。

版权说明：砂狼白子（砂狼シロコ）是《蔚蓝档案》的角色，版权归 NEXON Games / Yostar。本主题为非商用同人装饰，仅作个人站点外观使用；若站点转为商业用途，请自行取得授权或换成原创素材。

替换 / 扩素材

加姿态：按上面的提示词骨架换动作句生成，白底 → 抠图 → 存 chibi/<name>.webp（高 620），再塞进 shiroko.css 的 --tb-deco（记得保持 6 个值）。
换立绘：透明 PNG 覆盖 static/images/shiroko-cutout.png，按 620 高、alpha 16% 重新导出 hero-fade.webp。
换配色：改 shiroko.css 的令牌即可，插画是位图，换色需重新生成。
新增素材不需要改 static/fs.go（已嵌整个 images/themes 目录）；但改了 CSS 必须把 conf.StaticVersion +1，否则老访客吃缓存看不到变化。

5.0 KiB Raw Blame History Unescape Escape