Merge pull request #62 from terwer/v4.x

Style OK
terwer · Mar 23, 2019 · 8cd464a · 8cd464a
2 parents 149c130 + 64020dc
commit 8cd464a
Show file tree

Hide file tree

Showing 18 changed files with 278 additions and 160 deletions.
diff --git a/jvue-admin/package.json b/jvue-admin/package.json
@@ -6,6 +6,7 @@
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve --port 3001",
+    "dev": "npm run serve",
     "build": "vue-cli-service build",
     "start": "vue-cli-service serve --port 3001 --mode production",
     "lint-cli": "vue-cli-service lint --fix",

diff --git a/jvue-admin/src/components/common/MHeader.vue b/jvue-admin/src/components/common/MHeader.vue
@@ -86,7 +86,7 @@ export default {
 .header-right {
   list-style: none;
   float: right;
-  margin: 0 15px 0 0;
+  margin: 0 35px 0 0;
   color: #7f8c8d;
 }
 

diff --git a/jvue-front/components/themes/dark/Aside.vue b/jvue-front/components/themes/dark/Aside.vue
@@ -12,9 +12,20 @@
           </el-col>
           <el-col :xs="24" :md="post.thumbnails.length > 0 ? 18 : 24">
             <div>
-              <h2 :class="post.thumbnails.length > 0 ? 'has-image-title' : ''">
-                {{ post.title === "" ? "暂无标题" : post.title }}
-              </h2>
+              <nuxt-link
+                class="aside-link-dark"
+                :to="
+                  post.name === ''
+                    ? '/post-dark/' + post.id + '.html'
+                    : '/post-dark/' + post.name + '.html'
+                "
+              >
+                <h2
+                  :class="post.thumbnails.length > 0 ? 'has-image-title' : ''"
+                >
+                  {{ post.title === "" ? "暂无标题" : post.title }}
+                </h2>
+              </nuxt-link>
             </div>
           </el-col>
         </el-row>
@@ -48,6 +59,7 @@ export default {
 <style scoped>
 #aside {
   background-color: #212121;
+  padding-top: 10px;
 }
 .el-card {
   background-color: #212121;

diff --git a/jvue-front/components/themes/dark/Header.vue b/jvue-front/components/themes/dark/Header.vue
@@ -20,10 +20,11 @@
       </div>
     </el-col>
     <el-col :xs="24" :sm="24" :md="6">
-      <div class="search">
+      <div class="search s-dark">
         <el-input v-model="s" placeholder="请输入关键字" clearable>
           <el-button
             slot="append"
+            class="s-dark-btn"
             type="primary"
             icon="el-icon-search"
             @click="doSearch"

diff --git a/jvue-front/components/themes/dark/PostList.vue b/jvue-front/components/themes/dark/PostList.vue
@@ -11,8 +11,16 @@
             <img :src="post.thumbnails[0]" class="image" alt="image" />
           </el-col>
           <el-col :xs="24" :md="post.thumbnails.length > 0 ? 18 : 24">
-            <div>
-              <h2>{{ post.title === "" ? "暂无标题" : post.title }}</h2>
+            <div class="post-list-title-dark">
+              <nuxt-link
+                :to="
+                  post.name === ''
+                    ? '/post-dark/' + post.id + '.html'
+                    : '/post-dark/' + post.name + '.html'
+                "
+              >
+                <h2>{{ post.title === "" ? "暂无标题" : post.title }}</h2>
+              </nuxt-link>
               <div class="bottom clearfix">
                 <div class="page desc">
                   {{ post.desc === "" ? "暂无简介" : post.desc }}
@@ -39,7 +47,9 @@
                     : '/post-dark/' + post.name + '.html'
                 "
               >
-                <el-button type="text" class="read-more">查看全文</el-button>
+                <el-button type="text" class="read-more-dark"
+                  >查看全文</el-button
+                >
               </nuxt-link>
             </div>
           </el-col>
@@ -92,13 +102,17 @@ export default {
   line-height: 12px;
 }
 
-.read-more {
+.read-more-dark {
   padding: 0;
   margin-top: 15px;
   float: left;
   color: #e78c6c;
 }
 
+.read-more-dark:hover {
+  color: #ffcb6b;
+}
+
 .image {
   width: 100%;
   max-height: 150px;

diff --git a/jvue-front/components/themes/default/Aside.vue b/jvue-front/components/themes/default/Aside.vue
@@ -12,9 +12,20 @@
           </el-col>
           <el-col :xs="24" :md="post.thumbnails.length > 0 ? 18 : 24">
             <div>
-              <h2 :class="post.thumbnails.length > 0 ? 'has-image-title' : ''">
-                {{ post.title === "" ? "暂无标题" : post.title }}
-              </h2>
+              <nuxt-link
+                class="aside-link"
+                :to="
+                  post.name === ''
+                    ? '/post-dark/' + post.id + '.html'
+                    : '/post-dark/' + post.name + '.html'
+                "
+              >
+                <h2
+                  :class="post.thumbnails.length > 0 ? 'has-image-title' : ''"
+                >
+                  {{ post.title === "" ? "暂无标题" : post.title }}
+                </h2>
+              </nuxt-link>
             </div>
           </el-col>
         </el-row>

diff --git a/jvue-front/components/themes/default/PostList.vue b/jvue-front/components/themes/default/PostList.vue
@@ -11,8 +11,16 @@
             <img :src="post.thumbnails[0]" class="image" alt="image" />
           </el-col>
           <el-col :xs="24" :md="post.thumbnails.length > 0 ? 18 : 24">
-            <div>
-              <h2>{{ post.title === "" ? "暂无标题" : post.title }}</h2>
+            <div class="post-list-title">
+              <nuxt-link
+                :to="
+                  post.name === ''
+                    ? '/post/' + post.id + '.html'
+                    : '/post/' + post.name + '.html'
+                "
+              >
+                <h2>{{ post.title === "" ? "暂无标题" : post.title }}</h2>
+              </nuxt-link>
               <div class="bottom clearfix">
                 <div class="page">
                   {{ post.desc === "" ? "暂无简介" : post.desc }}
@@ -39,7 +47,7 @@
                     : '/post/' + post.name + '.html'
                 "
               >
-                <el-button type="text" class=".read-more">查看全文</el-button>
+                <el-button type="text" class="read-more">查看全文</el-button>
               </nuxt-link>
             </div>
           </el-col>
@@ -92,6 +100,10 @@ export default {
   float: left;
 }
 
+.read-more:hover {
+  color: #212121;
+}
+
 .image {
   width: 100%;
   max-height: 150px;

diff --git a/jvue-front/package-lock.json b/jvue-front/package-lock.json
diff --git a/jvue-front/pages/about-dark.vue b/jvue-front/pages/about-dark.vue
@@ -1,21 +1,21 @@
 <template>
   <el-container>
-    <el-main>
+    <el-main class="el-container-dark">
       <el-row>
         <el-col :xs="0" :md="2">&nbsp;</el-col>
         <el-col :xs="24" :md="20">
-          <el-main>
+          <el-main class="el-main-dark">
             <el-container>
-              <el-main>
+              <el-main class="el-main-dark">
                 <el-container>
-                  <el-header>
+                  <el-header class="el-header-dark">
                     <HeaderTime />
                   </el-header>
-                  <el-header>
+                  <el-header class="el-header-dark">
                     <Header />
                   </el-header>
-                  <el-main>
-                    <div class="about">
+                  <el-main class="el-main-dark">
+                    <div class="about about-dark">
                       <div class="visit">
                         谢谢您，您是第
                         <img
@@ -104,8 +104,11 @@ export default {
 </script>
 
 <style lang="scss">
+@import "./common.css";
 @import "./dark.css";
+</style>
 
+<style lang="scss" scoped>
 .visit {
   font-size: 24px;
 }

diff --git a/jvue-front/pages/about.vue b/jvue-front/pages/about.vue
@@ -104,8 +104,11 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@import "./common.css";
 @import "./default.css";
+</style>
 
+<style lang="scss" scoped>
 .visit {
   font-size: 24px;
 }