Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
9
91isoft_vue_manage
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
杨硕
91isoft_vue_manage
Commits
d4e3c9f9
Commit
d4e3c9f9
authored
Jan 16, 2024
by
张伯涛
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
themeD样式修改
parent
a69156b9
Changes
18
Hide whitespace changes
Inline
Side-by-side
Showing
18 changed files
with
1137 additions
and
7 deletions
+1137
-7
login-background.png
src/assets/themeDImage/login-background.png
+0
-0
login_logo.png
src/assets/themeDImage/login_logo.png
+0
-0
menuLogo.png
src/assets/themeDImage/menuLogo.png
+0
-0
index.vue
src/layout/components/Settings/index.vue
+2
-1
Logo.vue
src/layout/components/Sidebar/Logo.vue
+2
-0
index.vue
src/layout/components/Sidebar/index.vue
+3
-0
main.js
src/main.js
+2
-0
common.scss
src/styles/themeC/common.scss
+5
-5
login.scss
src/styles/themeC/login.scss
+1
-1
common.scss
src/styles/themeD/common.scss
+321
-0
index.scss
src/styles/themeD/index.scss
+14
-0
layout.scss
src/styles/themeD/layout.scss
+55
-0
login.scss
src/styles/themeD/login.scss
+156
-0
navigationBar.scss
src/styles/themeD/navigationBar.scss
+53
-0
reSetPsw.scss
src/styles/themeD/reSetPsw.scss
+27
-0
sidebar.scss
src/styles/themeD/sidebar.scss
+301
-0
tagsView.scss
src/styles/themeD/tagsView.scss
+88
-0
variables.scss
src/styles/themeD/variables.scss
+107
-0
No files found.
src/assets/themeDImage/login-background.png
0 → 100644
View file @
d4e3c9f9
This diff is collapsed.
Click to expand it.
src/assets/themeDImage/login_logo.png
0 → 100644
View file @
d4e3c9f9
2.29 KB
src/assets/themeDImage/menuLogo.png
0 → 100644
View file @
d4e3c9f9
1.24 KB
src/layout/components/Settings/index.vue
View file @
d4e3c9f9
...
...
@@ -39,7 +39,8 @@ export default {
themeOptions
:
[
{
value
:
'1'
,
label
:
'风格1'
},
{
value
:
'2'
,
label
:
'风格2'
},
{
value
:
'3'
,
label
:
'风格3'
}
{
value
:
'3'
,
label
:
'风格3'
},
{
value
:
'4'
,
label
:
'风格4'
},
]
}
},
...
...
src/layout/components/Sidebar/Logo.vue
View file @
d4e3c9f9
...
...
@@ -42,6 +42,8 @@ export default {
return
require
(
'@/assets/themeBImage/menuLogo.png'
)
}
else
if
(
localStorage
.
getItem
(
'theme'
)
===
'3'
)
{
return
require
(
'@/assets/themeCImage/menuLogo.png'
)
}
else
if
(
localStorage
.
getItem
(
'theme'
)
===
'4'
)
{
return
require
(
'@/assets/themeDImage/menuLogo.png'
)
}
}
},
...
...
src/layout/components/Sidebar/index.vue
View file @
d4e3c9f9
...
...
@@ -25,6 +25,7 @@ import SidebarItem from './SidebarItem'
import
variables
from
'@/styles/variables.scss'
import
themeBvariables
from
'@/styles/themeB/variables.scss'
import
themeCvariables
from
'@/styles/themeC/variables.scss'
import
themeDvariables
from
'@/styles/themeD/variables.scss'
export
default
{
components
:
{
SidebarItem
,
Logo
},
...
...
@@ -54,6 +55,8 @@ export default {
return
themeBvariables
}
else
if
(
localStorage
.
getItem
(
'theme'
)
===
'3'
)
{
return
themeCvariables
}
else
if
(
localStorage
.
getItem
(
'theme'
)
===
'4'
)
{
return
themeDvariables
}
},
isCollapse
()
{
...
...
src/main.js
View file @
d4e3c9f9
...
...
@@ -16,6 +16,8 @@ if (!storageValue || storageValue === '1') {
import
(
'@/styles/themeB/index.scss'
)
}
else
if
(
storageValue
===
'3'
)
{
import
(
'@/styles/themeC/index.scss'
)
}
else
if
(
storageValue
===
'4'
)
{
import
(
'@/styles/themeD/index.scss'
)
}
import
halberd
from
'@/utils/halberd'
import
App
from
'./App'
...
...
src/styles/themeC/common.scss
View file @
d4e3c9f9
...
...
@@ -154,13 +154,11 @@
line-height
:
16px
;
&
:hover
{
opacity
:
0
.85
;
background
:
#03a487
;
border
:
1px
solid
#03a487
!
important
;
background
:
linear-gradient
(
90deg
,
#1773ee
,
#1ad5e9
100%
);
}
&
:focus
{
opacity
:
0
.85
;
background
:
#03a487
;
border
:
1px
solid
#03a487
!
important
;
background
:
linear-gradient
(
90deg
,
#1773ee
,
#1ad5e9
100%
);
}
}
//清空/删除按钮
...
...
@@ -225,7 +223,9 @@
}
// radio选中的文字样式
.el-radio__input.is-checked
+
.el-radio__label
{
color
:
#03A487
;
background
:
linear-gradient
(
180deg
,
#1776ee
,
#1ad3e9
100%
);
-webkit-background-clip
:
text
;
-webkit-text-fill-color
:
transparent
;
}
// switch关样式
.el-switch__core
{
...
...
src/styles/themeC/login.scss
View file @
d4e3c9f9
...
...
@@ -44,7 +44,7 @@
}
.login-form
{
border
:
1px
solid
#1773ee
;
//
border: 1px solid #1773ee;
width
:
479px
;
height
:
625px
;
background
:
rgba
(
255
,
255
,
255
,
0
.90
);
...
...
src/styles/themeD/common.scss
0 → 100644
View file @
d4e3c9f9
// 通用样式,如:按钮,列表,form表单等
// 查询按钮
.queryBtn
{
//width: 72px;
//height: 32px;
background
:
#2e77b7
;
border
:
0
!
important
;
border-radius
:
4px
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#f6f6f6
;
line-height
:
16px
;
&
:hover
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#2e77b7
;
}
&
:focus
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#2e77b7
;
}
}
//重置按钮
.resetBtn
{
//width: 72px;
//height: 32px;
background
:
#f6f6f6
;
border
:
1px
solid
#d9d9d9
;
border-radius
:
4px
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#666666
;
line-height
:
16px
;
&
:hover
{
opacity
:
0
.85
;
background
:
#f6f6f6
;
border
:
1px
solid
#d9d9d9
!
important
;
}
&
:focus
{
opacity
:
0
.85
;
background
:
#f6f6f6
;
border
:
1px
solid
#d9d9d9
!
important
;
}
}
//新增按钮
.addBtn
{
//width: 72px;
//height: 34px;
border
:
0
!
important
;
background
:
#2e77b7
;
border-radius
:
6px
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#f6f6f6
;
line-height
:
16px
;
&
:hover
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#2e77b7
;
}
&
:focus
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#2e77b7
;
}
}
//导入按钮
.importBtn
{
//width: 72px;
//height: 34px;
border
:
0
!
important
;
background
:
#889ba9
;
border-radius
:
6px
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#f6f6f6
;
line-height
:
16px
;
&
:hover
{
color
:
#f6f6f6
;
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#889ba9
;
}
&
:focus
{
color
:
#f6f6f6
;
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#889ba9
;
}
}
//导出按钮
.exportBtn
{
//width: 72px;
//height: 34px;
background
:
#889ba9
!
important
;
border-radius
:
6px
;
border
:
0
!
important
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#f6f6f6
;
line-height
:
16px
;
&
:hover
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#889ba9
!
important
;
}
&
:focus
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#889ba9
!
important
;
}
}
//取消按钮样式
.cancelBtn
{
background
:
#ffffff
;
border
:
1px
solid
#d9d9d9
;
border-radius
:
4px
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#666666
;
line-height
:
16px
;
&
:hover
{
opacity
:
0
.85
;
background
:
#ffffff
;
border
:
1px
solid
#d9d9d9
!
important
;
}
&
:focus
{
opacity
:
0
.85
;
background
:
#ffffff
;
border
:
1px
solid
#d9d9d9
!
important
;
}
}
//确定按钮样式
.submitBtn
{
background
:
#2e77b7
;
border-radius
:
4px
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#ffffff
;
line-height
:
16px
;
&
:hover
{
opacity
:
0
.85
;
background
:
#2e77b7
;
border
:
1px
solid
#03a487
!
important
;
}
&
:focus
{
opacity
:
0
.85
;
background
:
#2e77b7
;
border
:
1px
solid
#03a487
!
important
;
}
}
//清空/删除按钮
.clearBtn
{
//width: 72px;
//height: 34px;
background
:
#889ba9
;
border
:
0
!
important
;
border-radius
:
6px
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#ffffff
;
line-height
:
16px
;
&
:hover
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#889ba9
;
}
&
:focus
{
border
:
0
!
important
;
opacity
:
0
.85
;
background
:
#889ba9
;
}
}
// form的label样式
.el-form-item__label
{
color
:
#333333
!
important
;
font-size
:
14px
!
important
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
}
// 输入框内文字样式
.el-input__inner
{
padding-right
:
10px
!
important
;
font-size
:
14px
!
important
;
}
// placeholder样式
::placeholder
{
color
:
#969696
!
important
;
font-size
:
14px
!
important
;
}
// tree组件样式
.el-tree-node
{
font-size
:
14px
!
important
;
}
//tree的选中的check框样式
//.el-checkbox__input.is-checked .el-checkbox__inner{
// background: linear-gradient(90deg,#1773ee, #1ad5e9 100%);
//}
// switch开样式
.el-switch.is-checked
.el-switch__core
{
background
:
#2e77b7
;
border-radius
:
9px
;
}
// radio开样式
.el-radio__input.is-checked
.el-radio__inner
{
background
:
#2e77b7
;
border-radius
:
9px
;
}
// radio选中的文字样式
.el-radio__input.is-checked
+
.el-radio__label
{
color
:
#2e77b7
;
}
// switch关样式
.el-switch__core
{
border-color
:
#BBBBBB
;
background-color
:
#BBBBBB
;
}
//table列表title样式
.tableTitle
{
margin
:
20px
0
;
color
:
#333333
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-700
;
font-weight
:
700
;
text-align
:
LEFT
;
}
// table列表表头样式
.el-table
th
.cell
{
background
:
#f2f2f2
;
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-700
;
font-weight
:
700
;
text-align
:
LEFT
;
color
:
#333333
;
line-height
:
24px
;
}
// table列表内容样式
.el-table
td
.cell
{
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#666666
;
}
//修改按钮文字类型样式
.updateBtn
{
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#2E77B7
;
}
//新增按钮文字类型样式
.addBtnText
{
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#2E77B7
;
}
//重置按钮文字类型样式
.resetBtnText
{
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#2E77B7
;
}
//删除按钮文字类型样式
.delBtn
{
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#2E77B7
;
}
//分页样式
.el-pagination.is-background
.el-pager
li
:not
(
.disabled
)
.active
{
background
:
#ffffff
;
border
:
1px
solid
#03a487
;
border-radius
:
2px
;
color
:
#03a487
;
font-size
:
14px
;
}
//分页样式
.el-pagination.is-background
.el-pager
li
{
font-size
:
14px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
color
:
#686A6C
;
background
:
#ffffff
;
border
:
1px
solid
#eeeeee
;
border-radius
:
2px
;
}
//分页样式
.el-pagination__total
{
font-size
:
14px
!
important
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-400
;
font-weight
:
400
;
text-align
:
LEFT
;
color
:
#686a6c
;
}
src/styles/themeD/index.scss
0 → 100644
View file @
d4e3c9f9
//------------公共的样式文件---------------------------------------------------
@import
"./navigationBar.scss"
;
// 左侧导航栏css样式文件
@import
"./sidebar.scss"
;
// 自带的左侧导航栏css样式文件
@import
"./variables.scss"
;
// 风格变量css样式文件
@import
"./tagsView.scss"
;
// 顶部面包屑tag签css样式文件
@import
"./layout.scss"
;
// layout的css样式文件
@import
"./common.scss"
;
// // 通用样式,如:按钮,列表,form表单等样式文件
//-----------各个模块的样式文件--------------------------------------------
@import
"./login.scss"
;
// 登录页面css样式文件
@import
"./reSetPsw.scss"
;
// 修改密码模块css样式文件
src/styles/themeD/layout.scss
0 → 100644
View file @
d4e3c9f9
@import
"../../styles/mixin"
;
@import
"./variables"
;
.app-wrapper
{
@include
clearfix
;
position
:
relative
;
height
:
100%
;
width
:
100%
;
&
.mobile.openSidebar
{
position
:
fixed
;
top
:
0
;
}
}
.nav-container
{
/*height: 70px;*/
//position: absolute;
top
:
0
;
width
:
100%
;
z-index
:
1001
;
}
.nav-container-two
{
width
:
100%
;
z-index
:
1001
;
.placeholder
{
height
:
1
.2vh
;
width
:
100%
;
background-color
:
#F4F4F4
;
}
}
.drawer-bg
{
background
:
#000
;
opacity
:
0
.3
;
width
:
100%
;
top
:
0
;
height
:
100%
;
position
:
absolute
;
z-index
:
999
;
}
.fixed-header
{
position
:
fixed
;
//top: 0;
//right: 0;
//z-index: 9;
width
:
calc
(
100%
-
#{
$sideBarWidth
}
);
transition
:
width
0
.28s
;
}
.hideSidebar
.fixed-header
{
width
:
calc
(
100%
-
#{
$sideHideWidth
}
)
}
.mobile
.fixed-header
{
width
:
100%
;
}
src/styles/themeD/login.scss
0 → 100644
View file @
d4e3c9f9
.login
{
display
:
flex
;
justify-content
:
end
;
align-items
:
center
;
padding-right
:
120px
;
height
:
100%
;
background-image
:
url("../../assets/themeDImage/login-background.png")
;
background-size
:
cover
;
.login_logoRow
{
padding-top
:
63px
;
display
:
flex
;
justify-content
:
center
;
width
:
100%
;
.login_form_logo
{
width
:
64px
;
height
:
64px
;
background-image
:
url("../../assets/themeDImage/login_logo.png")
;
}
}
.loginTitleRow
{
width
:
100%
;
display
:
flex
;
justify-content
:
center
;
margin-top
:
24px
;
.title
{
font-size
:
24px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-700
;
font-weight
:
700
;
text-align
:
CENTER
;
color
:
#333333
;
line-height
:
28px
;
}
}
.el-input__prefix
{
left
:
14px
;
}
.el-input--prefix
.el-input__inner
{
padding-left
:
44px
;
font-size
:
16px
;
}
.el-form-item
{
margin-bottom
:
4vh
;
}
}
.login-form
{
//border: 1px solid #1773ee;
width
:
479px
;
height
:
625px
;
background
:
rgba
(
255
,
255
,
255
,
0
.90
);
border-radius
:
20px
;
display
:
flex
;
flex-direction
:
column
;
align-items
:
flex-end
;
background
:
#ffffff
no-repeat
;
background-size
:
59%
;
background-position-y
:
57px
;
.login-form-content
{
padding-top
:
50px
;
width
:
100%
;
display
:
flex
;
flex-direction
:
column
;
align-items
:
center
;
.el-form-item
{
width
:
343px
;
height
:
44px
;
background
:
#ffffff
;
border
:
1px
solid
#d9d9d9
;
border-radius
:
4px
;
margin-bottom
:
30px
!
important
;
.el-input__inner
{
background
:
#ffffff
;
border
:
1px
solid
#2e77b7
;
border-radius
:
6px
;
}
}
// input 修改placeholder颜色
::-webkit-input-placeholder
{
/* WebKit, Blink, Edge */
color
:
#2E77B7
!
important
;
font-size
:
14px
;
}
.loginCode_formItem
{
width
:
343px
;
display
:
flex
;
justify-content
:
space-between
;
.el-form-item
{
width
:
200px
;
}
}
.loginBtn_formItem
{
margin
:
30px
0
20px
!
important
;
}
.blue-btn
{
width
:
343px
;
height
:
44px
;
background
:
#2e77b7
;
border-radius
:
6px
;
font-size
:
16px
;
font-family
:
Microsoft
YaHei
,
Microsoft
YaHei-700
;
font-weight
:
700
;
text-align
:
CENTER
;
color
:
#ffffff
;
line-height
:
19px
;
}
}
.el-input
{
height
:
44px
;
input
{
height
:
44px
;
}
}
.input-icon
{
height
:
39px
;
width
:
14px
;
margin-left
:
2px
;
}
}
.login-tip
{
font-size
:
13px
;
text-align
:
center
;
color
:
#bfbfbf
;
}
.login-code
{
height
:
44px
;
img
{
height
:
44px
;
cursor
:
pointer
;
vertical-align
:
middle
;
}
}
.el-login-footer
{
height
:
40px
;
line-height
:
40px
;
position
:
fixed
;
bottom
:
0
;
width
:
100%
;
text-align
:
center
;
color
:
#fff
;
font-family
:
Arial
;
font-size
:
12px
;
letter-spacing
:
1px
;
}
.login_buttons-content
{
display
:
flex
;
width
:
343px
;
justify-content
:
space-between
;
.rem-code
span
{
color
:
$font-dark
;
}
.el-link
span
{
color
:
$color-theme
;
}
.rem-code
span
,
.el-link
span
{
font-size
:
16px
;
}
}
src/styles/themeD/navigationBar.scss
0 → 100644
View file @
d4e3c9f9
.sidebarLogoFade-enter-active
{
transition
:
opacity
1
.5s
;
}
.sidebarLogoFade-enter
,
.sidebarLogoFade-leave-to
{
opacity
:
0
;
}
.sidebar-logo-container
{
background
:
#F6F6F6
!
important
;
height
:
150px
!
important
;
position
:
relative
;
width
:
100%
;
line-height
:
50px
;
padding-top
:
10px
;
padding-left
:
4px
;
overflow
:
hidden
;
.sidebar-logoRow
{
padding-top
:
28px
!
important
;
padding-bottom
:
2px
!
important
;
text-align
:
center
!
important
;
}
&
.sidebar-logo-link
{
height
:
100%
;
width
:
100%
;
&
.sidebar-logo
{
width
:
44px
;
height
:
44px
;
vertical-align
:
middle
;
//margin-right: 12px;
}
&
.sidebar-title
{
text-align
:
center
!
important
;
color
:
#333333
!
important
;
margin
:
0
;
font-weight
:
600
;
line-height
:
50px
;
font-size
:
14px
;
font-family
:
Avenir
,
Helvetica
Neue
,
Arial
,
Helvetica
,
sans-serif
;
vertical-align
:
middle
;
}
}
&
.collapse
{
.sidebar-logo
{
margin-right
:
0px
;
}
}
}
src/styles/themeD/reSetPsw.scss
0 → 100644
View file @
d4e3c9f9
.forget-pwd-content
{
display
:
flex
;
flex-direction
:
column
;
align-items
:
center
;
min-height
:
calc
(
100vh
-
110px
);
.title
{
font-size
:
24px
;
font-weight
:
bold
;
margin-top
:
40px
;
}
.el-form
{
margin-top
:
40px
;
width
:
40%
;
.el-form-item__label
{
color
:
#333333
;
font-weight
:
normal
;
}
.el-input__inner
{
border-radius
:
4px
;
}
.blue-btn
{
height
:
32px
;
border-radius
:
4px
;
}
}
}
src/styles/themeD/sidebar.scss
0 → 100644
View file @
d4e3c9f9
@import
'./variables'
;
#app
{
.main-container
{
padding-top
:
6
.4vh
;
min-height
:
100%
;
transition
:
margin-left
0
.28s
;
margin-left
:
219px
;
position
:
relative
;
}
.sidebar-container
{
transition
:
width
0
.28s
;
width
:
216px
!
important
;
background-color
:
#F6F6F6
;
box-shadow
:
3px
0px
3px
0px
rgba
(
0
,
0
,
0
,
0
.10
)
!
important
;
height
:
100%
;
position
:
fixed
;
font-size
:
0px
;
top
:
0
;
bottom
:
0
;
left
:
0
;
z-index
:
1001
;
overflow
:
hidden
;
// reset element-ui css
.horizontal-collapse-transition
{
transition
:
0s
width
ease-in-out
,
0s
padding-left
ease-in-out
,
0s
padding-right
ease-in-out
;
}
.scrollbar-wrapper
{
overflow-x
:
hidden
!
important
;
}
.el-scrollbar__bar.is-vertical
{
right
:
0px
;
}
.el-scrollbar
{
height
:
calc
(
100%
-
50px
);
}
&
.has-logo
{
.el-scrollbar
{
height
:
calc
(
100%
-
50px
);
}
}
.is-horizontal
{
display
:
none
;
}
a
{
display
:
inline-block
;
width
:
100%
;
overflow
:
hidden
;
}
.svg-icon
{
margin-right
:
17px
;
font-size
:
20px
;
}
.el-menu
{
border
:
none
;
height
:
100%
;
width
:
100%
!
important
;
}
// menu hover
.submenu-title-noDropdown
,
.el-submenu__title
{
&
:hover
{
background-color
:
$menuHover
!
important
;
}
}
.is-active
>
.el-submenu__title
{
background
:
#ebeced
!
important
;
}
&
.nest-menu
.el-submenu
>
.el-submenu__title
,
&
.el-submenu
.el-menu-item
{
background
:
#ebeced
!
important
;
font-size
:
12px
!
important
;
min-width
:
196px
!
important
;
height
:
42px
!
important
;
line-height
:
42px
!
important
;
border-radius
:
0px
!
important
;
}
}
.hideSidebar
{
.sidebar-container
{
width
:
$sideHideWidth
!
important
;
}
.main-container
{
margin-left
:
54px
;
}
.submenu-title-noDropdown
{
padding
:
0
!
important
;
position
:
relative
;
.el-tooltip
{
padding
:
0
!
important
;
.svg-icon
{
margin-left
:
17px
;
}
}
}
.el-submenu
{
overflow
:
hidden
;
&
>
.el-submenu__title
{
padding
:
0
!
important
;
.svg-icon
{
margin-left
:
17px
;
}
.el-submenu__icon-arrow
{
display
:
none
;
}
}
}
.el-menu--collapse
{
.el-submenu
{
&
>
.el-submenu__title
{
&
>
span
{
height
:
0
;
width
:
0
;
overflow
:
hidden
;
visibility
:
hidden
;
display
:
inline-block
;
}
}
}
}
}
.el-menu--collapse
.el-menu
.el-submenu
{
min-width
:
196px
!
important
;
}
// mobile responsive
.mobile
{
.main-container
{
margin-left
:
0px
;
}
.sidebar-container
{
transition
:
transform
0
.28s
;
width
:
196px
!
important
;
}
&
.hideSidebar
{
.sidebar-container
{
pointer-events
:
none
;
transition-duration
:
0
.3s
;
transform
:
translate3d
(
-196px
,
0
,
0
);
}
}
}
.withoutAnimation
{
.main-container
,
.sidebar-container
{
transition
:
none
;
}
}
}
// when menu collapsed
.el-menu--vertical
{
&
>
.el-menu
{
.svg-icon
{
margin-right
:
16px
;
}
}
.nest-menu
.el-submenu
>
.el-submenu__title
,
.el-menu-item
{
&
:hover
{
// you can use $subMenuHover
background-color
:
$menuHover
!
important
;
}
}
// the scroll bar appears when the subMenu is too long
>
.el-menu--popup
{
max-height
:
100vh
;
overflow-y
:
auto
;
&
:
:-
webkit-scrollbar-track-piece
{
background
:
#d3dce6
;
}
&
:
:-
webkit-scrollbar
{
width
:
6px
;
}
&
:
:-
webkit-scrollbar-thumb
{
background
:
#99a9bf
;
border-radius
:
20px
;
}
}
}
.el-submenu__icon-arrow
{
color
:
#ffffff
!
important
;
}
.is-active.submenu-title-noDropdown
{
background-color
:
#fff
!
important
;
}
#app
.sidebar-container
.el-submenu
.el-menu-item.is-active
{
background
:
#ffffff
!
important
;
color
:
#2e77b7
!
important
;
font-weight
:
700
!
important
;
border-right
:
4px
solid
#2E77B7
;
}
.router-link-active
.el-menu-item.is-active
{
span
{
font-weight
:
700
!
important
;
color
:
#2e77b7
!
important
;
}
}
// hover样式
.el-submenu__title
:hover
{
color
:
#2e77b7
!
important
;
.el-submenu__icon-arrow
{
color
:
#2e77b7
!
important
;
}
}
.nest-menu
.el-submenu
>
.el-submenu__title
:hover
{
background-color
:
#E2EEFD
!
important
;
color
:
#2e77b7
!
important
;
}
.is-active
>
.el-submenu__title
:hover
{
color
:
#2e77b7
!
important
;
}
.el-submenu
.el-menu-item
:hover
{
color
:
#2e77b7
!
important
;
}
.el-menu-item.submenu-title-noDropdown
:hover
{
color
:
#2e77b7
!
important
;
}
.el-menu--vertical
.el-menu-item
:hover
{
color
:
#2e77b7
!
important
;
}
#app
.hideSidebar
.el-submenu
>
.el-submenu__title
{
margin
:
0
!
important
;
}
.el-submenu.is-opened
{
background-color
:
#FFFFFF
!
important
;
>
.el-submenu__title
{
font-size
:
14px
!
important
;
color
:
#333333
!
important
;
font-weight
:
400
!
important
;
//margin: 0 10px!important;
height
:
42px
!
important
;
line-height
:
42px
!
important
;
border-radius
:
4px
!
important
;
.el-submenu__icon-arrow
{
color
:
#2e77b7
!
important
;
}
}
.el-menu
{
.el-menu-item
{
background-color
:
#fff
!
important
;
color
:
#666666
!
important
;
&
:hover
{
color
:
#2e77b7
!
important
;
}
&
.is-active
{
}
}
}
.nest-menu
{
//padding: 0 10px!important;
.el-submenu__title
{
background-color
:
#fff
!
important
;
color
:
#000000
!
important
;
.el-submenu__icon-arrow
{
color
:
#2e77b7
!
important
;
}
}
}
}
src/styles/themeD/tagsView.scss
0 → 100644
View file @
d4e3c9f9
.tags-view-container
{
height
:
31px
;
width
:
100%
;
background
:
#F4F4F4
;
//border-bottom: 1px solid #d8dce5;
//box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04);
margin
:
0
14px
;
.tags-view-wrapper
{
.tags-view-item
{
display
:
inline-block
;
position
:
relative
;
cursor
:
pointer
;
height
:
27px
;
line-height
:
26px
;
//border: 1px solid #d8dce5;
color
:
#495060
;
background
:
#fff
;
padding
:
0
10px
;
font-size
:
14px
;
margin-left
:
5px
;
margin-top
:
4px
;
&
:first-of-type
{
margin-left
:
0
;
}
&
:last-of-type
{
margin-right
:
15px
;
}
&
.active
{
background-color
:
#fff
;
color
:
#2e77b7
;
border-color
:
transparent
;
//&::before {
// content: '';
// background: #fff;
// display: inline-block;
// width: 8px;
// height: 8px;
// border-radius: 50%;
// position: relative;
// margin-right: 2px;
//}
}
}
}
.contextmenu
{
margin
:
0
;
background
:
#fff
;
z-index
:
3000
;
position
:
absolute
;
list-style-type
:
none
;
padding
:
5px
0
;
border-radius
:
4px
;
font-size
:
12px
;
font-weight
:
400
;
color
:
#333
;
box-shadow
:
2px
2px
3px
0
rgba
(
0
,
0
,
0
,
.3
);
li
{
margin
:
0
;
padding
:
7px
16px
;
cursor
:
pointer
;
&
:hover
{
background
:
#eee
;
}
}
}
}
.tags-view-wrapper
{
.tags-view-item
{
.el-icon-close
{
width
:
16px
;
height
:
16px
;
vertical-align
:
2px
;
border-radius
:
50%
;
text-align
:
center
;
transition
:
all
.3s
cubic-bezier
(
.645
,
.045
,
.355
,
1
);
transform-origin
:
100%
50%
;
&
:before
{
transform
:
scale
(
.6
);
display
:
inline-block
;
vertical-align
:
-3px
;
}
&
:hover
{
background-color
:
#b4bccc
;
color
:
#fff
;
}
}
}
}
src/styles/themeD/variables.scss
0 → 100644
View file @
d4e3c9f9
// 主题色
$color-theme
:
#03A487
;
$color-red
:
#F57b7b
;
$color-purple
:
#ff33a9
;
$color-orange
:
#f4ac10
;
$color-blue
:
#409EFF
;
// 我的单据背景色 考勤统计
$color-cambridge-blue
:
#29a2db
;
// 我的单据背景色 考勤统计
$color-cambridge-red
:
#ffbebe
;
// 我的单据背景色 考勤统计
$color-cambridge-yellow
:
#fcd89f
;
// 我的单据背景色 考勤统计
$color-cambridge-yellow
:
#fcd89f
;
// 我的单据背景色 考勤统计
$color-indigo
:
#9fc6fc
;
// 考勤统计
$color-indigo-deep
:
#5cbce5
;
// 考勤统计未选中项
$color-grey
:
#d1d1d1
;
// 系统背景色
$color-grey-light
:
#f4f4f4
;
// 列表表头底色
$color-grey-light
:
#ecf9fe
;
// 统计折线图背景色
$color-green
:
#49cec9
;
// 统计折线图折线
$color-green-deep
:
#1cc2bc
;
$color-green-light-btn
:
#6dd8e4
;
// 统计折线图背景色
$color-blue-bg
:
#1cc2bc
;
// 统计折线图折线
$color-blue-line
:
#0098de
;
// 考勤统计
$color-green-light
:
#80e4e9
;
// 线框、线段、列表 虚线分割线、表单不可修改
$color-border
:
#e5e5e5
;
// 查询 新增 申请 tab标签 分页列表中除修改之外的其他按钮
$blue-prime
:
#46BCF3
;
$blue-prime-hover
:
#6bc9f5
;
$blue-prime-active
:
#0098de
;
// 导出 导入 修改
$green-prime
:
#49cec9
;
$green-prime-hover
:
#6dd8d4
;
$green-prime-active
:
#1cc2bc
;
// 文件上传
$yellow-prime
:
#f6c761
;
$yellow-prime-hover
:
#f8d281
;
$yellow-prime-active
:
#f4ac10
;
// 删除
$red-prime
:
#f68f8f
;
$red-prime-hover
:
#f8a5a5
;
$red-prime-active
:
#ff7b7b
;
$blue
:
#324157
;
$light-blue
:
#3A71A8
;
$red
:
#C03639
;
$pink
:
#E65D6E
;
$green
:
#30B08F
;
$tiffany
:
#4AB7BD
;
$yellow
:
#FEC171
;
$panGreen
:
#30B08F
;
// 文字色
$font-black
:
#000
;
// 主文字
$font-dark
:
#333
;
// 次文字 表单内容、面包屑当前
$font-deep
:
#666666
;
// 说明文字
$font-pl
:
#999999
;
// 错误的提示文字 需要注意的提示文字
$font-error
:
#f52929
;
$font-weak
:
#b3b3b3
;
// 反白文字
$font-white
:
#fff
;
// 背景色
$bg-bar
:
#f9f9f9
;
$bg-page
:
#f3f3f3
;
$bg-page-light
:
#f9f9f9
;
$bg-menu-hover
:
#f2f6fc
;
// sidebar
$menuText
:
#333333
;
$menuActiveText
:
#333333
;
$subMenuActiveText
:
#f4f4f5
;
//https://github.com/ElemeFE/element/issues/12951
$menuBg
:
#F6F6F6
;
$menuHover
:
#fff
;
$subMenuBg
:
#46BCF2
;
$subMenuHover
:
#fff
;
$sideBarWidth
:
219px
;
$sideHideWidth
:
54px
;
// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export
{
menuText
:
$menuText
;
menuActiveText
:
$menuActiveText
;
subMenuActiveText
:
$subMenuActiveText
;
menuBg
:
$menuBg
;
menuHover
:
$menuHover
;
subMenuBg
:
$subMenuBg
;
subMenuHover
:
$subMenuHover
;
sideBarWidth
:
$sideBarWidth
;
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment