From d64a834c7fab459cbe3a03b1c0de7a2dc8f84023 Mon Sep 17 00:00:00 2001
From: hunlongyu <hunlongyu@gmail.com>
Date: Fri, 17 Apr 2020 18:16:24 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=98=A5=20=E8=AE=BE=E7=BD=AE=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/scss/theme/light.scss | 19 ++++++++++++
 src/components/Detail.vue        |  8 ++---
 src/components/Setting.vue       | 53 ++++++++++++++++++++++++++++++--
 src/components/Share.vue         |  5 ++-
 src/locales/en.json              |  7 +++--
 src/locales/zh-cn.json           |  7 +++--
 6 files changed, 87 insertions(+), 12 deletions(-)

diff --git a/src/assets/scss/theme/light.scss b/src/assets/scss/theme/light.scss
index 7b65220..258ee8d 100644
--- a/src/assets/scss/theme/light.scss
+++ b/src/assets/scss/theme/light.scss
@@ -289,5 +289,24 @@
         }
       }
     }
+    .theme{
+      .title{
+        color: var(--l-fc-1);
+      }
+      .theme-item{
+        box-shadow: var(--l-bsc);
+        &:hover{
+          box-shadow: var(--l-bsc-hover);
+        }
+      }
+    }
+    .qrcode{
+      .title{
+        color: var(--l-fc-1);
+      }
+      .qrcode-item{
+        box-shadow: var(--l-bsc);
+      }
+    }
   }
 }
diff --git a/src/components/Detail.vue b/src/components/Detail.vue
index d1e60a7..ba67fe8 100644
--- a/src/components/Detail.vue
+++ b/src/components/Detail.vue
@@ -162,7 +162,7 @@ export default {
         justify-content: flex-start;
         align-items: flex-start;
         flex-wrap: wrap;
-        width: 1000px;
+        width: 955px;
         padding: 10px;
         border: 1px solid;
         border-radius: 2px;
@@ -254,7 +254,7 @@ export default {
       .desc{
         border: 1px solid;
         padding: 10px;
-        width: 1000px;
+        width: 955px;
         margin-bottom: 10px;
         border-radius: 2px;
         font-size: 14px;
@@ -263,7 +263,7 @@ export default {
       .m3u8_urls, .mp4_urls{
         border: 1px solid;
         padding: 10px;
-        width: 1000px;
+        width: 955px;
         margin-bottom: 10px;
         border-radius: 2px;
         .title{
@@ -279,7 +279,7 @@ export default {
             border: 1px solid;
             border-radius: 2px;
             cursor: pointer;
-            margin: 6px 10px 0px 0px;
+            margin: 6px 6px 0px 0px;
             padding: 8px 22px;
           }
           &::after {
diff --git a/src/components/Setting.vue b/src/components/Setting.vue
index f6997a5..1e9aa96 100644
--- a/src/components/Setting.vue
+++ b/src/components/Setting.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="setting" v-if="show.setting">
+  <div class="setting zy-scroll" v-if="show.setting">
     <div class="logo"><img src="@/assets/image/logo.png"></div>
     <div class="info"><a href="https://github.com/Hunlongyu/ZY-Player">{{$t('website')}}</a><a href="https://github.com/Hunlongyu/ZY-Player/issues">{{$t('issues')}}</a></div>
     <div class="change">
@@ -20,8 +20,20 @@
         </div>
       </div>
     </div>
-    <div class="theme">主题</div>
-    <div class="qrcode">喝咖啡</div>
+    <div class="theme">
+      <div class="title">{{$t('theme')}}</div>
+      <div class="theme-box">
+        <div class="theme-item light"></div>
+        <div class="theme-item dark"></div>
+      </div>
+    </div>
+    <div class="qrcode">
+      <div class="title">{{$t('donate')}}</div>
+      <div class="qrcode-box">
+        <div class="qrcode-item zfb"></div>
+        <div class="qrcode-item wx"></div>
+      </div>
+    </div>
   </div>
 </template>
 <script>
@@ -113,6 +125,7 @@ export default {
   display: flex;
   flex-direction: column;
   border-radius: 5px;
+  overflow-y: auto;
  .logo{
     margin-top: 40px;
     width: 100%;
@@ -142,5 +155,39 @@ export default {
       margin-right: 20px;
     }
   }
+  .theme{
+    width: 100%;
+    padding-left: 20px;
+    margin-top: 20px;
+    .theme-box{
+      display: flex;
+      justify-content: flex-start;
+      margin-top: 10px;
+      .theme-item{
+        width: 200px;
+        height: 200px;
+        margin-right: 20px;
+        cursor: pointer;
+        border-radius: 2px;
+      }
+    }
+  }
+  .qrcode{
+    width: 100%;
+    padding-left: 20px;
+    margin-top: 20px;
+    margin-bottom: 20px;
+    .qrcode-box{
+      display: flex;
+      justify-content: flex-start;
+      margin-top: 10px;
+      .qrcode-item{
+        width: 200px;
+        height: 200px;
+        margin-right: 20px;
+        border-radius: 2px;
+      }
+    }
+  }
 }
 </style>
diff --git a/src/components/Share.vue b/src/components/Share.vue
index 03c07e9..8ec3520 100644
--- a/src/components/Share.vue
+++ b/src/components/Share.vue
@@ -68,6 +68,9 @@ export default {
         const img = html.querySelector('img').src
         this.card.img = img
         this.card.name = this.share.v.name
+        const urls = res.m3u8_urls
+        const url = urls[this.share.v.index].split('$')[1]
+        this.value = 'http://m3u8.hunlongyu.fun/?url=' + url + '&title=' + this.share.v.name
         this.loading = false
         this.$nextTick(() => {
           const dom = document.getElementById('share')
@@ -75,7 +78,7 @@ export default {
             const png = res.toDataURL('image/png')
             const p = nativeImage.createFromDataURL(png)
             clipboard.writeImage(p)
-            this.$message.success('已复制到剪贴板中, 快去分享吧~')
+            this.$message.success(this.$t('share_tips'))
             this.share.show = true
           })
         })
diff --git a/src/locales/en.json b/src/locales/en.json
index 40814fc..d3dbd83 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -27,10 +27,13 @@
     "total": "Items",
     "website": "Official Website",
     "issues": "Issues",
+    "theme": "Theme",
+    "donate": "Donate",
     "set_success": "Set up successfully.",
     "delete_success": "Delete successful.",
     "star_success": "Collection success.",
     "last_video": "This is the last episode.",
-    "qr_tips": "Long press the QR code to recognize the playback.",
-    "zy_tips": "Prohibit the dissemination of illegal resources."
+    "qr_tips": "Long click recognition.",
+    "zy_tips": "Prohibit the dissemination of illegal resources.",
+    "share_tips": "It has been copied to the clipboard. Please share it~"
 }
diff --git a/src/locales/zh-cn.json b/src/locales/zh-cn.json
index b36f8fa..341d403 100644
--- a/src/locales/zh-cn.json
+++ b/src/locales/zh-cn.json
@@ -1,6 +1,6 @@
 {
     "zh": "中文",
-    "en": "English",
+    "en": "英文",
     "language": "语言",
     "default_site": "默认源",
     "view": "浏览",
@@ -27,10 +27,13 @@
     "total": "条数据",
     "website": "官网",
     "issues": "反馈",
+    "theme": "主题",
+    "donate": "捐赠",
     "set_success": "设置成功。",
     "delete_success": "删除成功。",
     "star_success": "收藏成功。",
     "last_video": "这已经是最后一集了。",
     "qr_tips": "长按二维码，识别播放。",
-    "zy_tips": "『ZY Player』技术支持，严禁传播违法资源。"
+    "zy_tips": "『ZY Player』技术支持，严禁传播违法资源。",
+    "share_tips": "已复制到剪贴板，快去分享吧~"
 }