4907ded2 by 任超

style:左侧样式完成修改

1 parent a4842210
......@@ -74,7 +74,7 @@ export default {
},
heightNum: {
type: Number,
default: 240,
default: 260,
},
maxHeight: {
type: Number,
......
......@@ -17,8 +17,10 @@ export default {
</script>
<style lang="scss" scoped>
.app-main {
height: calc(100vh - 70px);
height: calc(100vh - 84px);
overflow-x: hidden;
box-sizing: border-box;
flex: 1;
width: 100%;
}
</style>
\ No newline at end of file
......
<template>
<div class="navbar-con">
<div class="navbar">
<div class="logo">
<img :src="require('@/image/logo.png')" alt="" />
</div>
<div class="backdrop">
<Breadcrumb />
</div>
......@@ -122,7 +125,7 @@ export default {
background: #0D1230;
display: flex;
align-items: center;
padding: 0 20px;
padding-right: 20px;
justify-content: space-between;
margin-bottom: 10px;
......
......@@ -89,9 +89,3 @@ export default {
}
}
</script>
<style scoped>
/deep/.el-menu-item {
padding-left: 30px !important;
}
</style>
\ No newline at end of file
......
<template>
<div>
<div class="logo">{{ title }}</div>
<el-scrollbar wrap-class="scrollbar-wrapper">
<el-menu router :default-active="activeMenu" :background-color="variables.menuBg" :text-color="variables.menuText"
:unique-opened="true" :active-text-color="variables.menuActiveText" :collapse-transition="false"
......@@ -47,14 +46,3 @@ export default {
}
}
</script>
\ No newline at end of file
<style scoped lang="scss">
.logo {
width: 100%;
height: 80px;
color: #ffffff;
font-size: 20px;
display: flex;
align-items: center;
padding-left: 20px;
}
</style>
\ No newline at end of file
......
<template>
<div class="app-wrapper">
<sidebar class="sidebar-container" />
<!-- <sidebar class="sidebar-container" />
<div class="main-container">
<navbar />
<app-main />
</div>
<!-- <navbar />
<div :class="{ hasTagsView: needTagsView }" class="main-container">
<div :class="{ 'fixed-header': fixedHeader }">
</div> -->
<navbar />
<div class="main-container">
<sidebar class="sidebar-container" />
<tags-view v-if="needTagsView" />
</div>
<app-main />
</div> -->
</div>
</div>
</template>
<script>
......@@ -45,7 +42,7 @@ export default {
position: relative;
height: 100%;
width: 100%;
background-color: #000;
background-color: $containerbg;
&.mobile.openSidebar {
position: fixed;
......
......@@ -18,7 +18,6 @@ export default {
<style lang="scss" scoped>
.hasTagsView {
.app-main {
height: calc(100% - 41px);
overflow-x: auto;
padding: 5px;
box-sizing: border-box;
......
......@@ -89,9 +89,3 @@ export default {
}
}
</script>
\ No newline at end of file
<style scoped>
/deep/.el-menu-item {
padding-left: 30px !important;
}
</style>
\ No newline at end of file
......
......@@ -42,11 +42,6 @@ export default {
background: none !important;
}
/deep/.el-menu-item {
color: #fff;
font-size: 18px;
}
/deep/.el-menu-item:hover {
background: none;
font-weight: 700;
......
#app {
.main-container {
height: 100%;
width: 100%;
height: calc(100% - 74px);
transition: margin-left 0.28s;
margin-left: 220px;
box-sizing: border-box;
padding-right: 10px;
display: flex;
background-color: $containerbg;
}
.sidebar-container {
transition: width 0.28s;
width: $sideBarWidth !important;
height: 100%;
// height: calc(100% - #{$headerHeight});
position: fixed;
font-size: 0px;
// top: $headerHeight;
bottom: 0;
left: 0;
z-index: 80;
background-color: $subMenuBg;
// overflow: hidden;
.horizontal-collapse-transition {
transition: 0s width ease-in-out, 0s padding-left ease-in-out,
......@@ -28,9 +21,7 @@
.scrollbar-wrapper {
overflow-x: hidden !important;
// overflow-y: auto;
margin-right: 0 !important;
height: calc(100vh - 80px);
&::-webkit-scrollbar {
display: none;
......@@ -67,14 +58,15 @@
// 有子级
.el-submenu__title {
margin-left: 13px;
padding-left: 10px !important;
color: $menuText;
background-color: transparent !important;
height: 42px;
background: linear-gradient(90deg, #013874 0%, #081B56 100%);
margin-bottom: 8px;
&:hover {
color: $subMenuActiveText !important;
background-color: $subMenuHover !important;
background: linear-gradient(90deg, #1D66DC 0%, #081B56 100%);
.svg-icon,
i,
......@@ -87,12 +79,13 @@
// 没有子级
.submenu-title-noDropdown {
color: $menuText;
// border-radius: 6px;
padding-left: 20px !important;
padding-left: 20px;
margin-bottom: 8px;
background: linear-gradient(90deg, #013874 0%, #081B56 100%);
&:hover {
color: $menuActiveText !important;
background-color: $subMenuHover !important;
background: linear-gradient(90deg, #1D66DC 0%, #081B56 100%);
.svg-icon {
color: #1ea6f8 !important;
......@@ -107,7 +100,7 @@
.submenu-title-noDropdown.is-active,
.el-submenu__title.is-active {
color: $menuActiveText;
background-color: $menuHover !important;
background: linear-gradient(90deg, #1D66DC 0%, #081B56 100%);
.svg-icon {
color: #1ea6f8 !important;
......@@ -178,10 +171,6 @@
width: 54px !important;
}
.main-container {
margin-left: 54px;
}
.submenu-title-noDropdown {
padding: 0 !important;
position: relative;
......@@ -341,6 +330,7 @@
}
.el-menu-item {
height: 42px;
display: flex;
align-items: center;
padding-right: 20px !important;
......
......@@ -9,15 +9,17 @@ $yellow:#FEC171;
$panGreen: #30B08F;
// header
$headerHeight: 60px;
$headerHeight: 64px;
// sidebar
$menuText:#ffffff;
$menuActiveText:#ffffff;
$subMenuActiveText:#ffffff;
$containerbg: #061850;
$menuBg:#0D1230;
$menuHover:#0794FF;
$menuHover: #1D66DC;
$subMenuBg:#0D1230;
$subMenuHover:#1D66DC;
......
......@@ -82,7 +82,7 @@
<div class="jrxxlb tableClass">
<div class="title">陕西省平台接入情况</div>
<!-- 陕西省平台接入情况table -->
<lb-table ref="table" :pagination="false" :heightNum="428" :column="tableData.columns" :data="tableData.data">
<lb-table ref="table" :pagination="false" :heightNum="440" :column="tableData.columns" :data="tableData.data">
</lb-table>
</div>
</div>
......