add darkMode,edit at indexFund,fix bug

zhangpengblog · Sep 3, 2020 · 1e5465d · 1e5465d
1 parent bae9c8c
commit 1e5465d
Show file tree

Hide file tree

Showing 11 changed files with 647 additions and 212 deletions.
diff --git a/README.md b/README.md
@@ -20,6 +20,12 @@
 ![主界面2](https://raw.githubusercontent.com/x2rr/Picture/master/img/20200716181202.png)
 
 ## 更新说明
+### v1.7.0
+- 新增暗色模式主题。
+- 顶部指数信息支持动态修改。
+- 暂停实时更新功能改为全局生效。
+- 修复删除特别关注的基金后，脚本还实时更新的异常。
+
 ### v1.6.0
 - 解决基金添加后无法显示、基金丢失等异常问题。
 - 增加按类别排序功能。

diff --git a/edge.html b/edge.html
@@ -64,6 +64,13 @@ <h2>如何使用</h2>
             <img style="margin: 10px;" src="./image/2222.png" alt="主界面2">
         </div>
         <h2>更新说明</h2>
+        <h3>v1.7.0</h3>
+        <ul>
+            <li>新增暗色模式主题。</li>
+            <li>顶部指数信息支持动态修改。</li>
+            <li>暂停实时更新功能改为全局生效。</li>
+            <li>修复删除特别关注的基金后，脚本还实时更新的异常。</li>
+        </ul>
         <h3>v1.6.0</h3>
 
         <ul>

diff --git a/index.html b/index.html
@@ -72,21 +72,24 @@ <h2>如何使用</h2>
             <img src="./image/2222.png" alt="主界面2">
         </div>
         <h2>更新说明</h2>
+        <h3>v1.7.0</h3>
+        <ul>
+            <li>新增暗色模式主题。</li>
+            <li>顶部指数信息支持动态修改。</li>
+            <li>暂停实时更新功能改为全局生效。</li>
+            <li>修复删除特别关注的基金后，脚本还实时更新的异常。</li>
+        </ul>
         <h3>v1.6.0</h3>
-
         <ul>
             <li>解决基金添加后无法显示、基金丢失等异常问题。</li>
             <li>增加按类别排序功能。</li>
             <li>增加拖拽排序功能。</li>
             <li>添加基金时增加搜索与多选功能。</li>
         </ul>
-
         <h3>v1.5.6</h3>
-
         <ul>
             <li>修复不同时区的时间异常问题。</li>
         </ul>
-
         <h3>v1.5.5</h3>
 
         <ul>

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "choose-funds",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "A Vue.js web extension",
   "author": "Liu Rabt",
   "license": "GPL-3.0",

diff --git a/src/common/reward.vue b/src/common/reward.vue
@@ -1,22 +1,39 @@
 <template>
   <div v-if="rewardShadow" class="shadow">
-    <div class="reward-box" :style="{marginTop: top +'px'}">
+    <div class="reward-box" :style="{ marginTop: top + 'px' }">
       <div class="tab-row">
-        <button @click="checked = 'wepay'" :class="checked == 'wepay' ? 'checked' : ''">微信</button>
-        <button @click="checked = 'alipay'" :class="checked == 'alipay' ? 'checked' : ''">支付宝</button>
+        <button
+          @click="checked = 'wepay'"
+          :class="checked == 'wepay' ? 'checked' : ''"
+        >
+          微信
+        </button>
+        <button
+          @click="checked = 'alipay'"
+          :class="checked == 'alipay' ? 'checked' : ''"
+        >
+          支付宝
+        </button>
       </div>
       <div class="qrcode">
         <img
           :src="
-              checked == 'wepay'
-                ? './../icons/qrcode/wepay.png'
-                : './../icons/qrcode/alipay.png'
-            "
+            checked == 'wepay'
+              ? './../icons/qrcode/wepay.png'
+              : './../icons/qrcode/alipay.png'
+          "
         />
       </div>
-      <p class="tips reward-tips">感谢有您的支持，自选基金才能一直保持更新，增加更多功能。</p>
+      <p class="tips reward-tips">
+        感谢有您的支持，自选基金才能一直保持更新，增加更多功能。
+      </p>
       <div class="tab-row">
-        <input class="btn success" type="button" value="打赏好了" @click="close" />
+        <input
+          class="btn success"
+          type="button"
+          value="打赏好了"
+          @click="close"
+        />
         <input class="btn" type="button" value="下次一定" @click="close" />
       </div>
     </div>
@@ -27,13 +44,13 @@ export default {
   props: {
     top: {
       type: Number,
-      default: 0
-    }
+      default: 0,
+    },
   },
   data() {
     return {
       rewardShadow: false,
-      checked: "wepay"
+      checked: "wepay",
     };
   },
   mounted() {},
@@ -44,8 +61,8 @@ export default {
     close() {
       this.rewardShadow = false;
       this.$emit("close", false);
-    }
-  }
+    },
+  },
 };
 </script>
 
@@ -139,6 +156,7 @@ export default {
 
 .reward-tips {
   padding: 0 50px;
+  margin-top: 5px;
 }
 
 .btn {
@@ -158,4 +176,30 @@ export default {
   color: #4eb61b;
   border-color: #4eb61b;
 }
-</style>
+
+.darkMode .reward-box {
+  color: rgba($color: #ffffff, $alpha: 0.6);
+  background-color: #373737;
+  .btn {
+    background-color: rgba($color: #ffffff, $alpha: 0.16);
+    color: rgba($color: #ffffff, $alpha: 0.6);
+    border: 1px solid rgba($color: #ffffff, $alpha: 0.6);
+  }
+  .success {
+    border: 1px solid rgba($color: #4eb61b, $alpha: 0.6);
+    background-color: rgba($color: #4eb61b, $alpha: 0.6);
+  }
+
+  button {
+    background-color: rgba($color: #ffffff, $alpha: 0.16);
+    color: rgba($color: #ffffff, $alpha: 0.6);
+    border: 1px solid rgba($color: #ffffff, $alpha: 0.38);
+  }
+
+  button.checked {
+    color: rgba($color: #ffffff, $alpha: 0.6);
+    border: 1px solid rgba($color: #409eff, $alpha: 0.38);
+    background-color: rgba($color: #409eff, $alpha: 0.6);
+  }
+}
+</style>