feat(LayoutView): 在移动端侧边栏添加域名筛选器
在移动端视图中,将域名筛选器从顶部操作栏移至侧边栏,以改善移动设备上的用户体验。同时隐藏了桌面端顶部操作栏中的域名筛选器,确保界面整洁。
This commit is contained in:
@@ -16,7 +16,7 @@
|
||||
</button>
|
||||
<div class="layout-title">CWD 评论系统</div>
|
||||
<div class="layout-actions-wrapper">
|
||||
<div class="layout-domain-filter">
|
||||
<div class="layout-domain-filter layout-domain-filter-header">
|
||||
<select v-model="domainFilter" class="layout-domain-select">
|
||||
<option value="">全部域名</option>
|
||||
<option v-for="item in domainOptions" :key="item" :value="item">
|
||||
@@ -80,6 +80,14 @@
|
||||
class="layout-sider"
|
||||
:class="{ 'layout-sider-mobile-open': isMobileSiderOpen }"
|
||||
>
|
||||
<div class="layout-sider-domain-filter">
|
||||
<select v-model="domainFilter" class="layout-domain-select">
|
||||
<option value="">全部域名</option>
|
||||
<option v-for="item in domainOptions" :key="item" :value="item">
|
||||
{{ item }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<ul class="menu">
|
||||
<li
|
||||
class="menu-item"
|
||||
@@ -302,6 +310,10 @@ function handleLogoutFromActions() {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.layout-sider-domain-filter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.layout-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
@@ -457,6 +469,20 @@ function handleLogoutFromActions() {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.layout-domain-filter-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.layout-sider-domain-filter {
|
||||
display: block;
|
||||
padding: 12px 16px 0;
|
||||
}
|
||||
|
||||
.layout-sider-domain-filter .layout-domain-select {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.layout-actions-toggle {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user