horoli/ssessesse-ki-battle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Keep emote menu clear of mobile action controls

Browse Source
This commit is contained in:
horoli
2026-10-15 00:03:19 +09:00
parent 493af700aa
commit 05bc16e364
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/client/match.css
+3 -3
View File
@@ -1,11 +1,11 @@
/* Match layout only; character poses, projectiles and finish cutscenes stay in game.css. */ /* Match layout only; character poses, projectiles and finish cutscenes stay in game.css. */
.emote-menu { position: absolute; z-index: 8; left: var(--edge); bottom: 130px; } .emote-menu { position: absolute; z-index: 16; right: var(--edge); top: calc(110px + env(safe-area-inset-top)); }
.emote-menu summary { cursor: pointer; padding: 8px 12px; border: 1px solid #56615a; background: #fffdf1; color: #232a2c; } .emote-menu summary { cursor: pointer; padding: 8px 12px; border: 1px solid #56615a; background: #fffdf1; color: #232a2c; }
.emote-menu > div { position: absolute; bottom: 100%; display: grid; grid-template-columns: repeat(2, 64px); gap: 4px; padding: 6px; background: #fffdf1; border: 1px solid #56615a; } .emote-menu > div { position: absolute; top: 100%; right: 0; display: grid; grid-template-columns: repeat(2, 64px); gap: 4px; padding: 6px; background: #fffdf1; border: 1px solid #56615a; }
.emote-menu button { padding: 10px 6px; min-height: 44px; } .emote-menu button { padding: 10px 6px; min-height: 44px; }
.emote-bubble { position: absolute; z-index: 7; top: -28px; left: 50%; transform: translateX(-50%); width: max-content; max-width: min(180px, 39vw); padding: 9px 12px; border: 2px solid #36433b; border-radius: 14px; background: #fffdf1; color: #232a2c; font-size: clamp(12px, 2vw, 17px); text-align: center; overflow-wrap: anywhere; pointer-events: none; } .emote-bubble { position: absolute; z-index: 7; top: -28px; left: 50%; transform: translateX(-50%); width: max-content; max-width: min(180px, 39vw); padding: 9px 12px; border: 2px solid #36433b; border-radius: 14px; background: #fffdf1; color: #232a2c; font-size: clamp(12px, 2vw, 17px); text-align: center; overflow-wrap: anywhere; pointer-events: none; }
.emote-bubble::after { content: ''; position: absolute; top: 100%; left: 50%; border: 7px solid transparent; border-top-color: #36433b; } .emote-bubble::after { content: ''; position: absolute; top: 100%; left: 50%; border: 7px solid transparent; border-top-color: #36433b; }
@media (max-height: 500px) { .emote-menu { bottom: 95px; } } @media (max-height: 500px) { .emote-menu { top: 66px; } }
body:is([data-screen=match], [data-screen=result]) { body:is([data-screen=match], [data-screen=result]) {
overflow: hidden; overflow: hidden;
background: #d9ddd4; background: #d9ddd4;