mirror of
https://github.com/LifeArchiveProject/WeChatDataAnalysis.git
synced 2026-02-19 22:30:49 +08:00
feat(wrapped-ui): 新增 Win98 主题与桌面化外观
- 主题系统新增 win98(显示名 Windows 98,快捷键扩展到 F1-F4),并区分 retro(pixel/CRT) 与桌面 GUI 主题 - 年度总结页新增 Win98 桌面背景与底部任务栏(背景色/视口高度适配) - 封面与卡片 slide 形态支持 Win98 窗口外观(title bar/icon/controls) - 主题切换器补充 Win98 选项并新增 Win98 专属切换器 - 新增 Win98 图标资源(Start + 桌面图标)
This commit is contained in:
@@ -38,6 +38,25 @@
|
||||
>[+]</button>
|
||||
</div>
|
||||
|
||||
<!-- Win98 风格 -->
|
||||
<div v-else-if="theme === 'win98'" class="year-win98">
|
||||
<div class="win98-year-box">
|
||||
<button
|
||||
class="win98-arrow"
|
||||
:disabled="!canGoPrev"
|
||||
@click="prevYear"
|
||||
aria-label="Previous year"
|
||||
>◄</button>
|
||||
<span class="win98-year-value">{{ modelValue }}年</span>
|
||||
<button
|
||||
class="win98-arrow"
|
||||
:disabled="!canGoNext"
|
||||
@click="nextYear"
|
||||
aria-label="Next year"
|
||||
>►</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modern 风格:下拉菜单(默认) -->
|
||||
<div v-else class="year-modern">
|
||||
<div class="relative inline-flex items-center">
|
||||
@@ -240,4 +259,57 @@ onBeforeUnmount(() => {
|
||||
min-width: 50px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ========== Win98 风格 ========== */
|
||||
.year-win98 {
|
||||
font-family: "MS Sans Serif", Tahoma, "Microsoft Sans Serif", "Segoe UI", sans-serif;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.win98-year-box {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
background: #c0c0c0;
|
||||
padding: 2px;
|
||||
border: 1px solid #808080;
|
||||
box-shadow:
|
||||
inset 1px 1px 0 #ffffff,
|
||||
inset -1px -1px 0 #000000;
|
||||
}
|
||||
|
||||
.win98-year-value {
|
||||
min-width: 62px;
|
||||
text-align: center;
|
||||
color: #000000;
|
||||
padding: 2px 8px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #808080;
|
||||
box-shadow:
|
||||
inset 1px 1px 0 #000000,
|
||||
inset -1px -1px 0 #ffffff;
|
||||
}
|
||||
|
||||
.win98-arrow {
|
||||
width: 24px;
|
||||
height: 22px;
|
||||
background: #c0c0c0;
|
||||
border: 1px solid #808080;
|
||||
box-shadow:
|
||||
inset 1px 1px 0 #ffffff,
|
||||
inset -1px -1px 0 #000000;
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.win98-arrow:active:not(:disabled) {
|
||||
box-shadow:
|
||||
inset 1px 1px 0 #000000,
|
||||
inset -1px -1px 0 #ffffff;
|
||||
}
|
||||
|
||||
.win98-arrow:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user