From a8459fa5722b26b71b677bac4b9f123dfdb7b3e8 Mon Sep 17 00:00:00 2001
From: Pan <panfree23@gmail.com>
Date: Tue, 24 Oct 2017 14:49:29 +0800
Subject: [PATCH] style: refactor styles

---
 src/components/Github/index.vue         |  29 ++++++
 src/components/Icon-svg/index.vue       |  10 ++
 src/components/MarkdownEditor/index.vue |   6 +-
 src/styles/element-ui.scss              |  18 ----
 src/styles/index.scss                   | 119 +++---------------------
 5 files changed, 58 insertions(+), 124 deletions(-)

diff --git a/src/components/Github/index.vue b/src/components/Github/index.vue
index cd2677ca..ed2e85e1 100644
--- a/src/components/Github/index.vue
+++ b/src/components/Github/index.vue
@@ -11,3 +11,32 @@
   </a>
 </template>
 
+<style scoped>
+.github-corner:hover .octo-arm {
+  animation: octocat-wave 560ms ease-in-out
+}
+
+@keyframes octocat-wave {
+  0%,
+  100% {
+    transform: rotate(0)
+  }
+  20%,
+  60% {
+    transform: rotate(-25deg)
+  }
+  40%,
+  80% {
+    transform: rotate(10deg)
+  }
+}
+
+@media (max-width:500px) {
+  .github-corner:hover .octo-arm {
+    animation: none
+  }
+  .github-corner .octo-arm {
+    animation: octocat-wave 560ms ease-in-out
+  }
+}
+</style>
diff --git a/src/components/Icon-svg/index.vue b/src/components/Icon-svg/index.vue
index 5ac1ec60..3e77146e 100644
--- a/src/components/Icon-svg/index.vue
+++ b/src/components/Icon-svg/index.vue
@@ -20,3 +20,13 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+.svg-icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>
diff --git a/src/components/MarkdownEditor/index.vue b/src/components/MarkdownEditor/index.vue
index 922b2f16..d287b2e5 100644
--- a/src/components/MarkdownEditor/index.vue
+++ b/src/components/MarkdownEditor/index.vue
@@ -79,7 +79,6 @@ export default {
 
 <style>
 .simplemde-container .CodeMirror {
-  /*height: 150px;*/
   min-height: 150px;
 }
 
@@ -109,6 +108,11 @@ export default {
   font-weight: bold;
   color: #E61E1E;
 }
+
+.simplemde-container .editor-toolbar.fullscreen,
+.simplemde-container .CodeMirror-fullscreen {
+  z-index: 1003;
+}
 </style>
 
 
diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss
index 3b005d07..86f8d55b 100644
--- a/src/styles/element-ui.scss
+++ b/src/styles/element-ui.scss
@@ -1,22 +1,4 @@
  //覆盖一些element-ui样式
- .block-checkbox {
-   display: block;
- }
-
- .operation-container {
-   .cell {
-     padding: 10px !important;
-   }
-   .el-button {
-     &:nth-child(3) {
-       margin-top: 10px;
-       margin-left: 0px;
-     }
-     &:nth-child(4) {
-       margin-top: 10px;
-     }
-   }
- }
 
  .el-upload {
    input[type="file"] {
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 9090126f..09b3463a 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -2,6 +2,7 @@
 @import './btn.scss';
 @import './element-ui.scss';
 @import './sidebar.scss';
+
 body {
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
@@ -72,6 +73,17 @@ a:hover {
   display: block;
 }
 
+.clearfix {
+  &:after {
+    visibility: hidden;
+    display: block;
+    font-size: 0;
+    content: " ";
+    clear: both;
+    height: 0;
+  }
+}
+
 code {
   background: #eef1f6;
   padding: 15px 10px;
@@ -87,9 +99,10 @@ code {
   }
 }
 
+//globl transition css
 .fade-enter-active,
 .fade-leave-active {
-  transition: all .2s ease
+  transition: opacity 0.28s;
 }
 
 .fade-enter,
@@ -119,14 +132,6 @@ code {
   text-align: center
 }
 
-.svg-icon {
-  width: 1em;
-  height: 1em;
-  vertical-align: -0.15em;
-  fill: currentColor;
-  overflow: hidden;
-}
-
 .sub-navbar {
   height: 50px;
   line-height: 50px;
@@ -157,57 +162,6 @@ code {
   }
 }
 
-.publishedTag,
-.draftTag,
-.deletedTag {
-  color: #fff;
-  background-color: $panGreen;
-  line-height: 1;
-  text-align: center;
-  margin: 0;
-  padding: 8px 12px;
-  font-size: 14px;
-  border-radius: 4px;
-  position: absolute;
-  left: 20px;
-  top: 10px;
-}
-
-.draftTag {
-  background-color: $yellow;
-}
-
-.deletedTag {
-  background-color: $red;
-}
-
-.input-label {
-  font-size: 14px;
-  color: #48576a;
-  line-height: 1;
-  padding: 11px 5px 11px 0;
-}
-
-.clearfix {
-  &:after {
-    visibility: hidden;
-    display: block;
-    font-size: 0;
-    content: " ";
-    clear: both;
-    height: 0;
-  }
-}
-
-.no-marginLeft {
-  .el-checkbox {
-    margin: 0 20px 15px 0;
-  }
-  .el-checkbox+.el-checkbox {
-    margin-left: 0px;
-  }
-}
-
 .filter-container {
   padding-bottom: 10px;
   .filter-item {
@@ -225,48 +179,3 @@ code {
 .multiselect--active {
   z-index: 1000 !important;
 }
-
-//refine simplemde
-.simplemde-container {
-  .editor-toolbar.fullscreen,
-  .CodeMirror-fullscreen {
-    z-index: 1003;
-  }
-}
-
-//暂时性解决diolag 问题 https://github.com/ElemeFE/element/issues/2461
-.el-dialog {
-  transform: none;
-  left: 0;
-  position: relative;
-  margin: 0 auto;
-}
-
-//github-corner
-.github-corner:hover .octo-arm {
-  animation: octocat-wave 560ms ease-in-out
-}
-
-@keyframes octocat-wave {
-  0%,
-  100% {
-    transform: rotate(0)
-  }
-  20%,
-  60% {
-    transform: rotate(-25deg)
-  }
-  40%,
-  80% {
-    transform: rotate(10deg)
-  }
-}
-
-@media (max-width:500px) {
-  .github-corner:hover .octo-arm {
-    animation: none
-  }
-  .github-corner .octo-arm {
-    animation: octocat-wave 560ms ease-in-out
-  }
-}
-- 
GitLab