minigame 4add more design 1.1

This commit is contained in:
2026-05-04 18:59:16 +00:00
parent 36a7a154e2
commit e012f87052
2 changed files with 80 additions and 13 deletions
+20 -12
View File
@@ -14640,7 +14640,10 @@
if (root) {
root.classList.toggle('is-hidden', !on);
root.setAttribute('aria-hidden', on ? 'false' : 'true');
if (!on) root.classList.remove('play-cyber-hud--question-mission');
if (!on) {
root.classList.remove('play-cyber-hud--question-mission');
root.classList.remove('play-cyber-hud--score-flush-left');
}
}
if (stackEl) stackEl.classList.toggle('play-cyber-vignette', !!on);
const gw = document.querySelector('.game-wrap');
@@ -14654,7 +14657,12 @@
'play-cyber-hud--stack-tower-canvas-hud',
!!(previewFillBots && stackMini && isStack() && isStackTowerMissionUiMapPlay()),
);
root.classList.toggle('play-cyber-hud--gauntlet-crown-strip', !!(on && isGauntletCrownHeistMapPlay()));
/** แถบ SCORE แนวนอน (mno9kb07) — ใช้รูปแบบเดียวกับ quiz_carry / พรีวิว editor */
root.classList.toggle(
'play-cyber-hud--gauntlet-crown-strip',
!!(on && (isGauntletCrownHeistMapPlay() || isQuizCarry())),
);
root.classList.toggle('play-cyber-hud--score-flush-left', !!(on && isQuizCarry()));
const timeLabelEl = root.querySelector('.play-cyber-time-label');
if (timeLabelEl) timeLabelEl.style.display = isQuizCarry() ? 'none' : '';
const timeVal = document.getElementById('play-cyber-time-val');
@@ -14877,15 +14885,15 @@
const ul = document.getElementById('play-cyber-score-list');
if (!ul) return;
const crownStripHud = isGauntletCrownHeistMapPlay();
const stripScoreHud = isGauntletCrownHeistMapPlay() || isQuizCarry();
const board = ul.closest('.play-cyber-scoreboard');
if (board) board.classList.toggle('play-cyber-scoreboard--crown-strip', !!crownStripHud);
ul.classList.toggle('play-cyber-score-list--crown-strip', !!crownStripHud);
if (board) board.classList.toggle('play-cyber-scoreboard--crown-strip', !!stripScoreHud);
ul.classList.toggle('play-cyber-score-list--crown-strip', !!stripScoreHud);
const panelTitle = root.querySelector('.play-cyber-panel-title');
const crownHead = document.getElementById('play-cyber-crown-score-head');
const crownImg = document.getElementById('play-cyber-crown-score-img');
if (panelTitle && crownHead && crownImg) {
if (crownStripHud) {
if (stripScoreHud) {
crownHead.classList.add('is-hidden');
crownHead.setAttribute('aria-hidden', 'true');
crownImg.removeAttribute('src');
@@ -14979,9 +14987,9 @@
});
ul.innerHTML = '';
const cap = crownStripHud ? 6 : 8;
const cap = stripScoreHud ? (isQuizCarry() ? 8 : 6) : 8;
let hudRows = rows.slice(0, Math.min(cap, rows.length));
if (crownStripHud) {
if (stripScoreHud) {
const mi = hudRows.findIndex((row) => row.isMe);
if (mi >= 0) {
const mine = hudRows.splice(mi, 1)[0];
@@ -14993,15 +15001,15 @@
const li = document.createElement('li');
li.className = 'play-cyber-score-row' + (row.isMe ? ' is-me' : '') + (row.eliminated ? ' is-out' : '')
+ (cyberQmMockHud ? ' play-cyber-score-row--qm-mock' : '')
+ (crownStripHud ? ' play-cyber-score-row--crown-strip' : '');
+ (stripScoreHud ? ' play-cyber-score-row--crown-strip' : '');
const av = document.createElement('img');
av.className = 'play-cyber-score-av' + (cyberQmMockHud ? ' play-cyber-score-av--qm' : '')
+ (crownStripHud ? ' play-cyber-score-av--crown-strip' : '');
+ (stripScoreHud ? ' play-cyber-score-av--crown-strip' : '');
av.alt = '';
setCyberHudScoreAvatarImg(av, row);
const sc = document.createElement('span');
sc.className = 'play-cyber-score-val' + (cyberQmMockHud ? ' play-cyber-qm-score' : '')
+ (crownStripHud ? ' play-cyber-crown-strip-val' : '');
+ (stripScoreHud ? ' play-cyber-crown-strip-val' : '');
if (isGauntlet() || isSpaceShooter() || isBalloonBoss() || isQuizCarry() || jumpMissionHud || quizMissionHud || stackMissionHud) {
sc.textContent = String(row.score);
} else {
@@ -15027,7 +15035,7 @@
qmLeft.appendChild(qmName);
li.appendChild(qmLeft);
li.appendChild(sc);
} else if (crownStripHud) {
} else if (stripScoreHud) {
const cell = document.createElement('div');
cell.className = 'play-cyber-crown-strip-cell';
const avWrap = document.createElement('div');
+60 -1
View File
@@ -1717,6 +1717,65 @@
padding-right: max(8px, env(safe-area-inset-right));
padding-bottom: max(6px, env(safe-area-inset-bottom));
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-scoreboard.play-cyber-scoreboard--crown-strip {
padding-left: 0;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-score-list.play-cyber-score-list--crown-strip {
padding-left: 0;
}
/* quiz_carry: TIME แถวบนเต็มจอ — SCORE ชิดโปรไฟล์ขวาบน (ไม่ใช้ grid ซ้าย | ขวา) */
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left {
padding-left: env(safe-area-inset-left, 0px);
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-end;
align-items: flex-start;
align-content: flex-start;
column-gap: 0.45rem;
row-gap: 0.35rem;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-center-stack {
grid-area: unset;
order: 1;
flex: 1 0 100%;
width: 100%;
max-width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-scoreboard.play-cyber-scoreboard--crown-strip {
grid-area: unset;
order: 2;
flex: 0 1 auto;
width: auto;
min-width: 0;
max-width: min(70vw, calc(100vw - 9rem));
margin-left: auto;
margin-right: 0;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-self {
grid-area: unset;
grid-row: unset;
order: 3;
flex: 0 0 auto;
justify-self: unset;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-time-block {
text-align: center;
max-width: 100%;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-time-head {
align-items: center;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-time-sub {
text-align: center;
max-width: min(92vw, 520px);
margin-left: auto;
margin-right: auto;
}
#play-cyber-hud.play-cyber-hud--gauntlet-crown-strip .play-cyber-center-stack {
grid-area: crownTime;
position: static;
@@ -2767,7 +2826,7 @@
</div>
<script src="/Game/socket.io/socket.io.js"></script>
<script src="js/version.js?v=0.0258"></script>
<script src="js/play.js?v=0.0261"></script>
<script src="js/play.js?v=0.0263"></script>
<div class="version-tag">v —</div>
</body>
</html>