x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-24 23:51:20 -08:00
Code Issues Packages Projects Releases Wiki Activity

update style

Browse Source
This commit is contained in:
Harvey Zack committed 2023-04-19 09:26:39 +08:00
1 parent 4848b9e48c
commit 89206e3924
7 files changed
+20 -15
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer/src/style/artplayer.less
+5 -4
View File
@@ -5,15 +5,17 @@
height: 100%;
outline: 0;
zoom: 1;
color: #fff;
padding: 0;
text-align: left;
direction: ltr;
font-size: 14px;
line-height: 1.3;
overflow: hidden;
user-select: none;
background-color: #000;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
box-sizing: border-box;
color: var(--art-font-color);
background-color: var(--art-background-color);
text-shadow: 0 0 2px var(--art-text-shadow-color);
font-family: PingFang SC, Helvetica Neue, Microsoft YaHei, Roboto, Arial, sans-serif;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-ms-touch-action: manipulation;
@@ -31,7 +33,6 @@
::-webkit-scrollbar {
width: var(--art-scrollbar-size);
height: var(--art-scrollbar-size);
border-radius: 3px;
}
::-webkit-scrollbar-thumb {
packages/artplayer/src/style/bottom.less
+4 -4
View File
@@ -1,16 +1,16 @@
.art-video-player {
.art-bottom {
.art-full(60);
top: auto;
display: flex;
flex-direction: column;
justify-content: end;
.art-full(60);
top: auto;
opacity: 0;
pointer-events: none;
gap: var(--art-bottom-gap);
bottom: var(--art-bottom-offset);
height: var(--art-bottom-height);
padding: 0 var(--art-player-padding);
opacity: 0;
pointer-events: none;
transition: all var(--art-transition-duration) ease;
.art-bottom-gradient();
}
packages/artplayer/src/style/fullscreenWeb.less
+1 -1
View File
@@ -1,3 +1,3 @@
.art-fullscreen-web {
.art-full(9999, fixed);
.art-full(var(--art-fullscreen-web-index), fixed);
}
packages/artplayer/src/style/mini.less
+1 -1
View File
@@ -9,7 +9,7 @@
user-select: none;
overflow: hidden;
transition: opacity 0.2s ease;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
svg {
fill: #fff;
packages/artplayer/src/style/variables.less
+5
View File
@@ -1,5 +1,8 @@
.art-video-player {
--art-theme: #f00;
--art-font-color: #fff;
--art-background-color: #000;
--art-text-shadow-color: rgba(0, 0, 0, 0.5);
--art-transition-duration: 0.2s;
--art-player-padding: 10px;
--art-state-size: 80px;
@@ -18,9 +21,11 @@
--art-control-icon-size: 36px;
--art-control-icon-scale: 1.1;
--art-settings-scale: 1;
--art-volume-height: 120px;
--art-volume-handle-size: 14px;
--art-lock-size: 36px;
--art-indicator-size: 16px;
--art-fullscreen-web-index: 9999;
--art-subtitle-border: #000;
--art-widget-background: rgba(0, 0, 0, 0.85);
--art-tip-background: rgba(0, 0, 0, 0.5);
packages/artplayer/src/style/volume.less
+3 -4
View File
@@ -6,9 +6,6 @@
position: absolute;
left: 0;
right: 0;
bottom: var(--art-control-height);
width: var(--art-control-height);
height: 120px;
padding: 0 5px;
font-size: 12px;
text-align: center;
@@ -16,6 +13,9 @@
opacity: 0;
transform: translateY(10px);
pointer-events: none;
bottom: var(--art-control-height);
width: var(--art-control-height);
height: var(--art-volume-height);
transition: all var(--art-transition-duration) ease;
.art-volume-inner {
@@ -25,7 +25,6 @@
gap: 10px;
height: 100%;
width: 100%;
padding: 10px 0 12px;
border-radius: 3px;
background-color: var(--art-widget-background);