Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
InJoyU
vue-element-admin
提交
7451ed62
V
vue-element-admin
项目概览
InJoyU
/
vue-element-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
5
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-element-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
7451ed62
编写于
11月 06, 2017
作者:
P
Pan
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
style:refine sidebar css
上级
71aa416d
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
71 addition
and
78 deletion
+71
-78
src/styles/sidebar.scss
src/styles/sidebar.scss
+65
-69
src/views/layout/components/Sidebar.vue
src/views/layout/components/Sidebar.vue
+0
-2
src/views/layout/components/SidebarItem.vue
src/views/layout/components/SidebarItem.vue
+6
-7
未找到文件。
src/styles/sidebar.scss
浏览文件 @
7451ed62
...
...
@@ -4,17 +4,7 @@
min-height
:
100%
;
transition
:
margin-left
0
.28s
;
margin-left
:
180px
;
}
// 侧边栏
.hideSidebar
{
.sidebar-container
{
width
:
36px
!
important
;
overflow
:
inherit
;
}
.main-container
{
margin-left
:
36px
;
}
}
}
// 侧边栏
.sidebar-container
{
transition
:
width
0
.28s
;
width
:
180px
!
important
;
...
...
@@ -28,72 +18,78 @@
&
::-webkit-scrollbar
{
display
:
none
}
}
.sidebar-container
>
.el-menu
{
width
:
100%
!
important
;
min-height
:
100%
;
}
.sidebar-container
.svg-icon
{
margin-right
:
16px
;
}
.hideSidebar
.el-submenu
>
.el-submenu__title
,
.hideSidebar
.submenu-title-noDropdown
{
padding-left
:
10px
!
important
;
}
.hideSidebar
.submenu-title-noDropdown
span
,
.hideSidebar
.el-submenu
>
.el-submenu__title
>
span
{
height
:
0
;
width
:
0
;
overflow
:
hidden
;
visibility
:
hidden
;
display
:
inline-block
;
}
.hideSidebar
.nest-menu
.el-submenu__title
{
text-align
:
initial
!
important
;
padding-left
:
20px
!
important
;
span
{
height
:
auto
;
width
:
auto
;
visibility
:
visible
;
display
:
inline
;
a
{
display
:
inline-block
;
width
:
100%
;
}
.el-submenu__icon-arrow
{
display
:
block
!
important
;
.svg-icon
{
margin-right
:
16px
;
}
.el-menu
{
border
:
none
;
}
}
.hideSidebar
.menu-wrapper
>
.el-menu-item
,
.hideSidebar
.submenu-title-noDropdown
,
.hideSidebar
.menu-wrapper
>
.el-submenu
.el-submenu__title
{
text-align
:
center
;
}
.hideSidebar
.el-menu-item
.el-submenu__icon-arrow
,
.hideSidebar
.el-submenu
.el-submenu__title
.el-submenu__icon-arrow
{
display
:
none
;
}
.hideSidebar
.submenu-title-noDropdown
{
position
:
relative
;
span
{
transition
:
opacity
.3s
cubic-bezier
(
.55
,
0
,
.1
,
1
);
opacity
:
0
;
.hideSidebar
{
.sidebar-container
{
width
:
36px
!
important
;
overflow
:
inherit
;
}
&
:hover
{
.main-container
{
margin-left
:
36px
;
}
}
.hideSidebar
{
.submenu-title-noDropdown
{
padding-left
:
10px
!
important
;
position
:
relative
;
span
{
display
:
block
;
border-radius
:
3px
;
z-index
:
1002
;
width
:
140px
;
height
:
56px
;
visibility
:
visible
;
position
:
absolute
;
right
:
-145px
;
text-align
:
left
;
text-indent
:
20px
;
top
:
0px
;
background-color
:
#2B2C2D
!
important
;
opacity
:
1
;
height
:
0
;
width
:
0
;
overflow
:
hidden
;
visibility
:
hidden
;
transition
:
opacity
.3s
cubic-bezier
(
.55
,
0
,
.1
,
1
);
opacity
:
0
;
display
:
inline-block
;
}
&
:hover
{
span
{
display
:
block
;
border-radius
:
3px
;
z-index
:
1002
;
width
:
140px
;
height
:
56px
;
visibility
:
visible
;
position
:
absolute
;
right
:
-145px
;
text-align
:
left
;
text-indent
:
20px
;
top
:
0px
;
background-color
:
#2B2C2D
!
important
;
opacity
:
1
;
}
}
}
.el-submenu
{
&
>
.el-submenu__title
{
padding-left
:
10px
!
important
;
&
>
span
{
display
:
none
;
}
.el-submenu__icon-arrow
{
display
:
none
;
}
}
.nest-menu
{
.el-submenu__icon-arrow
{
display
:
block
!
important
;
}
span
{
display
:
inline-block
!
important
;
}
}
}
}
.nest-menu
.el-submenu
>
.el-submenu__title
,
.el-submenu
.el-menu-item
{
min-width
:
180px
!
important
;
background-color
:
#2B2C2D
!
important
;
...
...
src/views/layout/components/Sidebar.vue
浏览文件 @
7451ed62
...
...
@@ -4,8 +4,6 @@
</el-menu>
</
template
>
<
script
>
import
{
mapGetters
}
from
'
vuex
'
import
SidebarItem
from
'
./SidebarItem
'
...
...
src/views/layout/components/SidebarItem.vue
浏览文件 @
7451ed62
...
...
@@ -5,26 +5,25 @@
<router-link
v-if=
"!item.hidden&&item.children&&item.children.length===1"
:to=
"item.path+'/'+item.children[0].path"
:key=
'item.children[0].name'
>
<el-menu-item
:index=
"item.path+'/'+item.children[0].path"
class=
'submenu-title-noDropdown'
>
<svg-icon
v-if=
'item.children[0].meta&&item.children[0].meta.icon'
:icon-class=
"item.children[0].meta.icon"
></svg-icon>
<span
>
{{
item
.
children
[
0
].
meta
?
generateTitle
(
item
.
children
[
0
].
meta
.
title
):
'
no title
'
}}
</span>
<span
v-if=
'item.children[0].meta&&item.children[0].meta.title'
>
{{
generateTitle
(
item
.
children
[
0
].
meta
.
title
)
}}
</span>
</el-menu-item>
</router-link>
<el-submenu
:index=
"item.name"
v-if=
"item.children&&item.children.length>1&&!item.hidden
"
:key=
'item.name'
>
<el-submenu
v-if=
"!item.hidden&&item.children&&item.children.length>1"
:index=
"item.name
"
:key=
'item.name'
>
<template
slot=
"title"
>
<svg-icon
v-if=
'item.meta&&item.meta.icon'
:icon-class=
"item.meta.icon"
></svg-icon>
<span
>
{{
item
.
meta
?
generateTitle
(
item
.
meta
.
title
):
'
no title
'
}}
</span>
<span
v-if=
'item.meta&&item.meta.title'
>
{{
generateTitle
(
item
.
meta
.
title
)
}}
</span>
</
template
>
<
template
v-for=
"child in item.children"
v-if=
'!child.hidden'
>
<sidebar-item
class=
'nest-menu'
v-if=
'child.children&&child.children.length>0'
:routes=
'[child]'
:key=
'child.path'
>
</sidebar-item>
<
template
v-if=
'!child.hidden'
v-for=
"child in item.children"
>
<sidebar-item
class=
'nest-menu'
v-if=
'child.children&&child.children.length>0'
:routes=
'[child]'
:key=
'child.path'
></sidebar-item>
<router-link
v-else
:to=
"item.path+'/'+child.path"
:key=
'child.name'
>
<el-menu-item
:index=
"item.path+'/'+child.path"
>
<svg-icon
v-if=
'child.meta&&child.meta.icon'
:icon-class=
"child.meta.icon"
></svg-icon>
<span
v-if=
'child.meta
'
>
{{
generateTitle
(
child
.
meta
.
title
)
}}
</span>
<span
v-if=
'child.meta
&&child.meta.title'
>
{{
generateTitle
(
child
.
meta
.
title
)
}}
</span>
</el-menu-item>
</router-link>
</
template
>
</el-submenu>
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录