This commit is contained in:
zhx 2026-06-11 21:09:09 +08:00
parent 3f95e6b697
commit d4e41b1423
2 changed files with 23 additions and 9 deletions

View File

@ -37,7 +37,7 @@
body { body {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
justify-content: flex-start; justify-content: center;
} }
button { button {
@ -54,6 +54,12 @@
--game-screen-scale: var(--game-scale); --game-screen-scale: var(--game-scale);
} }
.game-stage {
width: 100%;
max-width: 768px;
margin: 0 auto;
}
.rps-bg { .rps-bg {
position: absolute; position: absolute;
top: -145px; top: -145px;
@ -1593,6 +1599,7 @@
(function () { (function () {
var DESIGN_WIDTH = 375; var DESIGN_WIDTH = 375;
var DESIGN_HEIGHT = 812; var DESIGN_HEIGHT = 812;
var MAX_STAGE_WIDTH = 768;
var GAME_ID = 'rock'; var GAME_ID = 'rock';
var GAME_CODE = 'game_rock'; var GAME_CODE = 'game_rock';
var root = document.documentElement; var root = document.documentElement;
@ -1657,10 +1664,12 @@
} }
function updateScale() { function updateScale() {
var scale = Math.min( // 游戏区域宽度始终吃满可用宽度,但最多放大到 768px缩放只跟最终宽度走避免大屏时被高度压窄后露出右侧空条。
window.innerWidth / DESIGN_WIDTH, var viewportWidth = Math.min(
window.innerHeight / DESIGN_HEIGHT window.innerWidth,
MAX_STAGE_WIDTH
); );
var scale = viewportWidth / DESIGN_WIDTH;
root.style.setProperty( root.style.setProperty(
'--game-scale', '--game-scale',
String(Math.max(scale, 0.1)) String(Math.max(scale, 0.1))

View File

@ -41,7 +41,7 @@
body { body {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
justify-content: flex-start; justify-content: center;
} }
button { button {
@ -56,8 +56,10 @@
.dice-stage { .dice-stage {
position: relative; position: relative;
width: calc(var(--dice-frame-width) * var(--dice-scale)); width: 100%;
max-width: 768px;
height: calc(var(--dice-frame-height) * var(--dice-scale)); height: calc(var(--dice-frame-height) * var(--dice-scale));
margin: 0 auto;
overflow: hidden; overflow: hidden;
background: #030623; background: #030623;
} }
@ -2503,6 +2505,7 @@
(function () { (function () {
var DESIGN_WIDTH = 375; var DESIGN_WIDTH = 375;
var DESIGN_HEIGHT = 812; var DESIGN_HEIGHT = 812;
var MAX_STAGE_WIDTH = 768;
var SETTLEMENT_AUTO_CLOSE_MS = 30000; var SETTLEMENT_AUTO_CLOSE_MS = 30000;
var DICE_ROLL_EFFECT_URL = 'assets/figma/dice-roll.svga'; var DICE_ROLL_EFFECT_URL = 'assets/figma/dice-roll.svga';
var root = document.documentElement; var root = document.documentElement;
@ -2552,10 +2555,12 @@
} }
function updateScale() { function updateScale() {
var scale = Math.min( // 游戏区域宽度始终吃满可用宽度,但最多放大到 768px缩放只跟最终宽度走避免大屏时被高度压窄后露出右侧空条。
window.innerWidth / DESIGN_WIDTH, var viewportWidth = Math.min(
window.innerHeight / DESIGN_HEIGHT window.innerWidth,
MAX_STAGE_WIDTH
); );
var scale = viewportWidth / DESIGN_WIDTH;
root.style.setProperty( root.style.setProperty(
'--dice-scale', '--dice-scale',
String(Math.max(scale, 0.1)) String(Math.max(scale, 0.1))