机库战机卡改为单行横向滚动(#ship-pick nowrap+overflow-x,mode/rush 不受影响),标题加'左右滑动'提示

This commit is contained in:
JOJO 2026-08-06 15:18:11 +08:00
parent de33f67343
commit bb0d7e5704
2 changed files with 9 additions and 1 deletions

View File

@ -52,6 +52,14 @@ h1.logo{font-size:clamp(20px,5.4vw,44px);color:#fff;letter-spacing:4px;line-heig
.stat-grid b{color:var(--gold);text-align:right}
/* ship / mode select cards */
.pick{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
/* 机库5 战机单行横向滚动(仅 ship-pickmode/rush 保持换行居中) */
#ship-pick{flex-wrap:nowrap;justify-content:flex-start;width:100%;overflow-x:auto;overscroll-behavior-x:contain;
-webkit-overflow-scrolling:touch;padding:2px 2px 8px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
#ship-pick .pcard{flex:0 0 auto}
#ship-pick::-webkit-scrollbar{height:6px}
#ship-pick::-webkit-scrollbar-track{background:transparent}
#ship-pick::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
#ship-pick::-webkit-scrollbar-thumb:hover{background:var(--cyan)}
.rush-grp{width:100%;margin:2px 0 10px}
.rush-grp .h3{font-size:clamp(9px,1.6vw,12px);letter-spacing:3px;margin-bottom:5px}
.rush-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}

View File

@ -119,7 +119,7 @@
<div class="ovl hide" id="o-hangar">
<div class="h2">— 机库 · 强化 —</div>
<div class="wallet">星币 ✦ <span id="wallet">0</span></div>
<div class="h3">机体(选择 / 解锁)</div>
<div class="h3">机体(选择 / 解锁)· 左右滑动</div>
<div class="pick" id="ship-pick"></div>
<div class="h3">永久强化</div>
<div class="shop" id="shop" style="overflow-y:auto;max-height:42%"></div>