update 面包屑位置调整

(cherry picked from commit d6f59523a5)
This commit is contained in:
赵霄
2023-12-06 16:08:29 +08:00
parent 6a282bd82b
commit 5b0a332b44
4 changed files with 52 additions and 48 deletions
+48 -41
View File
@@ -15,18 +15,17 @@
v-else
class="trigger"
:type="collapsed ? 'menu-unfold' : 'menu-fold'"
@click="toggle"/>
@click="toggle" />
<span v-if="device === 'desktop'">中国重汽标准法规管理系统</span>
<span v-else>Jero-Boot</span>
<breadcrumb class="breadcrumb" />
<user-menu :theme="theme"/>
<user-menu :theme="theme" />
</div>
<!-- 顶部导航栏模式 -->
<div v-else :class="['top-nav-header-index', theme]">
<div class="header-index-wide">
<div class="header-index-left" :style="topMenuStyle.headerIndexLeft">
<logo class="top-nav-header" :show-title="device !== 'mobile'" :style="topMenuStyle.topNavHeader"/>
<logo class="top-nav-header" :show-title="device !== 'mobile'" :style="topMenuStyle.topNavHeader" />
<div v-if="device !== 'mobile'" :style="topMenuStyle.topSmenuStyle">
<s-menu
mode="horizontal"
@@ -41,7 +40,7 @@
:type="collapsed ? 'menu-fold' : 'menu-unfold'"
@click="toggle"></a-icon>
</div>
<user-menu class="header-index-right" :theme="theme" :style="topMenuStyle.headerIndexRight"/>
<user-menu class="header-index-right" :theme="theme" :style="topMenuStyle.headerIndexRight" />
</div>
</div>
@@ -53,10 +52,12 @@ import UserMenu from '../tools/UserMenu'
import SMenu from '../menu/'
import Logo from '../tools/Logo'
import { mixin } from '@/utils/mixin.js'
import Breadcrumb from '../tools/Breadcrumb'
export default {
name: 'GlobalHeader',
components: {
Breadcrumb,
UserMenu,
SMenu,
Logo
@@ -166,57 +167,63 @@ export default {
</script>
<style lang="less" scoped>
/* update_begin author:scott date:20190220 for: 缩小首页布局顶部的高度*/
/* update_begin author:scott date:20190220 for: 缩小首页布局顶部的高度*/
@height: 59px;
@height: 59px;
.layout {
.layout {
.top-nav-header-index {
.top-nav-header-index {
.header-index-wide {
margin-left: 10px;
.header-index-wide {
margin-left: 10px;
.ant-menu.ant-menu-horizontal {
height: @height;
line-height: @height;
}
}
.trigger {
line-height: 64px;
&:hover {
background: rgba(0, 0, 0, 0.05);
}
.ant-menu.ant-menu-horizontal {
height: @height;
line-height: @height;
}
}
.header {
z-index: 2;
color: #1D2129;
height: @height;
background-color: white;
transition: background 300ms;
.trigger {
line-height: 64px;
/* dark 样式 */
&.dark {
color: #000000;
box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
background-color: white !important;
}
}
.header, .top-nav-header-index {
&.dark .trigger:hover {
&:hover {
background: rgba(0, 0, 0, 0.05);
}
}
}
.ant-layout-header {
.header {
z-index: 2;
color: #1D2129;
height: @height;
line-height: @height;
background-color: white;
transition: background 300ms;
/* dark 样式 */
&.dark {
color: #000000;
box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
background-color: white !important;
}
}
/* update_end author:scott date:20190220 for: 缩小首页布局顶部的高度*/
.header, .top-nav-header-index {
&.dark .trigger:hover {
background: rgba(0, 0, 0, 0.05);
}
}
}
.ant-layout-header {
height: @height;
line-height: @height;
}
/* update_end author:scott date:20190220 for: 缩小首页布局顶部的高度*/
.breadcrumb {
display: inline-block;
margin: 0;
}
</style>