refactor: 작은 글자 비율과 예외 크기를 공통 변수로 정리

This commit is contained in:
2026-09-15 16:09:32 +00:00
parent e094246963
commit 14b893d8a3
13 changed files with 71 additions and 45 deletions
@@ -346,7 +346,7 @@ small {
.hall-nation,
.hall-name {
font-size: 11px;
font-size: var(--sammo-font-size-hall-name);
}
.hall-name {
@@ -357,7 +357,7 @@ small {
}
.hall-name small {
font-size: 95%;
font-size: var(--sammo-font-size-hall-secondary);
}
.hall-value {
+17 -21
View File
@@ -287,10 +287,6 @@ small {
}
.betting-page {
--bet-font-title: var(--sammo-font-size-title);
--bet-font-large: var(--sammo-font-size-emphasis);
--bet-font-normal: var(--sammo-font-size-normal);
--bet-font-small: var(--sammo-font-size-small);
width: 100%;
max-width: 1200px;
min-width: 0;
@@ -298,7 +294,7 @@ small {
margin: 0 auto;
color: #fff;
font-family: var(--sammo-font-sans);
font-size: var(--bet-font-normal);
font-size: var(--sammo-font-size-normal);
line-height: 1.3;
text-align: center;
}
@@ -328,7 +324,7 @@ small {
--legacy-button-height: 44px;
min-width: 72px;
padding: 10px 16px;
font-size: var(--bet-font-normal);
font-size: var(--sammo-font-size-normal);
}
.error {
min-height: 32px;
@@ -338,7 +334,7 @@ small {
.state {
min-height: 42px;
padding: 5px;
font-size: var(--bet-font-title);
font-size: var(--sammo-font-size-title);
}
.state span {
color: cyan;
@@ -347,11 +343,11 @@ small {
min-height: 50px;
padding: 5px;
color: limegreen;
font-size: var(--bet-font-title);
font-size: var(--sammo-font-size-title);
}
.section-title small {
color: orange;
font-size: var(--bet-font-normal);
font-size: var(--sammo-font-size-normal);
}
select {
width: 100%;
@@ -413,7 +409,7 @@ select:disabled {
border-radius: 3px;
color: #fff;
background: #201610;
font-size: var(--bet-font-normal);
font-size: var(--sammo-font-size-normal);
}
.inline-bet .bracket-bet-button {
position: static;
@@ -427,7 +423,7 @@ select:disabled {
}
.bet-message {
grid-column: 1 / -1;
font-size: var(--bet-font-small);
font-size: var(--sammo-font-size-small);
line-height: 16px;
color: #b8e6ac;
overflow-wrap: anywhere;
@@ -439,7 +435,7 @@ select:disabled {
min-height: 50px;
padding: 8px;
color: yellow;
font-size: var(--bet-font-title);
font-size: var(--sammo-font-size-title);
}
.ranking-placeholder {
min-height: 40px;
@@ -457,7 +453,7 @@ select:disabled {
width: 100%;
border-collapse: collapse;
font-variant-numeric: tabular-nums;
font-size: var(--bet-font-small);
font-size: var(--sammo-font-size-small);
line-height: 14px;
}
.ranking-table th,
@@ -472,7 +468,7 @@ select:disabled {
.ranking-table thead tr:first-child th {
height: 18px;
background: #000;
font-size: var(--bet-font-large);
font-size: var(--sammo-font-size-emphasis);
line-height: 18px;
font-weight: normal;
}
@@ -503,14 +499,14 @@ select:disabled {
@media (max-width: 800px) {
.betting-page {
max-width: 100%;
font-size: var(--bet-font-normal);
font-size: var(--sammo-font-size-normal);
}
.state {
font-size: var(--bet-font-large);
font-size: var(--sammo-font-size-emphasis);
}
.section-title,
.ranking-title {
font-size: var(--bet-font-title);
font-size: var(--sammo-font-size-title);
}
.ranking-placeholder {
display: none;
@@ -538,7 +534,7 @@ select:disabled {
.ranking-table {
display: none;
min-width: 390px;
font-size: var(--bet-font-small);
font-size: var(--sammo-font-size-small);
}
.ranking-table.mobile-active {
display: table;
@@ -557,7 +553,7 @@ select:disabled {
}
}
.betting-page small {
font-size: var(--bet-font-small);
font-size: var(--sammo-font-size-small);
}
.bet-preset {
position: relative;
@@ -587,9 +583,9 @@ select:disabled {
display: none;
}
.betting-page :deep(.tournament-page-title) {
font-size: var(--bet-font-large);
font-size: var(--sammo-font-size-emphasis);
}
.betting-page :deep(.tournament-page-header button) {
font-size: var(--bet-font-normal);
font-size: var(--sammo-font-size-normal);
}
</style>
@@ -832,7 +832,7 @@ const repeatTurns = async (amount: number) => {
padding: 0;
gap: 0;
text-align: center;
font-size: 0.55rem;
font-size: var(--sammo-font-size-chief-compact-row);
line-height: 11.25px !important;
}
.chief-overview :deep(.chief-card.compact .chief-header) {
@@ -859,7 +859,7 @@ const repeatTurns = async (amount: number) => {
width: 12px;
height: 155px;
color: #fff;
font-size: 0.55rem;
font-size: var(--sammo-font-size-chief-compact-row);
line-height: 11.25px;
text-align: center;
}
@@ -349,7 +349,7 @@ small {
.hall-server,
.hall-nation,
.hall-name {
font-size: 11px;
font-size: var(--sammo-font-size-hall-name);
}
.hall-name {
@@ -360,7 +360,7 @@ small {
}
.hall-name small {
font-size: 95%;
font-size: var(--sammo-font-size-hall-secondary);
}
.hall-value {
@@ -946,7 +946,7 @@ select {
background-size: 48px 48px;
}
.chief-entry-copy strong {
font-size: 15px;
font-size: var(--sammo-font-size-personnel-mobile-name);
}
.chief-entry-copy small {
font-size: var(--sammo-font-size-small);
@@ -958,7 +958,7 @@ select {
line-height: 18px;
}
.personnel-lock-label {
font-size: 10px;
font-size: var(--sammo-font-size-personnel-mobile-lock);
}
.award-label {
font-size: var(--sammo-font-size-small);
@@ -540,7 +540,7 @@ onBeforeUnmount(() => {
border-right-color: #000;
border-bottom-color: #000;
border-spacing: 0;
font-size: 14px;
font-size: var(--sammo-font-size-normal);
text-align: center;
word-break: break-all;
}
@@ -578,7 +578,7 @@ onBeforeUnmount(() => {
margin: 0;
padding: 0;
color: inherit;
font-size: 14px;
font-size: var(--sammo-font-size-normal);
font-weight: 700;
line-height: 18.2px;
}