improvement(wrapped): 年度总结仅保留 Modern 主题

- 移除复古主题切换入口(控制面板/左上角按钮)与 Win98/CRT 相关 UI

- 简化 useWrappedTheme:仅保留 off(Modern),历史主题值自动回退

- Modern 下也展示 LuckyBlock 占位图,并同步更新 README 说明
This commit is contained in:
2977094657
2026-02-18 19:11:47 +08:00
parent b281d016be
commit c68e4fffeb
5 changed files with 22 additions and 227 deletions

View File

@@ -1,109 +1,31 @@
/**
* 年度总结页面主题管理 composable
* 支持三种主题:modern现代、gameboyGame Boy、win98Windows 98
* 仅保留 modern现代主题
*/
const STORAGE_KEY = 'wrapped-theme'
const VALID_THEMES = ['off', 'gameboy', 'win98']
const RETRO_THEMES = new Set(['gameboy'])
// 全局响应式状态(跨组件共享)
const theme = ref('off')
let initialized = false
let keyboardInitialized = false
// Note: 历史上曾尝试过 gameboy / win98 等主题,但目前已移除,仅保留 Modern。
const theme = ref('off') // off === Modern
export function useWrappedTheme() {
// 初始化:从 localStorage 读取(仅执行一次)
const initTheme = () => {
if (initialized || !import.meta.client) return
const saved = localStorage.getItem(STORAGE_KEY)
if (saved && VALID_THEMES.includes(saved)) {
theme.value = saved
}
initialized = true
}
// 设置主题
const setTheme = (newTheme) => {
if (!VALID_THEMES.includes(newTheme)) {
console.warn(`Invalid theme: ${newTheme}`)
return
}
theme.value = newTheme
if (import.meta.client) {
localStorage.setItem(STORAGE_KEY, newTheme)
// Only keep Modern.
if (newTheme !== 'off') {
console.warn(`Wrapped theme '${newTheme}' has been removed; falling back to Modern.`)
}
theme.value = 'off'
}
// 切换到下一个主题(循环)
const cycleTheme = () => {
const currentIndex = VALID_THEMES.indexOf(theme.value)
const nextIndex = (currentIndex + 1) % VALID_THEMES.length
setTheme(VALID_THEMES[nextIndex])
}
const cycleTheme = () => setTheme('off')
// 计算属性:是否为复古模式(非 off
const isRetro = computed(() => theme.value !== 'off')
// 计算属性:当前主题的 CSS 类名
const themeClass = computed(() => {
if (theme.value === 'off') return ''
// Note: not every non-modern theme is "retro pixel/CRT".
// Keep wrapped-retro for themes that rely on pixel/CRT shared styles.
const base = RETRO_THEMES.has(theme.value) ? 'wrapped-retro ' : ''
return `${base}wrapped-theme-${theme.value}`
})
// 计算属性:主题显示名称
const themeName = computed(() => {
const names = {
off: 'Modern',
gameboy: 'Game Boy',
win98: 'Windows 98'
}
return names[theme.value] || 'Modern'
})
// 全局 F1-F3 快捷键切换主题(仅初始化一次)
const initKeyboardShortcuts = () => {
if (keyboardInitialized || !import.meta.client) return
keyboardInitialized = true
const handleKeydown = (e) => {
// 检查是否在可编辑元素中
const el = e.target
if (el && (el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT' || el.isContentEditable)) {
return
}
if (e.key === 'F1') {
e.preventDefault()
setTheme('off')
} else if (e.key === 'F2') {
e.preventDefault()
setTheme('gameboy')
} else if (e.key === 'F3') {
e.preventDefault()
setTheme('win98')
}
}
window.addEventListener('keydown', handleKeydown)
}
// 客户端挂载后再初始化:避免 SSR 与首帧 hydration 不一致
onMounted(() => {
initTheme()
initKeyboardShortcuts()
})
const isRetro = computed(() => false)
const themeClass = computed(() => '')
return {
theme: readonly(theme),
setTheme,
cycleTheme,
isRetro,
themeClass,
themeName,
VALID_THEMES
themeClass
}
}