Merge pull request #101 from vuepress-reco/feature/reco

Feature/reco

Author: reco_luan

components/HomeBlog.vue

@@ -321,7 +321,7 @@ export default {
     padding-right: 1.5rem;
     .hero {
       margin 0 -1.5rem
-      height 350px
+      height 450px
       img {
         max-height: 210px;
         margin: 2rem auto 1.2rem;

components/Password.vue

@@ -1,6 +1,5 @@
 <template>
   <div class="password-shadow" :class="{'is-home': !isPage}">
-    <!-- <Background /> -->
     <h3 class="title">{{isPage ? $frontmatter.title : $site.title}}</h3>
     <p class="description" v-if="!isPage">{{$site.description}}</p>
     <label class="inputBox" id="box">
@@ -32,10 +31,7 @@
 </template>
 
 <script>
-import Background from '@theme/components/Background'
-
 export default {
-  components: { Background },
   props: {
     isPage: {
       type: Boolean,
@@ -157,6 +153,7 @@ export default {
     padding-left 20px
     box-sizing border-box
     opacity 0.9
+    overflow hidden
     input{
       width:600px;
       height:100%;
@@ -168,6 +165,7 @@ export default {
       outline: none;
       position: absolute;
       bottom:0;
+      left 20px
       opacity 0
       font-size 50px
       &:focus {
@@ -249,7 +247,7 @@ export default {
       box-sizing border-box
       opacity 0.9
       input{
-        width:600px;
+        width: 60%;
         height:100%;
         border:none;
         padding:0;
@@ -313,7 +311,7 @@ export default {
   @media (max-width: $MQNarrow) {
     .inputBox{
       padding-left $mobileSidebarWidth
-    }  
+    }
   }
 }
 

components/SidebarLink.vue

@@ -82,6 +82,9 @@ function renderChildren (h, children, path, route, maxDepth, depth = 1) {
   padding-left 1.5rem
   font-size 0.95em
 
+.sidebar-sub-headers a.sidebar-link
+  margin 0 1rem 0 0.6rem
+
 a.sidebar-link
   font-size 1em
   font-weight 400

components/TagList.vue

@@ -47,6 +47,7 @@ export default {
     border-radius: $borderRadius
     background: #fff;
     color: #fff;
+    line-height 13px
     font-size: 13px;
     box-shadow $boxShadow
     transition: all .5s

example/docs/views/other/guide.md

@@ -1,6 +1,8 @@
 ---
 title: vuepress-theme-reco
 date: 2019-04-09
+categories:
+  - other
 ---
 
 ![vuepress](https://img.shields.io/badge/vuepress-0.14.8-brightgreen.svg)

example/docs/views/other/installUse.md

@@ -0,0 +1,26 @@
+---
+title: Installation and reference
+date: 2019-04-09
+categories:
+  - other
+---
+
+## Install
+
+```bash
+npm install vuepress-theme-reco -dev--save
+
+# or
+
+yarn add vuepress-theme-reco
+```
+
+## Usage
+
+```javascript
+// .vuepress/config.js
+
+module.exports = {
+  theme: 'reco'
+}  
+```

layouts/Category.vue

@@ -54,8 +54,8 @@ export default {
     // 时间降序后的博客列表
     posts () {
       let posts = this.$currentCategories.pages
-      this._sortPostData(posts)
       posts = this._filterPostData(posts)
+      this._sortPostData(posts)
       return posts
     },
     // 标题只显示分类名称

layouts/Tag.vue

@@ -45,8 +45,8 @@ export default {
     // 时间降序后的博客列表
     posts () {
       let posts = this.$currentTags.pages
-      this._sortPostData(posts)
       posts = this._filterPostData(posts)
+      this._sortPostData(posts)
       return posts
     }
   },

mixins/index.js

@@ -1,14 +1,13 @@
 export default {
   methods: {
     _tagColor () {
-      // 红、蓝、绿、橙、灰
       const tagColorArr = ['#e15b64', '#f47e60', '#f8b26a', '#abbd81', '#849b87', '#e15b64', '#f47e60', '#f8b26a', '#f26d6d', '#67cc86', '#fb9b5f', '#3498db']
       const index = Math.floor(Math.random() * tagColorArr.length)
       return tagColorArr[index]
     },
     _filterPostData (posts, isTimeline) {
       posts = posts.filter(item => {
-        const { title, frontmatter: { home, date, publish, sticky }} = item
+        const { title, frontmatter: { home, date, publish }} = item
         return isTimeline === true
           ? !(home == true || title == undefined || date === undefined || publish === false)
           : !(home == true || title == undefined || publish === false)
@@ -17,23 +16,24 @@ export default {
     },
     _sortPostData (posts) {
       posts.sort((a, b) => {
-        let aSticky = a.frontmatter.sticky, bSticky=b.frontmatter.sticky;
-        if(aSticky && bSticky) {
-          return aSticky == bSticky ? this._compareTime(a,b) : (aSticky - bSticky)
-        } else if(aSticky && !bSticky) {
-          return -1;
-        } else if(!aSticky && bSticky){
-          return 1;
+        const aSticky = a.frontmatter.sticky
+        const bSticky = b.frontmatter.sticky
+        if (aSticky && bSticky) {
+          return aSticky == bSticky ? this._compareTime(a, b) : (aSticky - bSticky)
+        } else if (aSticky && !bSticky) {
+          return -1
+        } else if (!aSticky && bSticky) {
+          return 1
         }
-        return this._compareTime(a,b)
+        return this._compareTime(a, b)
       })
     },
     // 获取时间的数字类型
     _getTimeNum (date) {
       return parseInt(new Date(date.frontmatter.date).getTime())
     },
     // 比对时间
-    _compareTime(a, b) {
+    _compareTime (a, b) {
       return this._getTimeNum(b) - this._getTimeNum(a)
     },
     // 获取博客数据
@@ -52,7 +52,7 @@ export default {
 
           posts = _filterPostData(posts)
           _sortPostData(posts)
-          
+
           this.$themeConfig.posts = posts
           resolve(posts)
         }