chore: 移动端增加左右标题语的放置
This commit is contained in:
11
src/App.vue
11
src/App.vue
@@ -73,7 +73,16 @@
|
||||
/* 移动设备上隐藏左右标题语,避免遮挡主要内容 */
|
||||
.banner-left,
|
||||
.banner-right {
|
||||
display: none;
|
||||
scale: 0.4;
|
||||
top: 60px;
|
||||
}
|
||||
|
||||
.banner-left {
|
||||
margin-left: -28px;
|
||||
}
|
||||
|
||||
.banner-right{
|
||||
margin-right: -28px;
|
||||
}
|
||||
|
||||
/* 移动设备上的logo样式 - 保持相对于content-container定位 */
|
||||
|
||||
@@ -1661,11 +1661,7 @@ onUnmounted(() => {
|
||||
border-radius: 10px;
|
||||
background: rgba(255, 255, 255, 0.95);
|
||||
}
|
||||
|
||||
.game-subtitle {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
|
||||
/* 表格调整 */
|
||||
.rank-table {
|
||||
min-height: 250px;
|
||||
@@ -1673,9 +1669,14 @@ onUnmounted(() => {
|
||||
overflow-x: auto; /* 允许横向滚动 */
|
||||
}
|
||||
|
||||
.table-header,
|
||||
.table-header {
|
||||
font-size: 1rem;
|
||||
padding: 8px 6px;
|
||||
min-width: 500px;
|
||||
}
|
||||
|
||||
.table-row {
|
||||
font-size: 0.8rem;
|
||||
font-size: 0.9rem;
|
||||
padding: 8px 6px;
|
||||
min-width: 500px;
|
||||
}
|
||||
@@ -1741,7 +1742,12 @@ onUnmounted(() => {
|
||||
|
||||
/* 针对极小屏幕的特殊处理 */
|
||||
@media (max-width: 480px) {
|
||||
.table-header,
|
||||
.table-header {
|
||||
font-size: 0.9rem;
|
||||
padding: 8px 6px;
|
||||
min-width: 450px;
|
||||
}
|
||||
|
||||
.table-row {
|
||||
min-width: 450px;
|
||||
font-size: 0.75rem;
|
||||
|
||||
Reference in New Issue
Block a user