Files
ArtPlayer/packages/artplayer-plugin-control/src/style.less
T
Harvey Zack 7b53de941d V5 (#500)
* update dep

* Update package.json

* update contextmenu

* update d.ts

* update onVttLoad

* build artplayer

* update style

* --art-theme

* update style

* update style

* update user-select

* add getIcon

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* update style

* add progress-hover

* update mini

* update style

* update style

* update style

* update style

* update style

* update volume

* update style

* add art-backdrop

* update style

* update style

* update style

* update currentLevel

* update artplayerPluginControl

* update artplayerPluginDanmuku

* Update package.json
2023-04-16 23:01:26 +08:00

102 lines
2.3 KiB
Plaintext

.artplayer-plugin-control {
.art-bottom {
display: flex;
align-items: center;
flex-direction: column;
justify-content: space-between;
position: absolute;
height: 68px;
width: 400px;
user-select: none;
border-radius: 10px;
left: 50%;
transform: translateX(-50%);
bottom: 10px !important;
font-size: 13px;
-webkit-backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px);
background-color: rgba(0, 0, 0, 0.7);
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.2), 0 4px 6px -4px rgb(0 0 0 / 0.2);
background-image: none;
pointer-events: auto;
padding: 13px 0 0;
.art-progress {
width: 65%;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
.art-control-thumbnails {
bottom: 25px;
}
.art-control-progress {
width: 100%;
.art-control-progress-inner,
.art-progress-loaded,
.art-progress-played {
border-radius: 5px;
}
}
.art-progress-tip {
top: -40px !important;
}
}
.art-controls {
width: 100%;
flex: 1;
.art-control-time,
.art-controls-center {
display: none;
}
}
.art-selector-list {
background-color: rgba(0, 0, 0, 0.8) !important;
}
.apa-control-current,
.apa-control-duration {
display: flex;
justify-content: center;
line-height: 1;
width: 17.5%;
position: absolute;
top: 10px;
}
.apa-control-current {
left: 0;
}
.apa-control-duration {
right: 0;
}
}
.art-settings {
bottom: 85px;
}
.art-layer-auto-playback {
bottom: 90px;
}
&.art-control-show {
.art-subtitle {
bottom: 80px;
}
}
}
.apa-control-current,
.apa-control-duration {
display: none;
}