pref: optimizing css (#171)

- 删除不会生效的 CSS - 调整结构，减少不必要的标签
doocs · Aug 4, 2022 · 5c7e27d · 5c7e27d
1 parent 19d87ce
commit 5c7e27d
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 37 deletions.
diff --git a/src/components/CodemirrorEditor/aboutDialog.vue b/src/components/CodemirrorEditor/aboutDialog.vue
@@ -7,17 +7,15 @@
     width="30%"
     center
   >
-    <div style="text-align: center">
+    <div style="text-align: center;">
       <h3>一款高度简洁的微信 Markdown 编辑器</h3>
-    </div>
-    <div style="text-align: center; margin-top: 10px">
       <p>扫码关注我的公众号，原创技术文章第一时间推送！</p>
       <img
         src="https://cdn-doocs.oss-cn-shenzhen.aliyuncs.com/gh/doocs/md/images/1648303220922-7e14aefa-816e-44c1-8604-ade709ca1c69.png"
-        style="width: 40%; display: block; margin: 20px auto 10px"
+        style="width: 40%;"
       />
     </div>
-    <span slot="footer" class="dialog-footer">
+    <template slot="footer">
       <el-button
         type="primary"
         @click="onRedirect('https://github.com/doocs/md')"
@@ -32,7 +30,7 @@
       >
         Gitee 仓库
       </el-button>
-    </span>
+    </template>
   </el-dialog>
 </template>
 

diff --git a/src/components/CodemirrorEditor/resetDialog.vue b/src/components/CodemirrorEditor/resetDialog.vue
@@ -4,16 +4,19 @@
     class="reset__dialog"
     :visible="showResetConfirm"
     @close="$emit('close')"
+    center
   >
-    <div class="text">此操作将丢失本地自定义样式，是否继续?</div>
-    <div slot="footer" class="dialog-footer">
+    <div style="text-align: center">
+      此操作将丢失本地自定义样式，是否继续?
+    </div>
+    <template slot="footer">
       <el-button :type="btnType" @click="$emit('close')" plain>
         取 消
       </el-button>
       <el-button :type="btnType" @click="$emit('confirm')" plain>
         确 定
       </el-button>
-    </div>
+    </template>
   </el-dialog>
 </template>
 
@@ -42,16 +45,4 @@ export default {
 /deep/ .el-dialog {
   min-width: 440px;
 }
-
-.reset__dialog {
-  text-align: center;
-}
-
-.text {
-  text-align: center;
-}
-
-.dialog-footer {
-  text-align: center;
-}
 </style>
diff --git a/src/views/index.vue b/src/views/index.vue
@@ -28,19 +28,4 @@ export default {
 }
 </script>
 
-<style scoped>
-.fade-enter,
-.fade-leave-to {
-  opacity: 0;
-}
-
-.fade-enter-to,
-.fade-leave {
-  opacity: 1;
-}
-
-.fade-enter-active,
-.fade-leave-active {
-  transition: all 1s;
-}
-</style>
+<style scoped></style>