rogerwang2008
319ba1890a
- 新增 page3.html：无「天」背景的演职员表与火山场景 - 重构为页面专属 CSS/JS 与共用的 text-scene 渲染引擎 - PDF 导出支持 --page 参数
53 lines
1.7 KiB
CSS
53 lines
1.7 KiB
CSS
/* 第 1 页：天空、云、落日、飞鸟、天线与楼群配色 */
|
|
|
|
/* —— 背景：空白格里的淡色「天」 —— */
|
|
.sky { color: rgba(190, 200, 240, 0.15); }
|
|
|
|
/* —— 云：固定颜色，明度取太阳与黑底之间的一半，色相沿用晚霞色 —— */
|
|
.cloud { color: color-mix(in srgb, var(--cloud, #ff9ebb) 35%, #000); }
|
|
.cloud-pink { --cloud: #ff9ebb; }
|
|
.cloud-violet { --cloud: #b98cff; }
|
|
.cloud-orange { --cloud: #ffa95c; }
|
|
.cloud-rose { --cloud: #ff85b3; }
|
|
.cloud-lilac { --cloud: #c98cff; }
|
|
|
|
/* —— 落日：太阳逐行色调，t1 顶部偏红 → t17 底部偏黄 —— */
|
|
.sun { color: color-mix(in srgb, var(--tone, #ff5a36) 80%, #000); }
|
|
.sun-t1 { --tone: #ff5a36; }
|
|
.sun-t2 { --tone: #ff5a36; }
|
|
.sun-t3 { --tone: #ff6533; }
|
|
.sun-t4 { --tone: #ff7330; }
|
|
.sun-t5 { --tone: #ff812d; }
|
|
.sun-t6 { --tone: #ff8f2b; }
|
|
.sun-t7 { --tone: #ff9d29; }
|
|
.sun-t8 { --tone: #ffaa2a; }
|
|
.sun-t9 { --tone: #ffb62d; }
|
|
.sun-t10 { --tone: #ffc132; }
|
|
.sun-t11 { --tone: #ffcb38; }
|
|
.sun-t12 { --tone: #ffd33f; }
|
|
.sun-t13 { --tone: #ffda46; }
|
|
.sun-t14 { --tone: #ffe04e; }
|
|
.sun-t15 { --tone: #ffe556; }
|
|
.sun-t16 { --tone: #ffe95e; }
|
|
.sun-t17 { --tone: #ffec66; }
|
|
|
|
/* —— 飞鸟 —— */
|
|
.bird-sparrow { color: #c96b45; }
|
|
.bird-magpie { color: #7893bd; }
|
|
.bird-crow { color: #9f98bb; }
|
|
|
|
/* —— 天线 —— */
|
|
.ant { color: #8a8a9e; }
|
|
.ant-dark { color: #5d5d6b; }
|
|
|
|
/* —— 楼群：灰色系，明度与原棕色一致 —— */
|
|
.bld { color: #3f3f3f; }
|
|
.bld-1 { color: #3b3b3b; }
|
|
.bld-2 { color: #343434; }
|
|
.bld-3 { color: #464646; }
|
|
.bld-4 { color: #393939; }
|
|
.bld-5 { color: #4e4e4e; }
|
|
.bld-6 { color: #414141; }
|
|
.bld-7 { color: #494949; }
|
|
.bld-8 { color: #353535; }
|