pages235/src/react/MobileTopButtons.module.css
Vitaly 379484327e
refactor: Rework mobile controls! (#260)
Separate movement and interaction touch controls
Add new options for touch control types (modern/classic)
Refactor touch interaction handling and event management
Create a new GameInteractionOverlay component for touch interactions for less bugs in future
Update touch controls UI and positioning logic

Co-authored-by: qodo-merge-pro-for-open-source[bot] <189517486+qodo-merge-pro-for-open-source[bot]@users.noreply.github.com>
2025-02-01 02:51:56 +03:00

37 lines
853 B
CSS

.mobile-top-btns {
display: none;
flex-direction: row;
position: fixed;
top: 0;
left: 50%;
transform: translate(-50%);
gap: 0 5px;
z-index: var(--has-modals-z, 7);
}
.pause-btn,
.chat-btn {
--scale: 1.3;
border: none;
outline: 0.5px solid white;
width: calc(14px * var(--scale));
height: calc(14px * var(--scale));
background-image: url('../../assets/gui.png');
background-size: calc(256px * var(--scale));
background-position-x: calc(var(--scale) * -202px);
background-position-y: calc(var(--scale) * -66px);
}
.chat-btn {
background-position-y: calc(var(--scale) * -84px);
}
.debug-btn {
background: #9c8c86;
font-size: 8px;
/* todo make other buttons centered */
/* margin-right: 5px; */
color: white;
font-family: minecraft, mojangles, monospace;
padding: 4px 6px;
outline: 0.5px solid white;
}