update

packages/artplayer/src/style/artplayer.less

@@ -0,0 +1,63 @@
+.art-video-player {
+    display: flex;
+    position: relative;
+    margin: 0 auto;
+    z-index: 20;
+    width: 100%;
+    height: 100%;
+    outline: 0;
+    zoom: 1;
+    font-family: Roboto, Arial, Helvetica, sans-serif;
+    color: #eee;
+    background-color: #000;
+    text-align: left;
+    direction: ltr;
+    font-size: 14px;
+    line-height: 1.3;
+    user-select: none;
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+    touch-action: manipulation;
+    -ms-high-contrast-adjust: none;
+
+    * {
+        margin: 0;
+        padding: 0;
+        box-sizing: border-box;
+    }
+
+    ::-webkit-scrollbar {
+        width: 5px;
+        height: 5px;
+    }
+
+    ::-webkit-scrollbar-thumb {
+        background-color: #666;
+    }
+
+    ::-webkit-scrollbar-thumb:hover {
+        background-color: #ccc;
+    }
+
+    .art-icon {
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        line-height: 1.5;
+        svg {
+            fill: #fff;
+        }
+    }
+
+    img {
+        max-width: 100%;
+        vertical-align: top;
+    }
+
+    @supports ((-webkit-backdrop-filter: initial) or (backdrop-filter: initial)) {
+        .art-backdrop-filter {
+            -webkit-backdrop-filter: saturate(180%) blur(20px);
+            backdrop-filter: saturate(180%) blur(20px);
+            background-color: rgba(0, 0, 0, 0.7) !important;
+        }
+    }
+}