mirror of
https://github.com/cuiocean/ZY-Player.git
synced 2026-02-07 20:53:25 +08:00
😡 解决冲突
This commit is contained in:
BIN
src/assets/image/green.png
Normal file
BIN
src/assets/image/green.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
@@ -34,9 +34,28 @@
|
||||
--d-bsc-2: 0 -4px 23px 0 #38dd7733;
|
||||
--d-bsc-hover: 0 14px 26px -12px #38dd7733, 0 4px 23px 0 #38dd7722, 0 8px 10px -5px #38dd7711;
|
||||
--d-bsc-scroll: inset 0 0 5px #38dd7705;
|
||||
|
||||
// green
|
||||
--g-c-0: #EAEF9D;
|
||||
--g-c-1: #EAEF9D11;
|
||||
--g-c-2: #EAEF9D22;
|
||||
--g-c-3: #EAEF9D33;
|
||||
--g-c-5: #EAEF9D55;
|
||||
--g-c-8: #EAEF9D88;
|
||||
--g-c-9: #EAEF9D99;
|
||||
--g-fc-1: #80B155;
|
||||
--g-fc-2: #C1D95CAA;
|
||||
--g-fc-3: #C1D95C;
|
||||
--g-bgc-1: #336A29;
|
||||
--g-bgc-2: #498428;
|
||||
--g-bsc: 0 3px 1px -2px #C1D95C33, 0 2px 2px 0 #C1D95C22, 0 1px 5px 0 #C1D95C11;
|
||||
--g-bsc-2: 0 -4px 23px 0 #C1D95C33;
|
||||
--g-bsc-hover: 0 14px 26px -12px #C1D95C33, 0 4px 23px 0 #C1D95C22, 0 8px 10px -5px #C1D95C11;
|
||||
--g-bsc-scroll: inset 0 0 5px #C1D95C05;
|
||||
}
|
||||
|
||||
@import './theme/light.scss';
|
||||
@import './theme/dark.scss';
|
||||
@import './theme/green.scss';
|
||||
|
||||
@import './style.scss';
|
||||
|
||||
349
src/assets/scss/theme/green.scss
Normal file
349
src/assets/scss/theme/green.scss
Normal file
@@ -0,0 +1,349 @@
|
||||
.theme-green{
|
||||
background-color: var(--g-bgc-1);
|
||||
.xgplayer-skin-default video{
|
||||
background-color: var(--g-bgc-2);
|
||||
}
|
||||
.el-pagination{
|
||||
background-color: var(--g-bgc-1);
|
||||
color: var(--g-fc-1);
|
||||
.el-pagination__total, .el-pagination__jump, .el-input__inner{
|
||||
color: var(--g-fc-1);
|
||||
background-color: var(--g-bgc-1);
|
||||
}
|
||||
.el-input__inner{
|
||||
border-color: var(--g-c-3);
|
||||
}
|
||||
.el-pager{
|
||||
.number{
|
||||
background-color: var(--g-bgc-1);
|
||||
}
|
||||
.number:hover{
|
||||
color: var(--g-c-8);
|
||||
}
|
||||
.active{
|
||||
color: var(--g-c-9);
|
||||
}
|
||||
}
|
||||
.more, .btn-next, .btn-prev{
|
||||
background-color: var(--g-bgc-1);
|
||||
&:hover{
|
||||
color: var(--g-c-8);
|
||||
}
|
||||
}
|
||||
}
|
||||
.zy-select{
|
||||
color: var(--g-fc-1);
|
||||
background-color: var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc);
|
||||
&:hover{
|
||||
box-shadow: var(--g-bsc-hover);
|
||||
}
|
||||
.vs-options{
|
||||
background-color: var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc);
|
||||
ul{
|
||||
li{
|
||||
&:hover{
|
||||
background-color: var(--g-c-1);
|
||||
}
|
||||
&.active{
|
||||
background-color: var(--g-c-3);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.zy-table{
|
||||
color: var(--g-fc-2);
|
||||
.tHead{
|
||||
background-color: var(--g-bgc-1);
|
||||
border-bottom-color: var(--g-c-3);
|
||||
}
|
||||
.tBody{
|
||||
border-bottom-color: var(--g-c-3);
|
||||
ul{
|
||||
li{
|
||||
border-bottom-color: var(--g-c-2);
|
||||
&:hover{
|
||||
animation: d-tableHoverAni 0.2s ease both;
|
||||
@keyframes d-tableHoverAni {
|
||||
to{
|
||||
box-shadow: var(--g-bsc-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
span{
|
||||
&.btn:hover{
|
||||
color: var(--g-fc-3)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tFooter{
|
||||
.tFooter-span{
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.zy-scroll{
|
||||
&:hover{
|
||||
&::-webkit-scrollbar-thumb {
|
||||
box-shadow: var(--g-bsc-scroll);
|
||||
background: var(--g-c-3);
|
||||
}
|
||||
&::-webkit-scrollbar-track {
|
||||
box-shadow: var(--g-bsc-scroll);
|
||||
background: var(--bgc);
|
||||
}
|
||||
}
|
||||
}
|
||||
.zy-loading{
|
||||
.loader{
|
||||
color: var(--g-c-3);
|
||||
}
|
||||
}
|
||||
.zy-body{
|
||||
background-color: var(--g-bgc-2);
|
||||
}
|
||||
.aside{
|
||||
.zy-svg{
|
||||
svg{
|
||||
stroke: var(--g-c-0);
|
||||
}
|
||||
&:hover{
|
||||
background-color: var(--g-c-2);
|
||||
}
|
||||
&.active{
|
||||
svg{
|
||||
stroke: var(--g-c-0);
|
||||
stroke-width: 2;
|
||||
fill: var(--g-c-2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.frame{
|
||||
span{
|
||||
&.min{
|
||||
background-color: #ffbe2a;
|
||||
}
|
||||
&.close{
|
||||
background-color: #ff5f56;
|
||||
}
|
||||
}
|
||||
}
|
||||
.detail{
|
||||
color: var(--g-fc-1);
|
||||
background-color:var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc-2);
|
||||
.detail-content{
|
||||
.detail-close{
|
||||
svg{
|
||||
stroke-width: 1;
|
||||
stroke: var(--g-c-8);
|
||||
&:hover{
|
||||
stroke-width: 2px;
|
||||
stroke: var(--g-c-9);
|
||||
}
|
||||
}
|
||||
}
|
||||
.detail-body{
|
||||
.info, .desc, .m3u8_urls, .mp4_urls{
|
||||
border-color: var(--g-c-2);
|
||||
}
|
||||
.m3u8_urls, .mp4_urls{
|
||||
.box{
|
||||
span{
|
||||
border-color: var(--g-c-5);
|
||||
&:hover{
|
||||
color: var(--g-fc-2);
|
||||
background-color: var(--g-c-1);
|
||||
border-color: var(--g-c-8);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.film{
|
||||
.top{
|
||||
.search{
|
||||
background-color: var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc);
|
||||
&:hover{
|
||||
box-shadow: var(--g-bsc-hover);
|
||||
}
|
||||
svg{
|
||||
stroke: var(--g-c-0);
|
||||
stroke-width: 1;
|
||||
fill: none;
|
||||
}
|
||||
.search-box{
|
||||
background-color: var(--g-bgc-1);
|
||||
}
|
||||
&.active{
|
||||
box-shadow: var(--g-bsc-hover);
|
||||
svg{
|
||||
stroke-width: 1.5;
|
||||
fill: var(--g-c-2);
|
||||
}
|
||||
}
|
||||
input{
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.middle{
|
||||
background-color: var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc);
|
||||
}
|
||||
}
|
||||
.play{
|
||||
background-color: var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc);
|
||||
.title{
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
.box{
|
||||
.more{
|
||||
span{
|
||||
svg{
|
||||
stroke: var(--g-c-5);
|
||||
stroke-width: 1;
|
||||
fill: none;
|
||||
}
|
||||
&:hover{
|
||||
svg{
|
||||
stroke: var(--g-c-8);
|
||||
stroke-width: 1.5;
|
||||
fill: var(--g-c-2);
|
||||
}
|
||||
}
|
||||
&.active{
|
||||
svg{
|
||||
stroke: var(--g-c-9);
|
||||
stroke-width: 2;
|
||||
fill: var(--g-c-3);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.list{
|
||||
border: 1px solid var(--g-c-3);
|
||||
background-color: var(--g-bgc-2);
|
||||
.list-top{
|
||||
color: var(--g-fc-2);
|
||||
.list-top-close{
|
||||
svg{
|
||||
stroke: var(--g-c-5);
|
||||
stroke-width: 1;
|
||||
fill: none;
|
||||
&:hover{
|
||||
stroke: var(--g-c-8);
|
||||
stroke-width: 1.5;
|
||||
fill: var(--g-c-2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-body{
|
||||
.list-item{
|
||||
li{
|
||||
color: var(--g-fc-1);
|
||||
&.active{
|
||||
background-color: var(--g-c-2);
|
||||
color: var(--g-fc-3);
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-history{
|
||||
li{
|
||||
.title{
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
&.active{
|
||||
background-color: var(--g-c-2);
|
||||
.title{
|
||||
color: var(--g-fc-3);
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
background-color: var(--g-c-3);
|
||||
.detail-delete{
|
||||
display: inline-block;
|
||||
color: var(--g-fc-2);
|
||||
}
|
||||
}
|
||||
.detail-delete{
|
||||
&:hover{
|
||||
background-color: var(--g-c-2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.play-mask{
|
||||
background-color: var(--g-bgc-1);
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
}
|
||||
.star{
|
||||
background-color: var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc);
|
||||
}
|
||||
.setting{
|
||||
background-color: var(--g-bgc-1);
|
||||
box-shadow: var(--g-bsc);
|
||||
.info{
|
||||
a{
|
||||
color: var(--g-fc-1);
|
||||
&:hover{
|
||||
color: var(--g-fc-2);
|
||||
}
|
||||
}
|
||||
}
|
||||
.theme{
|
||||
.title{
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
.theme-item{
|
||||
box-shadow: var(--g-bsc);
|
||||
&:hover{
|
||||
box-shadow: var(--g-bsc-hover);
|
||||
.theme-name{
|
||||
color: var(--g-fc-2)
|
||||
}
|
||||
}
|
||||
.theme-name{
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.qrcode{
|
||||
.title{
|
||||
color: var(--g-fc-1);
|
||||
}
|
||||
.qrcode-item{
|
||||
box-shadow: var(--g-bsc);
|
||||
}
|
||||
}
|
||||
}
|
||||
.share{
|
||||
background-color: var(--g-bgc-1);
|
||||
color: var(--g-fc-1);
|
||||
border: 1px solid var(--g-c-8);
|
||||
.right{
|
||||
color: var(--g-fc-1);
|
||||
.tops{
|
||||
color: var(--g-fc-2);
|
||||
}
|
||||
}
|
||||
.share-mask{
|
||||
background-color: var(--g-bgc-1);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -228,6 +228,7 @@ export default {
|
||||
this.onPlayVideo()
|
||||
this.xg.once('ended', () => {
|
||||
if (res.m3u8_urls.length > 1 && (res.m3u8_urls.length - 1 > this.video.index)) {
|
||||
this.video.currentTime = 0
|
||||
this.video.index++
|
||||
}
|
||||
this.xg.off('ended')
|
||||
|
||||
@@ -2,7 +2,10 @@
|
||||
<div class="setting">
|
||||
<div class="setting-box zy-scroll" v-if="show.setting">
|
||||
<div class="logo"><img src="@/assets/image/logo.png"></div>
|
||||
<div class="info"><a href="https://github.com/Hunlongyu/ZY-Player">{{$t('website')}}</a><a href="https://github.com/Hunlongyu/ZY-Player/issues/24">{{$t('issues')}}</a></div>
|
||||
<div class="info">
|
||||
<a @click="linkOpen('https://github.com/Hunlongyu/ZY-Player')">{{$t('website')}}</a>
|
||||
<a @click="linkOpen('https://github.com/Hunlongyu/ZY-Player/issues')">{{$t('issues')}}</a>
|
||||
</div>
|
||||
<div class="change">
|
||||
<div class="zy-select" @mouseleave="show.language = false">
|
||||
<div class="vs-placeholder" @click="show.language = true">{{$t('language')}}</div>
|
||||
@@ -36,6 +39,12 @@
|
||||
</div>
|
||||
<div class="theme-name">Dark</div>
|
||||
</div>
|
||||
<div @click="changeTheme('green')" class="theme-item green">
|
||||
<div class="theme-image">
|
||||
<img src="../assets/image/green.png" alt="">
|
||||
</div>
|
||||
<div class="theme-name">Green</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="qrcode">
|
||||
@@ -53,6 +62,7 @@ import { mapMutations } from 'vuex'
|
||||
import setting from '../lib/dexie/setting'
|
||||
import { sites } from '../lib/site/sites'
|
||||
import '../lib/cloud/index.js'
|
||||
import { shell } from 'electron'
|
||||
export default {
|
||||
name: 'setting',
|
||||
data () {
|
||||
@@ -104,6 +114,9 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['SET_THEME', 'SET_LANGUAGE', 'SET_SITE']),
|
||||
linkOpen (e) {
|
||||
shell.openExternal(e)
|
||||
},
|
||||
languageClick (e) {
|
||||
this.language = e
|
||||
this.show.language = false
|
||||
@@ -169,6 +182,7 @@ export default {
|
||||
text-decoration: none;
|
||||
margin: 0 10px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.change{
|
||||
|
||||
Reference in New Issue
Block a user