toshiocn/HexTrails
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add production campaigns, gameplay labs, and review documentation

Browse Source
This commit is contained in:
cabinw
2026-09-13 12:27:10 +08:00
parent d1dffa9338
commit 4644e975b0
214 changed files with 98994 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files
design/game-tools.css
+60
View File
@@ -0,0 +1,60 @@
/* Flat gameplay items: solid fills, no shadows, bevels or highlights. */
.game-tool{--item-color:#7198D0;--item-edge:#FFFFFFB8;--item-radius:50%;--item-border:2px solid var(--item-edge);--item-size:64px}
.game-tool[data-tool=restart]{--item-color:#A28ACC;}
.game-tool[data-tool=hint]{--item-color:#EABB55;}
:is(.phone .phone-tools,body:not(.editing) .board-tools,.item-samples,.guide-tools) .game-tool{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:80px;min-height:96px;margin:0;padding:4px 0;background:none;color:inherit;border:0;box-shadow:none;border-radius:18px;line-height:1.2}
:is(.phone .phone-tools,body:not(.editing) .board-tools,.item-samples,.guide-tools) .game-tool>.item-face{position:relative;isolation:isolate;display:grid;place-items:center;width:var(--item-size);height:var(--item-size);padding:16px;flex:none;border:0;border-radius:var(--item-radius);background:none;filter:none;overflow:visible}
.game-tool .item-face::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;border:var(--item-border);background:var(--item-color);box-shadow:none}
.game-tool .item-face>.ui-plate{display:none!important}
body:not(.editing) .game-tool .item-face>.ui-icon,.game-tool .item-face>.icon{width:32px;height:32px;margin:0;filter:var(--item-icon-filter,none)}
.game-tool[data-tool=hint]{--item-icon-filter:brightness(0) saturate(100%) invert(25%) sepia(20%) saturate(1391%) hue-rotate(357deg) brightness(93%) contrast(90%)}
:is(.phone .phone-tools,body:not(.editing) .board-tools,.item-samples,.guide-tools) .game-tool>b{font-size:13px;font-weight:650;letter-spacing:.04em;line-height:1.3}
:is(.phone .phone-tools,body:not(.editing) .board-tools) .game-tool:disabled{opacity:.5;cursor:default}
.game-tool .item-face>.item-glyph{width:32px;height:32px}.game-tool .item-face>.art-icon{filter:var(--item-icon-filter,none)}
body[data-design=vivid] .game-tool{--item-color:#00BEEA;--item-border:3px solid #30264C;--item-radius:50%}
body[data-design=vivid] .game-tool[data-tool=restart]{--item-color:#F62A83;}
body[data-design=vivid] .game-tool[data-tool=hint]{--item-color:#FFCE19;}
body[data-design=toy] .game-tool{--item-color:#187DCE;--item-border:3px solid #FFF5D9;--item-radius:24px}
body[data-design=toy] .game-tool[data-tool=restart]{--item-color:#E8523D;}
body[data-design=toy] .game-tool[data-tool=hint]{--item-color:#F5C637;}
body[data-design=animals] .game-tool{--item-color:#79945B;--item-border:3px solid #FFF9DE;--item-radius:44% 44% 36% 36%}
body[data-design=animals] .game-tool[data-tool=restart]{--item-color:#C1804C;}
body[data-design=animals] .game-tool[data-tool=hint]{--item-color:#D4B647;}
body[data-design=animals] .game-tool .item-face::after{content:'';position:absolute;top:7px;left:17px;right:17px;height:4px;border-radius:50%;border-top:2px dotted #FFFFFF95;pointer-events:none}
/* Reserve real rows for rotations and items so the canvas is truly centered
between the notification area and controls, including on short screens. */
body:not(.editing) .game-card{grid-template-rows:minmax(0,1fr) 76px 108px}
body:not(.editing) .rotation-controls{position:static;grid-row:2;grid-column:1/-1;display:flex;align-items:center;justify-content:space-around;padding:0 20px;gap:32px;pointer-events:auto}
body:not(.editing) .rotation-controls .rotate-button{min-height:68px;padding:0;gap:4px}
body:not(.editing) .rotate-button>.ui-icon{width:48px;height:48px}
body:not(.editing) .board-tools>.game-tool{grid-row:3;justify-self:center;width:100%}
.phone{grid-template-rows:44px 40px 64px minmax(0,1fr) 76px 108px}
.phone .rotations{position:static;grid-row:5;grid-column:1/-1;display:flex;align-items:center;justify-content:space-around;margin:0;padding:0 12px;gap:32px;pointer-events:auto}
.phone .rotations button{min-height:68px;padding:0;gap:4px}
.phone .rotations button>span{width:48px;height:48px}
.phone .phone-tools>.game-tool{grid-row:6;justify-self:center;width:100%}
@media(min-width:600px){.game-tool{--item-size:68px}body:not(.editing) .game-card{grid-template-rows:minmax(0,1fr) 80px 116px}.phone{grid-template-rows:44px 40px 64px minmax(0,1fr) 80px 116px}}
@media(max-height:600px){
.phone .game-tool,body:not(.editing) .game-tool{--item-size:56px}
body:not(.editing) .game-card{grid-template-rows:minmax(0,1fr) 62px 88px}
.phone{grid-template-rows:44px 40px 64px minmax(0,1fr) 62px 88px}
body:not(.editing) .rotation-controls .rotate-button,.phone .rotations button{min-height:58px}
body:not(.editing) .rotate-button>.ui-icon,.phone .rotations button>span{width:40px;height:40px}
:is(.phone .phone-tools,body:not(.editing) .board-tools) .game-tool{min-height:84px;gap:10px}
:is(.phone .phone-tools,body:not(.editing) .board-tools) .game-tool>.item-face{padding:12px}
}
/* Future inventory examples are documentation only; gameplay has no badges. */
.item-samples,.guide-tools{display:flex;justify-content:space-evenly;align-items:center;gap:16px;padding:16px 0 10px;text-align:center;color:var(--scene-ink,var(--ink,#273B50))}
.item-badge{position:absolute;right:-7px;top:-5px;z-index:2;display:grid;place-items:center;min-width:27px;height:27px;padding:0 7px;border:2px solid #FFFCF5;border-radius:14px;background:#334B60;color:white;font:750 12px/1 system-ui,sans-serif;box-shadow:none}
.item-badge.ad{right:-12px;min-width:42px;background:#5C478C;gap:3px;display:flex;align-items:center;justify-content:center;font-size:10px}
.item-badge.ad::before{content:'▶';font-size:8px}
.item-future{margin-top:28px;border-top:1px solid #273B5020;padding-top:24px}
.item-future h3{font-size:18px;margin:8px 0}.item-future p{font-size:12px;color:#56687A}
.item-future .item-samples{border-radius:20px;background:#E9EDE5;padding:22px 8px 16px;color:#273B50}
.item-spec{font-size:12px;line-height:1.9;color:#56687A}
.item-study{padding:44px 0;border-bottom:1px solid #273B5020;scroll-margin-top:80px}
.item-study-content{max-width:640px;margin:auto}.item-study-content>.item-samples{background:var(--scene-bg,#E9EDE5);border-radius:24px;padding:24px 12px 18px}
@media(max-width:380px){.item-samples,.guide-tools{gap:4px}.component-preview{padding:16px}.game-tool{min-width:72px}}