theme(shiroko): 装饰改为「半隐在卡片后」的单人 + 接触阴影
按选定方向收敛: - 只留 sit 一个角色,左移 515px 让右侧约 40px 钻进卡片底下(卡片定宽 750 居中, 左沿 = 50% - 375px),被卡片挡掉一部分才有空间关系,不再浮在留白中间; - 离底边 26px(脚踩最后一像素像被裁掉),配一层椭圆径向渐变当接触阴影,避免悬空; - 纹样透明度 0.13 → 0.085(深色 0.09 → 0.055),图案 url 补 ?v=; - 收掉另外三个人物与第一层半透明立绘; - StaticVersion → 20261019p
This commit is contained in:
+17
-8
@@ -24,13 +24,20 @@ available = default,sakura,shiroko
|
||||
|
||||
| 位置 | 内容 | 尺寸 |
|
||||
| --- | --- | --- |
|
||||
| 右下角 | 用户提供的立绘(16% 透明,作背景水印) | `auto 520px` |
|
||||
| 左下角 | `doze`(站着打瞌睡) | `auto 240px` |
|
||||
| 左上角 | `wave`(挥手) | `auto 172px` |
|
||||
| 右上角 | `cheer`(双手欢呼) | `auto 160px` |
|
||||
| 右中 | `think`(托腮) | `auto 126px` |
|
||||
| 整页平铺 | 雪花 + 光环 + 圆环 + 点簇(320px 一铺) | `pattern.svg` |
|
||||
| ≤640px | 只保留立绘 + `doze`,尺寸减半 | `@media` |
|
||||
| 卡片左下外侧 | `sit`(盘腿坐),右侧约 40px 钻进卡片底下 | `auto 340px`,≤1179px 时 `280px` |
|
||||
| 人物脚下 | 椭圆接触阴影(CSS `radial-gradient`,不是图片) | `128px 15px` |
|
||||
| 整页平铺 | 雪花 ×2 + 光环 + 两点(340px 一铺,opacity 0.085) | `pattern.svg` |
|
||||
| ≤900px | 不出人物 —— 卡片占满宽度,两侧没有视觉空间 | `@media` |
|
||||
|
||||
摆位为什么是这个人样:
|
||||
|
||||
- **不要四角各摆一个**。人物之间、人物与内容之间都没有关系,读起来就是贴纸墙纸;
|
||||
- **右下角不能放人**。页脚文案右对齐(社区规则 / 备案号 / 存活时长),人物会和它挤在一起;
|
||||
- **要半隐在卡片后面**。被卡片挡掉一部分才有空间关系,否则就是浮在留白中间;
|
||||
卡片定宽 750px 居中,左沿 = `50% - 375px`,人物宽约 177px,左移 515px 即遮住 40px;
|
||||
- **离底边留 26px**。脚踩在窗口最后一行像素上会被读成"被裁掉",抬高之后必须配接触阴影,
|
||||
否则变成悬空。
|
||||
- **纹样元素要均布**。全挤在 tile 上半部时,铺开后在整页形成明显的横向条纹带。
|
||||
|
||||
插画走 **装饰层**(`--tb-deco` / `--tb-deco-size` / `--tb-deco-position`),不是整页背景图:
|
||||
|
||||
@@ -38,6 +45,8 @@ available = default,sakura,shiroko
|
||||
- 固定 6 个槽位,必须写满 6 个值,缺的填 `none` —— 多背景各列表的层数必须恒定
|
||||
(1 图案 + 6 装饰 + 1 背景 = 8),值一多一少,分层就整体错位(会出现整页重复小人);
|
||||
- 深色模式关掉装饰层,只留底色与浅色图案。人物是银白/浅灰为主,压到深色底上会发灰发脏。
|
||||
- 图案是图片,不走 `StaticVersion` 缓存键(`Cache-Control: max-age=86400`):
|
||||
换 `pattern*.svg` 时要自己给 css 里的 url 补一个 `?v=`,否则老访客最多 24 小时看到旧纹样。
|
||||
|
||||
## 素材清单
|
||||
|
||||
@@ -88,7 +97,7 @@ available = default,sakura,shiroko
|
||||
## 替换 / 扩素材
|
||||
|
||||
1. 加姿态:按上面的提示词骨架换动作句生成,白底 → 抠图 → 存 `chibi/<name>.webp`(高 620),
|
||||
再塞进 `shiroko.css` 的 `--tb-deco`(记得保持 6 个值)。
|
||||
再塞进 `shiroko.css` 的 `--tb-deco`(记得保持 6 个值,并按上面的摆位原则定位)。
|
||||
2. 换立绘:透明 PNG 覆盖 `static/images/shiroko-cutout.png`,再按同一提示词骨架重新生成姿态。
|
||||
3. 换配色:改 `shiroko.css` 的令牌即可,插画是位图,换色需重新生成。
|
||||
4. 新增素材不需要改 `static/fs.go`(已嵌整个 `images/themes` 目录);但改了 CSS 必须把
|
||||
|
||||
Reference in New Issue
Block a user