style: share popup

src/index/App.vue

@@ -3,5 +3,5 @@
 </template>
 
 <style lang="scss">
-@use "./app.scss";
+  @use './app.scss';
 </style>

src/index/views/home/components/menu/index.scss

@@ -73,24 +73,6 @@
   }
 }
 
-#volume > a,
-#gui-fullscreen > a {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-}
-
-.icon-fullscreen:before {
-  content: '';
-  background: url('/images/enlarge_on.png') center top no-repeat;
-  background-size: 100%;
-  display: inline-block;
-  width: 24px;
-  height: 24px;
-}
-
 @media only screen and (max-width: 600px) {
   .pinBottom-container {
     bottom: 5px;

src/index/views/home/components/menu/index.tsx

@@ -89,7 +89,7 @@ export default defineComponent({
             title="{[{ VIEW_FULLSCREEN }]}"
           >
             <a>
-              <i class="icon icon-fullscreen"></i>
+              <img class="icon icon-fullscreen" src="images/enlarge_on.png" />
             </a>
           </div>
           <div
@@ -100,7 +100,7 @@ export default defineComponent({
             style="display: none;"
           >
             <a>
-              <i class="icon icon-fullscreen-exit"></i>
+              <img class="icon icon-fullscreen-exit" src="images/narrow_off.png" />
             </a>
           </div>
         </div>

src/index/views/home/components/share-popup/index.vue

@@ -77,13 +77,14 @@
     --el-dialog-border-radius: 0;
     --el-dialog-title-font-size: 24px;
     height: 580px;
-    background: url('./images/bg-share-min.jpg') no-repeat center / contain;
+    background: rgba(0, 0, 0, 0.7);
+    backdrop-filter: blur(4px);
 
     .el-dialog__header {
       padding: 50px 40px;
     }
     .el-dialog__title {
-      color: #f5dd8c;
+      color: white;
       font-weight: 700;
     }
     .el-dialog__body {
@@ -116,9 +117,9 @@
       height: 50px;
       line-height: 50px;
       text-align: center;
-      color: #9d222d;
+      color: white;
       font-size: 20px;
-      background: #f5dd8c;
+      background: var(--el-color-primary);
       border-radius: 100px;
       cursor: pointer;
     }
@@ -138,7 +139,7 @@
       height: 433px;
 
       .el-dialog__header {
-        padding: 30px;
+        padding: 10px 30px 30px;
       }
       .el-dialog__body {
         padding: 0 30px;