fix: 토너먼트 참가 즉시 조편성과 화면 여백을 수정

수동 참가자를 비포화 예선 조에 즉시 배치하고 자동 참가 설정을 건드리던 잘못된 부작용을 제거한다. 자동 참가 장수와 NPC의 8x8 조 편입을 회귀 테스트로 고정한다. 장수 아이콘 아래 배당이 잘리지 않도록 대진 높이를 늘리고 갱신·참가·닫기 버튼의 클릭 영역을 확대한다.
This commit is contained in:
2026-08-17 10:48:52 +00:00
parent a80d58f761
commit 2fdc81369f
8 changed files with 261 additions and 60 deletions
@@ -28,8 +28,10 @@ const roundColumns = computed(() => [
]);
const desktopX = [110, 355, 600, 845, 1090];
const cardWidth = 190;
const desktopSlotHeight = 88;
const desktopCanvasHeight = desktopSlotHeight * 16;
const slotY = (columnIndex: number, slotIndex: number) => {
const slotHeight = 72 * 2 ** columnIndex;
const slotHeight = desktopSlotHeight * 2 ** columnIndex;
return slotHeight / 2 + slotIndex * slotHeight;
};
const connections = computed(() =>
@@ -77,8 +79,8 @@ const mobilePairs = computed(() => {
<div class="desktop-round-labels" aria-hidden="true">
<strong v-for="label in roundLabels" :key="label">{{ label }}</strong>
</div>
<div class="desktop-bracket-canvas">
<svg viewBox="0 0 1200 1152" aria-hidden="true">
<div class="desktop-bracket-canvas" :style="{ height: `${desktopCanvasHeight}px` }">
<svg :viewBox="`0 0 1200 ${desktopCanvasHeight}`" aria-hidden="true">
<g v-for="connection in connections" :key="connection.id">
<path
class="bracket-connector"
@@ -177,7 +179,6 @@ const mobilePairs = computed(() => {
.desktop-bracket-canvas {
position: relative;
width: 100%;
height: 1152px;
}
.desktop-bracket-canvas svg {
position: absolute;
@@ -200,7 +201,7 @@ const mobilePairs = computed(() => {
display: grid;
box-sizing: border-box;
width: clamp(140px, 16vw, 190px);
min-height: 68px;
min-height: 82px;
align-items: center;
overflow: hidden;
transform: translate(-50%, -50%);
@@ -265,7 +266,7 @@ const mobilePairs = computed(() => {
.mobile-bracket-name {
box-sizing: border-box;
min-width: 0;
min-height: 68px;
min-height: 82px;
overflow: hidden;
border: 1px solid #555;
background: rgb(58 33 24 / 94%);
+11 -5
View File
@@ -304,16 +304,16 @@ const placeBet = async (targetId: number) => {
background: #142b42 var(--sammo-texture-blue);
}
.title {
height: 55.6875px;
min-height: 68px;
padding: 0;
font-size: 14px;
line-height: 19.1875px;
}
.close-button {
display: block;
width: 62px;
height: 35.5px;
padding: 8px 12px;
width: 88px;
height: 44px;
padding: 10px 16px;
border: 1px solid #375a7f;
border-radius: 5.25px;
background: #375a7f;
@@ -323,10 +323,16 @@ const placeBet = async (targetId: number) => {
text-decoration: none;
}
.toolbar {
min-height: 36.5px;
min-height: 46px;
padding: 1px;
text-align: left;
}
.toolbar button {
min-width: 72px;
height: 44px;
padding: 10px 16px;
font-size: 14px;
}
.error {
min-height: 32px;
padding: 5px;
+11 -5
View File
@@ -385,16 +385,16 @@ const start = async () => {
background: #142b42 var(--sammo-texture-blue);
}
.legacy-title {
height: 55.6875px;
min-height: 68px;
padding: 0;
font-size: 14px;
line-height: 19.1875px;
}
.close-button {
display: block;
width: 62px;
height: 35.5px;
padding: 8px 12px;
width: 88px;
height: 44px;
padding: 10px 16px;
border: 1px solid #375a7f;
border-radius: 5.25px;
background: #375a7f;
@@ -404,9 +404,15 @@ const start = async () => {
text-decoration: none;
}
.toolbar {
min-height: 36.5px;
min-height: 46px;
padding: 1px;
}
.toolbar button {
min-width: 72px;
height: 44px;
padding: 10px 16px;
font-size: 14px;
}
.operator-row,
.state-row,
.error-row,