引入样式文件

修改主题配置文件

1
2
3
4
5
6
inject:
  head:
    - <script src="https://unpkg.com/vue@2.7.13/dist/vue.min.js"></script>
    - <script src="https://unpkg.com/element-ui@2.15.10/lib/index.js"></script>
    - <link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.10/packages/theme-chalk/lib/index.css">
  bottom:

修改文件

这里主要修改三个js文件utils.js、main.js和tw_cn.js

utils.js

打开[Blogroot]\themes\butterfly\source\js\utils.js，修改以下内容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
-  snackbarShow: (text, showAction = false, duration = 2000) => {
-    const { position, bgLight, bgDark } = GLOBAL_CONFIG.Snackbar
-    const bg = document.documentElement.getAttribute('data-theme') === 'light' ? bgLight : bgDark
-    Snackbar.show({
-      text: text,
-      backgroundColor: bg,
-      showAction: showAction,
-      duration: duration,
-      pos: position,
-      customClass: 'snackbar-css'
-    })
-  },
+  snackbarShow: (title, message, type, offset = 50, showClose = false) => {
+    const { position } = GLOBAL_CONFIG.Snackbar
+    new Vue({
+      data: function () {
+          this.$notify({
+              title: title,
+              message: message,
+              position: position,
+              offset: offset,
+              showClose: showClose,
+              type: type
+          });
+          return { visible: false }
+      }
+    })
+  },

main.js

打开[Blogroot]\themes\butterfly\source\js\main.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
        if (GLOBAL_CONFIG.Snackbar !== undefined) {
-          btf.snackbarShow(GLOBAL_CONFIG.copy.success)
+          btf.snackbarShow(GLOBAL_CONFIG.copy.success,"如转载请注明出处！","success")
        } else {
          const prevEle = ctx.previousElementSibling
          prevEle.innerText = GLOBAL_CONFIG.copy.success
          prevEle.style.opacity = 1
          setTimeout(() => { prevEle.style.opacity = 0 }, 700)
      } else {
        if (GLOBAL_CONFIG.Snackbar !== undefined) {
-          btf.snackbarShow(GLOBAL_CONFIG.copy.noSupport)
+          btf.snackbarShow(GLOBAL_CONFIG.copy.noSupport,"请更换浏览器重试！","error")
        } else {
          ctx.previousElementSibling.innerText = GLOBAL_CONFIG.copy.noSupport
        }
······
      if (nowMode === 'light') {
        activateDarkMode()
        saveToLocal.set('theme', 'dark', 2)
-        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
+        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow("效果已切换",GLOBAL_CONFIG.Snackbar.day_to_night,"success")
      } else {
        activateLightMode()
        saveToLocal.set('theme', 'light', 2)
-        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
+        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow("效果已切换",GLOBAL_CONFIG.Snackbar.night_to_day,"success")
      }

tw_cn.js

打开[Blogroot]\themes\butterfly\source\js\tw_cn.js

1
2
3
4
5
6
7
8
9
10
11
12
      translateBody()
-      if (isSnackbar) btf.snackbarShow(snackbarData.cht_to_chs)
+      if (isSnackbar) btf.snackbarShow("语言切换成功",snackbarData.cht_to_chs,"success")
    } else if (targetEncoding === 2) {
      currentEncoding = 2
      targetEncoding = 1
      translateButtonObject.innerHTML = msgToSimplifiedChinese
      saveToLocal.set(targetEncodingCookie, targetEncoding, 2)
      translateBody()
-      if (isSnackbar) btf.snackbarShow(snackbarData.chs_to_cht)
+      if (isSnackbar) btf.snackbarShow("語言切換成功",snackbarData.chs_to_cht,"success")
    }