3 Commits

View File

@@ -154,6 +154,7 @@
<!-- 英雄排名 --> <!-- 英雄排名 -->
<div class="individual-rankings-container"> <div class="individual-rankings-container">
<h2 class="game-subtitle">英雄排名</h2> <h2 class="game-subtitle">英雄排名</h2>
<div class="scroll-wrapper"></div>
<div class="rank-table"> <div class="rank-table">
<div class="table-header" :style="{ 'grid-template-columns': individualGridTemplate }"> <div class="table-header" :style="{ 'grid-template-columns': individualGridTemplate }">
<span class="rank-col" :style="{ textAlign: localDisplayConfig.individual?.columnAlignments?.rank || 'left' }">排名</span> <span class="rank-col" :style="{ textAlign: localDisplayConfig.individual?.columnAlignments?.rank || 'left' }">排名</span>
@@ -2056,6 +2057,7 @@ onUnmounted(() => {
@media (max-width: 768px) { @media (max-width: 768px) {
.total-score-total-title { .total-score-total-title {
align-items: center; align-items: center;
display: flex; display: flex;
@@ -2340,8 +2342,10 @@ onUnmounted(() => {
/* 英雄排名列表设置 - 根据配置决定显示行数和滚动行为 */ /* 英雄排名列表设置 - 根据配置决定显示行数和滚动行为 */
.individual-rankings-container .rank-table { .individual-rankings-container .rank-table {
overflow-x: hidden !important; overflow-x: hidden !important;
/* 禁止横向滚动 */ /* 禁止横向滚动 */
height: var(--individual-default-height, auto) !important; height: var(--individual-default-height, auto) !important;
overflow-y: var(--individual-overflow-y, auto) !important; overflow-y: var(--individual-overflow-y, auto) !important;
/* 确保英雄排名列表隐藏滚动条 */ /* 确保英雄排名列表隐藏滚动条 */
@@ -2539,4 +2543,20 @@ onUnmounted(() => {
text-shadow: 0 0 20px rgba(255, 215, 0, 0.8) !important; text-shadow: 0 0 20px rgba(255, 215, 0, 0.8) !important;
} }
} }
/* ========== 移动端英雄榜滚动修复 ========== */
@media (max-width: 768px) {
.individual-rankings-container .scroll-wrapper {
max-height: 60vh;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.individual-rankings-container .scroll-wrapper::-webkit-scrollbar {
display: none;
}
.individual-rankings-container .rank-table {
min-height: auto !important;
max-height: none !important;
height: auto !important;
}
}
</style> </style>