🎋 大部分样式完成

This commit is contained in:
hunlongyu
2020-04-17 00:00:23 +08:00
parent 8e380b6463
commit 5bf514ffcc
12 changed files with 266 additions and 209 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.7 KiB

After

Width:  |  Height:  |  Size: 20 KiB

View File

@@ -4,6 +4,7 @@
--l-c-1: #823aa011;
--l-c-2: #823aa022;
--l-c-3: #823aa033;
--l-c-5: #823aa055;
--l-c-8: #823aa088;
--l-c-9: #823aa099;
--l-fc-1: #808695;
@@ -12,6 +13,7 @@
--l-bgc-1: #ffffff;
--l-bgc-2: #f2f6f9;
--l-bsc: 0 3px 1px -2px #8e8da233, 0 2px 2px 0 #8e8da224, 0 1px 5px 0 #8e8da21f;
--l-bsc-2: 0 -4px 23px 0 #8e8da233;
--l-bsc-hover: 0 14px 26px -12px #8e8da26b, 0 4px 23px 0 #8e8da21f, 0 8px 10px -5px #8e8da233;
--l-bsc-scroll: inset 0 0 5px #823aa005;
}

View File

@@ -123,6 +123,40 @@
}
}
}
.detail{
color: var(--l-fc-1);
background-color:var(--l-bgc-1);
box-shadow: var(--l-bsc-2);
.detail-content{
.detail-close{
svg{
stroke-width: 1;
stroke: var(--l-c-8);
&:hover{
stroke-width: 2px;
stroke: var(--l-c-9);
}
}
}
.detail-body{
.info, .desc, .m3u8_urls, .mp4_urls{
border-color: var(--l-c-2);
}
.m3u8_urls, .mp4_urls{
.box{
span{
border-color: var(--l-c-5);
&:hover{
color: var(--l-fc-2);
background-color: var(--l-c-1);
border-color: var(--l-c-8);
}
}
}
}
}
}
}
.film{
.top{
.search{
@@ -151,5 +185,109 @@
}
}
}
.middle{
background-color: var(--l-bgc-1);
box-shadow: var(--l-bsc);
}
}
.play{
background-color: var(--l-bgc-1);
box-shadow: var(--l-bsc);
.box{
.more{
span{
svg{
stroke: var(--l-c-5);
stroke-width: 1;
fill: none;
}
&:hover{
svg{
stroke: var(--l-c-8);
stroke-width: 1.5;
fill: var(--l-c-2);
}
}
&.active{
svg{
stroke: var(--l-c-9);
stroke-width: 2;
fill: var(--l-c-3);
}
}
}
}
}
.list{
border: 1px solid var(--l-c-3);
background-color: var(--l-bgc-2);
.list-top{
color: var(--l-fc-2);
.list-top-close{
svg{
stroke: var(--l-c-5);
stroke-width: 1;
fill: none;
&:hover{
stroke: var(--l-c-8);
stroke-width: 1.5;
fill: var(--l-c-2);
}
}
}
}
.list-body{
.list-item{
li{
color: var(--l-fc-1);
&.active{
background-color: var(--l-c-2);
color: var(--l-fc-3);
}
}
}
.list-history{
li{
.title{
color: var(--l-fc-1);
}
&.active{
background-color: var(--l-c-2);
.title{
color: var(--l-fc-3);
}
}
&:hover{
background-color: var(--l-c-3);
.detail-delete{
display: inline-block;
color: var(--l-fc-2);
}
}
.detail-delete{
&:hover{
background-color: var(--l-c-2);
}
}
}
}
}
}
}
.star{
background-color: var(--l-bgc-1);
box-shadow: var(--l-bsc);
}
.setting{
background-color: var(--l-bgc-1);
box-shadow: var(--l-bsc);
.info{
a{
color: var(--l-fc-1);
&:hover{
color: var(--l-fc-2);
}
}
}
}
}