improvement(wrapped-ui): 下线 DOS 主题并优化 Wrapped 多主题体验

- 移除 DOS 主题入口、切换器组件与相关样式逻辑,统一主题为 Modern / GameBoy / Win98。

- 新增 WrappedGameboyDither 组件,并在背景与 CRT 叠加层中引入 GameBoy 噪点效果。

- 优化 wrapped 页面视口高度与背景同步逻辑(含 ResizeObserver 与 100dvh 适配),提升桌面容器显示稳定性。

- 调整封面标题与预览位移、回复速度卡片滚动行为等细节,提升主题下视觉与交互一致性。
This commit is contained in:
2977094657
2026-02-07 20:59:03 +08:00
parent 017ec6d089
commit e9c81caa12
15 changed files with 192 additions and 296 deletions

View File

@@ -186,7 +186,7 @@
暂无可展示的排行榜数据
</div>
<div v-else class="race-scroll mt-4 max-h-[26rem] overflow-auto pr-1">
<div v-else class="race-scroll mt-4 max-h-[26rem] overflow-y-auto overflow-x-hidden pr-1">
<TransitionGroup
name="race"
tag="div"
@@ -258,8 +258,7 @@ const props = defineProps({
const { theme } = useWrappedTheme()
const isGameboy = computed(() => theme.value === 'gameboy')
const isDos = computed(() => theme.value === 'dos')
const isRetro = computed(() => isGameboy.value || isDos.value)
const isRetro = computed(() => isGameboy.value)
const nfInt = new Intl.NumberFormat('zh-CN', { maximumFractionDigits: 0 })
const formatInt = (n) => nfInt.format(Math.round(Number(n) || 0))
@@ -756,6 +755,16 @@ onBeforeUnmount(() => {
transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}
.race-scroll {
scrollbar-width: none;
-ms-overflow-style: none;
}
.race-scroll::-webkit-scrollbar {
width: 0;
height: 0;
}
.race-move {
transition: transform 350ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}