feat: add color var

and remove access number in list page

Author: reco_luan

components/HomeBlog.vue

@@ -37,7 +37,6 @@
           <!-- 博客列表 -->
           <note-abstract
             :data="$recoPosts"
-            :hideAccessNumber="true"
             :currentPage="currentPage"></note-abstract>
           <!-- 分页 -->
           <pagation

components/Mode/modeOptions.js

@@ -5,7 +5,6 @@ const modeOptions = {
     '--box-shadow-hover': '0 2px 16px 0 rgba(0, 0, 0, 0.2)',
     '--text-color': '#2c3e50',
     '--border-color': '#eaecef',
-    '--bgm-bg-color': 'rgba(255, 255, 255, .7)',
     '--code-color': 'rgba(27, 31, 35, 0.05)',
     '--mask-color': '#888'
   },
@@ -15,7 +14,6 @@ const modeOptions = {
     '--box-shadow-hover': '0 2px 26px 0 rgba(0, 0, 0, .9)',
     '--text-color': '#aaa',
     '--border-color': 'rgba(0, 0, 0, .3)',
-    '--bgm-bg-color': 'rgba(0, 0, 0, .7)',
     '--code-color': 'rgba(0, 0, 0, .3)',
     '--mask-color': '#000'
   }

components/NoteAbstract.vue

@@ -1,12 +1,11 @@
 <template>
   <div class="abstract-wrapper">
     <NoteAbstractItem
-        v-for="(item) in currentPageData"
-        :key="item.path"
-        :item="item"
-        :currentPage="currentPage"
-        :currentTag="currentTag"
-        :hideAccessNumber="true" />
+      v-for="(item) in currentPageData"
+      :key="item.path"
+      :item="item"
+      :currentPage="currentPage"
+      :currentTag="currentTag" />
   </div>
 </template>
 
@@ -15,7 +14,7 @@ import NoteAbstractItem from './NoteAbstractItem'
 
 export default {
   components: { NoteAbstractItem },
-  props: ['data', 'currentPage', 'currentTag', 'hideAccessNumber'],
+  props: ['data', 'currentPage', 'currentTag'],
   computed: {
     currentPageData () {
       const start = this.currentPage * 10 - 10

components/NoteAbstractItem.vue

@@ -10,7 +10,6 @@
     <hr class="hr">
     <PageInfo
       :pageInfo="item"
-      :hideAccessNumber="!(hideAccessNumber !== true)"
       :currentTag="currentTag">
     </PageInfo>
   </div>
@@ -20,7 +19,7 @@
 import PageInfo from './PageInfo'
 export default {
   components: { PageInfo },
-  props: ['item', 'currentPage', 'currentTag', 'hideAccessNumber']
+  props: ['item', 'currentPage', 'currentTag']
 }
 </script>
 

components/Page.vue

@@ -8,7 +8,7 @@
       <div v-show="recoShowModule" class="page-title">
         <h1>{{$page.title}}</h1>
         <hr>
-        <PageInfo :pageInfo="$page" :hideAccessNumber="hideAccessNumber"></PageInfo>
+        <PageInfo :pageInfo="$page" :showAccessNumber="true"></PageInfo>
       </div>
     </ModuleTransition>
 
@@ -98,14 +98,6 @@ export default {
   },
 
   computed: {
-    hideAccessNumber () {
-      const valineConfig = this.$themeConfig.valineConfig
-      if (valineConfig) {
-        return false
-      } else {
-        return true
-      }
-    },
     lastUpdated () {
       return this.$page.lastUpdated
     },

components/PageInfo.vue

@@ -11,7 +11,7 @@
       <span>{{ pageInfo.frontmatter.date | formatDateValue }}</span>
     </i>
     <i
-      v-if="hideAccessNumber !== true"
+      v-if="showAccessNumber === true"
       class="iconfont reco-eye">
       <AccessNumber
         :idVal="pageInfo.path"
@@ -37,7 +37,6 @@
 import { formatDate } from '@theme/helpers/utils'
 
 export default {
-  // props: ['pageInfo', 'currentTag'],
   props: {
     pageInfo: {
       type: Object,
@@ -49,7 +48,7 @@ export default {
       type: String,
       default: ''
     },
-    hideAccessNumber: {
+    showAccessNumber: {
       type: Boolean,
       default: false
     }

example/docs/.vuepress/config.js

@@ -59,26 +59,6 @@ module.exports = {
     //   color: '#42b983',
     //   lineColor: '#42b983'
     // },
-
-    /**
-     * valine 设置 (if you need valine comment )
-     */
-
-    // valineConfig: {
-    //   appId: '...',// your appId
-    //   appKey: '...', // your appKey
-    // }
-    vssueConfig: {
-      admins: ['recoluan'],
-      platform: 'github',
-      owner: 'vuepress-reco',
-      repo: 'vuepress-reco.github.io',
-      clientId: '4d81cea3b3d8aac8e88e',
-      clientSecret: 'd23e8556b6d3c85abffbf4b8d853afb2ea08875a',
-    },
-    keyPage: {
-      keys: ['123456']
-    },
     friendLink: [
       {
         title: '午后南杂',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vuepress-theme-reco",
-  "version": "1.2.0-alpha.13",
+  "version": "1.2.0-alpha.14",
   "description": "A simple and beautiful vuepress Blog & Doc theme.",
   "main": "index.js",
   "scripts": {

styles/mode.styl

@@ -1,18 +1,36 @@
 :root
+  --default-color-10 $lightColor10
+  --default-color-9 $lightColor9
+  --default-color-8 $lightColor8
+  --default-color-7 $lightColor7
+  --default-color-6 $lightColor6
+  --default-color-5 $lightColor5
+  --default-color-4 $lightColor4
+  --default-color-3 $lightColor3
+  --default-color-2 $lightColor2
+  --default-color-1 $lightColor1
   --background-color $backgroundColor
   --box-shadow $boxShadow
   --box-shadow-hover $boxShadowHover
   --text-color $textColor
   --border-color $borderColor
-  --bgm-bg-color $bgmBgColor
   --code-color $codeColor
   --mask-color $maskColor
   @media (prefers-color-scheme: dark)
+    --default-color-10 $darkColor10
+    --default-color-9 $darkColor9
+    --default-color-8 $darkColor8
+    --default-color-7 $darkColor7
+    --default-color-6 $darkColor6
+    --default-color-5 $darkColor5
+    --default-color-4 $darkColor4
+    --default-color-3 $darkColor3
+    --default-color-2 $darkColor2
+    --default-color-1 $darkColor1
     --background-color $backgroundColorDark
     --box-shadow $boxShadowDark
     --box-shadow-hover $boxShadowHoverDark
     --text-color $textColorDark
     --border-color $borderColorDark
-    --bgm-bg-color $bgmBgColorDark
     --code-color $codeColorDark
     --mask-color $maskColorDark