perf[css]: refine style

src/views/errorPage/404.vue

@@ -1,28 +1,25 @@
 <template>
-  <div style="background:#f0f2f5;height:100%;">
+  <div class="wscn-http404-container">
-    <div class="wscn-http404-container">
+    <div class="wscn-http404">
-      <div class="wscn-http404">
+      <div class="pic-404">
-        <div class="pic-404">
+        <img class="pic-404__parent" :src="img_404" alt="404">
-          <img class="pic-404__parent" :src="img_404" alt="404">
+        <img class="pic-404__child left" :src="img_404_cloud" alt="404">
-          <img class="pic-404__child left" :src="img_404_cloud" alt="404">
+        <img class="pic-404__child mid" :src="img_404_cloud" alt="404">
-          <img class="pic-404__child mid" :src="img_404_cloud" alt="404">
+        <img class="pic-404__child right" :src="img_404_cloud" alt="404">
-          <img class="pic-404__child right" :src="img_404_cloud" alt="404">
+      </div>
-        </div>
+      <div class="bullshit">
-        <div class="bullshit">
+        <div class="bullshit__oops">OOPS!</div>
-          <div class="bullshit__oops">OOPS!</div>
+        <div class="bullshit__info">版权所有
-          <div class="bullshit__info">版权所有
+          <a class='link-type' href='https://wallstreetcn.com' target='_blank'>华尔街见闻</a>
-            <a class='link-type' href='https://wallstreetcn.com' target='_blank'>华尔街见闻</a>
-          </div>
-          <div class="bullshit__headline">{{ message }}</div>
-          <div class="bullshit__info">请检查您输入的网址是否正确，请点击以下按钮返回主页或者发送错误报告</div>
-          <a href="" class="bullshit__return-home">返回首页</a>
         </div>
+        <div class="bullshit__headline">{{ message }}</div>
+        <div class="bullshit__info">请检查您输入的网址是否正确，请点击以下按钮返回主页或者发送错误报告</div>
+        <a href="" class="bullshit__return-home">返回首页</a>
       </div>
     </div>
   </div>
 </template>
 
-
 <script>
 import img_404 from '@/assets/404_images/404.png'
 import img_404_cloud from '@/assets/404_images/404_cloud.png'

src/views/layout/components/AppMain.vue

@@ -24,12 +24,10 @@ export default {
 
 <style scoped>
 .app-main {
-  position: absolute;
+  /*84 = navbar + tags-view = 50 +34 */
-  top: 84px; /* navbar + tags-view = 50 +34 */
+  min-height: calc(100vh - 84px);
-  left: 0;
+  position: relative;
-  right: 0;
+  overflow: hidden;
-  bottom: 0;
-  margin: auto;
 }
 </style>