'升级mavonEditor兼容IE样式'

package.json

@@ -13,7 +13,7 @@
     "axios": "^0.15.3",
     "babel-polyfill": "^6.23.0",
     "element-ui": "2.3.3",
-    "mavon-editor": "^2.5.2",
+    "mavon-editor": "^2.5.4",
     "vue": "^2.5.16",
     "vue-cropperjs": "^2.2.0",
     "vue-quill-editor": "3.0.6",

src/components/common/Tags.vue

@@ -88,10 +88,10 @@
 </script>
 
 
-<style scoped>
+<style>
     .tags {
         position: relative;
-        height: 40px;
+        height: 30px;
         overflow: hidden;
         background: #fff;
         padding-right: 120px;
@@ -105,13 +105,13 @@
 
     .tags-li {
         float: left;
-        margin: 4px;
+        margin: 3px 5px 2px 3px;
         border-radius: 3px;
         font-size: 12px;
         overflow: hidden;
         cursor: pointer;
-        height: 32px;
-        line-height: 32px;
+        height: 23px;
+        line-height: 23px;
         border: 1px solid #e9eaec;
         background: #fff;
         padding: 0 5px 0 12px;
@@ -122,7 +122,7 @@
         transition: all .3s ease-in;
     }
 
-    .tags-li:hover {
+    .tags-li:not(.active):hover {
         background: #f8f8f8;
     }
 
@@ -149,10 +149,10 @@
         right: 0;
         top: 0;
         box-sizing: border-box;
-        padding-top: 8px;
+        padding-top: 1px;
         text-align: center;
         width: 110px;
-        height: 40px;
+        height: 30px;
         background: #fff;
         box-shadow: -3px 0 15px 3px rgba(0, 0, 0, .1);
         z-index: 10;

src/components/page/Markdown.vue

@@ -3,7 +3,7 @@
         <div class="crumbs">
             <el-breadcrumb separator="/">
                 <el-breadcrumb-item><i class="el-icon-date"></i> 表单</el-breadcrumb-item>
-                <el-breadcrumb-item>markdown</el-breadcrumb-item>
+                <el-breadcrumb-item>markdown编辑器</el-breadcrumb-item>
             </el-breadcrumb>
         </div>
         <div class="container">
@@ -20,8 +20,6 @@
 <script>
     import { mavonEditor } from 'mavon-editor'
     import 'mavon-editor/dist/css/index.css'
-    // 重写mavon的flex样式来兼容IE
-    import 'static/css/mavon-flex.css'
     export default {
         data: function(){
             return {

static/css/main.css

@@ -126,4 +126,8 @@ a{text-decoration: none}
 }
 .editor-btn{
     margin-top: 20px;
-}
+}
+/*markdown*/
+.v-note-wrapper .v-note-panel {
+    min-height: 500px;
+  }

static/css/mavon-flex.css

@@ -1,70 +0,0 @@
-.v-note-wrapper{
-    display: flex;
-    flex-direction: column;
-}
-.v-note-wrapper .v-note-op{
-    display: flex;
-    flex: none;
-}
-.v-note-wrapper .v-note-op .left,
-.v-note-wrapper .v-note-op .right{
-    flex: 1;
-}
-.v-note-wrapper {
-  display: flex;
-  flex-direction: column;
-}
-.v-note-wrapper .v-note-op {
-  display: flex;
-  flex: none;
-}
-.v-note-wrapper .v-note-op .left,
-.v-note-wrapper .v-note-op .right {
-  flex: 1;
-}
-
-.v-note-wrapper .v-note-panel {
-  display: flex;
-  flex: 1;
-  min-height: 500px;
-}
-.v-note-wrapper .v-note-panel .v-note-edit.divarea-wrapper {
-  flex: 0 0 50%;
-}
-
-.v-note-wrapper .v-note-panel .v-note-edit.divarea-wrapper.single-edit {
-  flex: 0 0 100%;
-}
-.v-note-wrapper .v-note-panel .v-note-edit.divarea-wrapper.single-show {
-  width: 0;
-  flex: 0 0 0;
-  display: none;
-}
-
-.v-note-wrapper .v-note-panel .v-note-show {
-  flex: 0 0 50%;
-}
-.v-note-wrapper .v-note-panel .v-note-show.single-show {
-  flex: 0 0 100%;
-}
-
-.v-note-wrapper .v-note-panel .v-note-navigation-wrapper {
-  display: flex;
-  flex-direction: column;
-}
-
-.v-note-wrapper .v-note-panel .v-note-navigation-wrapper .v-note-navigation-title {
-  flex: none;
-}
-
-.v-note-wrapper .v-note-panel .v-note-navigation-wrapper .v-note-navigation-content {
-  flex: 1;
-}
-.v-note-img-wrapper{
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-.v-note-img-wrapper img {
-    flex: 0 0 auto;
-}