backup/ZY-Player
1
0
Fork 0
mirror of https://github.com/cuiocean/ZY-Player.git synced 2026-05-05 16:03:29 +08:00
Code Issues Projects Releases Wiki Activity

设置不同主题下的工具栏样式

Browse Source
This commit is contained in:
haiyangcui
2020-12-18 22:11:18 +01:00
parent f2f58fb888
commit 1ee7c6f032
5 changed files with 53 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/assets/scss/theme/dark.scss
View File

@@ -319,6 +319,19 @@
// Page of list using table and picture
.listpage{
color: var(--d-fc-2);
.listpage-header-divider{
background-color: var(--d-bgc-1);
.el-divider__text {
background-color: var(--d-bgc-2);
}
.el-button{
background-color: var(--d-bgc-2);
color: var(--d-fc-2);
&:hover{
color: var(--d-fc-3)
}
}
}
.listpage-header, .toolbar{
border-bottom-color: var(--d-c-3);
.btn{

13
src/assets/scss/theme/green.scss
View File

@@ -319,6 +319,19 @@
// Page of list using table and picture
.listpage{
color: var(--g-fc-2);
.listpage-header-divider{
background-color: var(--g-bgc-1);
.el-divider__text {
background-color: var(--g-bgc-2);
}
.el-button{
background-color: var(--g-bgc-2);
color: var(--g-fc-2);
&:hover{
color: var(--g-fc-3)
}
}
}
.listpage-header, .toolbar{
border-bottom-color: var(--g-c-3);
.btn{

13
src/assets/scss/theme/light.scss
View File

@@ -319,6 +319,19 @@
// Page of list using table and picture
.listpage{
color: var(--l-fc-2);
.listpage-header-divider{
background-color: var(--l-bgc-1);
.el-divider__text {
background-color: var(--l-bgc-2);
}
.el-button{
background-color: var(--l-bgc-2);
color: var(--l-fc-2);
&:hover{
color: var(--l-fc-3)
}
}
}
.listpage-header, .toolbar{
border-bottom-color: var(--l-c-3);
.btn{

13
src/assets/scss/theme/pink.scss
View File

@@ -319,6 +319,19 @@
// Page of list using table and picture
.listpage{
color: var(--p-fc-2);
.listpage-header-divider{
background-color: var(--p-bgc-1);
.el-divider__text {
background-color: var(--p-bgc-2);
}
.el-button{
background-color: var(--p-bgc-2);
color: var(--p-fc-2);
&:hover{
color: var(--p-fc-3)
}
}
}
.listpage-header, .toolbar{
border-bottom-color: var(--p-c-3);
.btn{

2
src/components/Film.vue
View File

@@ -78,7 +78,7 @@
<el-input-number size="small" v-model="selectedYears.end" :min=0 :max="new Date().getFullYear()" controls-position="right" step-strictly @change="refreshFilteredList"></el-input-number>
</span>
</div>
<el-divider content-position="center">
<el-divider class="listpage-header-divider" content-position="center">
<el-button type="text" size="mini" @click="toggleViewMode">视图切换</el-button>
<el-button type="text" size="mini" @click='() => { showToolbar = !showToolbar; if (!showToolbar) this.refreshFilteredList() }' title="收起工具栏会重置筛选排序">{{ showToolbar ? '隐藏工具栏' : '显示工具栏' }}</el-button>
<el-button type="text" size="mini" @click="backTop">回到顶部</el-button>