手机端后台主题切换收进顶栏:浮动按钮压总览图表右下角,顶栏 34px 胶囊与 ☰/退出同排;后台路由不再挂全局浮动按钮
This commit is contained in:
1 parent
f72d1107e0
commit
3eaf2c6042
2 files changed
+17
-2
No files matched your search
@@ -65,8 +65,9 @@ watch(
|
|||||||
<!-- 图片预览层:时间线 / 详情页的配图点开时全屏展示 -->
|
<!-- 图片预览层:时间线 / 详情页的配图点开时全屏展示 -->
|
||||||
<ImgLightbox />
|
<ImgLightbox />
|
||||||
<!-- 桌面端:左栏底部放 inline 形态;窄屏:左栏收起,浮动按钮兜底。
|
<!-- 桌面端:左栏底部放 inline 形态;窄屏:左栏收起,浮动按钮兜底。
|
||||||
vivid 的顶部导航自带切换器,浮动那个就不重复出现了。 -->
|
vivid 的顶部导航自带切换器,浮动那个就不重复出现了。
|
||||||
<ThemeSwitcher v-if="!isVivid" variant="floating" class="theme-floating-only" />
|
后台不走浮动:手机端顶栏里有(AdminLayout),浮动会压住卡片右下角。 -->
|
||||||
|
<ThemeSwitcher v-if="!isVivid && !isAdmin" variant="floating" class="theme-floating-only" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|||||||
@@ -176,6 +176,9 @@ watch(() => route.path, () => {
|
|||||||
<button class="cmd-hint" @click="paletteOpen = true">
|
<button class="cmd-hint" @click="paletteOpen = true">
|
||||||
搜索 / 命令 <kbd>⌘K</kbd>
|
搜索 / 命令 <kbd>⌘K</kbd>
|
||||||
</button>
|
</button>
|
||||||
|
<!-- 手机端主题切换收进顶栏(浮动按钮在总览页会压住卡片右下角);
|
||||||
|
桌面隐藏,切换仍走侧栏 footer -->
|
||||||
|
<ThemeSwitcher variant="inline" class="switch-m" />
|
||||||
<!-- 手机端侧栏进抽屉后,退出固定放顶栏;桌面隐藏,退出仍走侧栏 footer -->
|
<!-- 手机端侧栏进抽屉后,退出固定放顶栏;桌面隐藏,退出仍走侧栏 footer -->
|
||||||
<button class="btn leave-m" @click="logout">退出</button>
|
<button class="btn leave-m" @click="logout">退出</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -204,4 +207,15 @@ watch(() => route.path, () => {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
color: var(--admin-muted);
|
color: var(--admin-muted);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 顶栏主题切换:手机专属(≤860px 与抽屉同 breakpoint),桌面隐藏。
|
||||||
|
34px 比 inline 默认 40px 略小,跟 36px 的 ☰ / 退出按钮同排不突兀;
|
||||||
|
选择器带 .admin-topbar 提特度,压过组件自身的 .theme-switcher--inline。 */
|
||||||
|
.admin-topbar .switch-m {display: none;}
|
||||||
|
@media (max-width: 860px) {
|
||||||
|
.admin-topbar .switch-m {display: inline-flex;
|
||||||
|
width: 34px;
|
||||||
|
height: 34px;}
|
||||||
|
.admin-topbar .switch-m :deep(.ic) {font-size: 16px;}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in new issue
Block a user