Skip to content

Commit 9411bdf

Browse files
committed
主题颜色
1 parent 26e08f6 commit 9411bdf

File tree

8 files changed

+87
-24
lines changed

8 files changed

+87
-24
lines changed

src/assets/less/common.less

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ body{
5757
}
5858

5959

60-
// ================== 通用 =============
60+
// ================== 自定义 =============
6161
.t-operate-top{
6262
.t-operate-filter{
6363
.el-form-item--mini.el-form-item, .el-form-item--small.el-form-item{
@@ -96,8 +96,8 @@ body{
9696
vertical-align: middle;
9797
}
9898
.t-select-all{
99-
margin-left: 12px;
100-
margin-right: 12px;
99+
margin-left: 11px;
100+
margin-right: 11px;
101101
}
102102
.t-table-pagination{
103103
vertical-align: middle;
@@ -112,6 +112,12 @@ body{
112112
width: 100%;
113113
}
114114
}
115+
.t-dialog{
116+
.el-dialog__body {
117+
padding: 10px 20px;
118+
}
119+
}
120+
115121

116122
// ================== 登录界面 =============
117123
.t-login-wrap {
@@ -230,7 +236,6 @@ body{
230236
}
231237
}
232238

233-
234239
// ============ 模态框组件 ==============
235240
.el-popup-parent--hidden {
236241
overflow-y: hidden;

src/assets/less/common/login.less

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@
1919
font-weight: 400;
2020
span{
2121
font-size: 36px;
22-
color: #1D8CE0;
2322
font-weight: bold;
2423
}
2524
}

src/assets/less/theme.less

Lines changed: 72 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,12 @@
1313
}
1414

1515
.theme-mix(){
16+
// ==================== 登录界面
17+
.login-title-theme{
18+
color: @color;
19+
}
20+
21+
1622
// ==================== 顶部导航条
1723
.navigationBar-theme{
1824
.logo, .item-wrap .item,
@@ -57,24 +63,80 @@
5763
.router-tabs-theme{
5864
top: @navigationBar-height;
5965
left: @menu-width;
60-
.el-tabs__header .el-tabs__item{
61-
&.is-active,&:not(.is-disabled):hover{
62-
color: @color;
63-
}
64-
}
6566
}
6667

6768

6869

6970
// ==================== element-ui组件
70-
.el-button--theme{
71-
color: #fff;
72-
background-color: @color;
71+
.el-button--default:focus, .el-button--default:hover, .el-button--default:active {
72+
color: @color;
7373
border-color: @color;
7474
}
75-
.el-button--theme:focus, .el-button--theme:hover{
75+
.el-button--primary, .el-radio__input.is-checked .el-radio__inner,
76+
.el-radio-button__orig-radio:checked+.el-radio-button__inner,
77+
.el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner,
78+
.el-switch.is-checked .el-switch__core{
79+
border-color: @color;
80+
background-color: @color;
81+
}
82+
.el-button--primary:focus, .el-button--primary:hover{
83+
border-color: @color-hover;
7684
background: @color-hover;
85+
}
86+
.el-button--text, .el-radio__input.is-checked+.el-radio__label,
87+
.el-checkbox.is-bordered.is-checked, .el-checkbox__input.is-checked+.el-checkbox__label,
88+
.el-tag, .el-tabs__item.is-active, .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active,
89+
.el-step__head.is-finish, .el-step__title.is-finish, .el-step__description.is-finish{
90+
color: @color;
91+
}
92+
.el-button--text:focus, .el-button--text:hover, .el-tabs__item:hover,
93+
.el-pager li:hover, .el-pagination.is-background .el-pager li:not(.disabled):hover,
94+
.el-tabs--border-card>.el-tabs__header .el-tabs__item:not(.is-disabled):hover,
95+
.el-breadcrumb__inner a:hover, .el-breadcrumb__inner.is-link:hover,
96+
.el-input-number__decrease:hover, .el-input-number__increase:hover,
97+
.el-transfer-panel__item:hover, .el-radio-button__inner:hover{
98+
color: @color-hover;
99+
}
100+
.el-pagination.is-background .el-slider__bar, .el-progress-bar__inner,
101+
.el-badge__content, .el-tabs__active-bar, .el-pager li:not(.disabled).active{
102+
background-color: @color;
103+
}
104+
.el-form-item.is-error .el-input__inner, .el-form-item.is-error .el-textarea__inner,
105+
.el-message-box__input input.invalid, .el-input.is-active .el-input__inner,
106+
.el-select .el-input.is-focus .el-input__inner,.el-checkbox.is-bordered.is-checked,
107+
.el-textarea__inner:focus, .el-slider__button, .el-step__icon.is-text{
108+
border-color: @color;
109+
}
110+
.el-form-item.is-error .el-input__inner:focus, .el-form-item.is-error .el-textarea__inner:focus,
111+
.el-message-box__input input.invalid:focus, .el-input__inner:focus,
112+
.el-pagination__sizes .el-input .el-input__inner:hover, .el-checkbox__inner:hover, .el-radio__inner:hover{
77113
border-color: @color-hover;
114+
}
115+
.el-pagination.is-background .el-pager li:not(.disabled).active,
116+
.el-radio-button__orig-radio:checked+.el-radio-button__inner{
78117
color: #fff;
79118
}
80-
}
119+
.el-input-group__append button.el-button, .el-input-group__append div.el-select .el-input__inner,
120+
.el-input-group__append div.el-select:hover .el-input__inner, .el-input-group__prepend button.el-button,
121+
.el-input-group__prepend div.el-select .el-input__inner, .el-input-group__prepend div.el-select:hover .el-input__inner {
122+
border-color: transparent;
123+
background-color: transparent;
124+
color: inherit;
125+
}
126+
.el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled){
127+
box-shadow: 0 0 2px 2px @color-hover;
128+
}
129+
.el-radio-button__orig-radio:checked+.el-radio-button__inner{
130+
box-shadow: 0px 0 0 0 @color;
131+
}
132+
.el-cascader__label:focus,.el-input-number__decrease:focus, .el-input-number__increase:focus,
133+
.el-breadcrumb__inner a, .el-breadcrumb__inner.is-link{
134+
outline-color: @color-hover;
135+
}
136+
.el-loading-spinner .path{
137+
stroke: @color;
138+
}
139+
.el-menu--horizontal>.el-menu-item.is-active{
140+
border-bottom-color: @color-hover;
141+
}
142+
}

src/views/common/login.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<div class="wrap">
33
<div class="login-title">
4-
<h1><span>校园</span> 管理平台</h1>
4+
<h1><span class="login-title-theme">校园</span> 管理平台</h1>
55
</div>
66
<div class="login-section">
77
<el-form ref="form" :rules="rules" :model="form" @keyup.enter.native="login">

src/views/common/router-tab.vue

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,6 @@ export default {
4545
},
4646
watch:{
4747
'$route'(to,from){
48-
console.log(this.$router);
49-
5048
// flag 判断路由是否已经tab打开
5149
let flag = false;
5250
for(let item of this.openTab){

src/views/demo/add-edit.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<el-dialog :title="form.id?'编辑':'新增'" v-if="visible" :visible="visible" :close-on-click-modal="false" width="40%" @close="close">
2+
<el-dialog class="t-dialog" :title="form.id?'编辑':'新增'" v-if="visible" :visible="visible" :close-on-click-modal="false" width="40%" @close="close">
33
<el-form class="t-form-block" ref="form" :model="form" :rules="rules" label-width="80px" size="small">
44
<el-form-item label="姓名:" prop="name">
55
<el-input v-model="form.name"></el-input>

src/views/demo/add.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
</el-col>
2222
</el-row>
2323
<el-form-item>
24-
<el-button type="theme" @click="save">保存</el-button>
24+
<el-button type="primary" @click="save">保存</el-button>
2525
</el-form-item>
2626
</el-form>
2727
</div>

src/views/demo/list.vue

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,8 @@
2424
<span>学生列表</span>
2525
<!-- 操作按钮 -->
2626
<div class="t-operate-buttons">
27-
<el-button type="theme" size="mini">导入</el-button>
28-
<el-button type="theme" size="mini" @click="addEdit()">新增</el-button>
27+
<el-button type="primary" size="mini">导入</el-button>
28+
<el-button type="primary" size="mini" @click="addEdit()">新增</el-button>
2929
</div>
3030
</div>
3131

@@ -49,7 +49,7 @@
4949
<!-- 批量操作 -->
5050
<div class="t-batch-operate">
5151
<el-checkbox v-model="isSelectAll" class="t-select-all" @change="selectAll()">全选</el-checkbox>
52-
<el-button type="theme" size="mini" :disabled="!this.multipleSelection.length">删除</el-button>
52+
<el-button type="primary" size="mini" :disabled="!this.multipleSelection.length">删除</el-button>
5353
</div>
5454

5555
<!-- 分页 -->
@@ -110,7 +110,6 @@ export default {
110110
this.addEditVisible = true;
111111
},
112112
addEditSave (form) {
113-
console.log(form)
114113
this.$message.success('保存成功');
115114
},
116115
/**

0 commit comments

Comments
 (0)