fix: landscape toolbar date range style matches regular toolbar

Replaces bold centered date with nav arrows in landscape matrix view
with the same view-toolbar__nav + view-toolbar__range pattern used
by the regular toolbar (lighter font, wrapping text, consistent sizing).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
2026-05-03 10:35:37 +08:00
parent 766f511e11
commit 398ee9acfc
+5 -30
View File
@@ -32,14 +32,12 @@
<div v-if="isLandscape" class="landscape-shell"> <div v-if="isLandscape" class="landscape-shell">
<div class="landscape-shell__toolbar"> <div class="landscape-shell__toolbar">
<div class="landscape-shell__left"> <div class="view-toolbar__nav">
<van-button size="small" @click="matrixGoToday">本周</van-button>
</div>
<div class="landscape-shell__title">
<van-button size="small" @click="matrixGoPrev"></van-button> <van-button size="small" @click="matrixGoPrev"></van-button>
<span>{{ matrixWeekRange }}</span> <van-button size="small" @click="matrixGoToday">本周</van-button>
<van-button size="small" @click="matrixGoNext"></van-button> <van-button size="small" @click="matrixGoNext"></van-button>
</div> </div>
<span class="view-toolbar__range">{{ matrixWeekRange }}</span>
<div class="landscape-shell__toggle"> <div class="landscape-shell__toggle">
<van-button size="small" plain @click="isLandscape = false">退出横屏</van-button> <van-button size="small" plain @click="isLandscape = false">退出横屏</van-button>
<van-button <van-button
@@ -565,6 +563,7 @@ export default defineComponent({
}; };
const draw = () => { const draw = () => {
if (!calendar.value) { console.debug('[clazz draw] skip, calendar null'); return; }
let api = calendar.value.getApi() let api = calendar.value.getApi()
api.removeAllEvents(); api.removeAllEvents();
store.list.forEach(item => { store.list.forEach(item => {
@@ -1447,8 +1446,7 @@ export default defineComponent({
flex-shrink: 0; flex-shrink: 0;
min-height: var(--landscape-toolbar-height); min-height: var(--landscape-toolbar-height);
box-sizing: border-box; box-sizing: border-box;
display: grid; display: flex;
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center; align-items: center;
gap: 0.08rem; gap: 0.08rem;
padding: 0.08rem 0.12rem; padding: 0.08rem 0.12rem;
@@ -1456,29 +1454,6 @@ export default defineComponent({
background: #fff; background: #fff;
} }
.landscape-shell__left {
display: flex;
align-items: center;
gap: 0.08rem;
}
.landscape-shell__title {
min-width: 0;
display: flex;
align-items: center;
justify-content: center;
gap: 0.08rem;
color: #333;
font-size: 0.24rem;
font-weight: 600;
span {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.landscape-shell__toggle { .landscape-shell__toggle {
display: flex; display: flex;