style: 创建po模块 - 样式调整.

src/App.vue

@@ -35,7 +35,7 @@ body {
 }
 
 #app {
-  background-color: rgb(233,230,231);
+  background-color: rgb(233, 230, 231);
   height: 100%;
   width: 100%;
   position: relative;

src/pages/purchase-order/edit.vue

@@ -5,10 +5,7 @@
       v-loading="true"
       class="view-window"
     ></div>
-    <div
-      class="flex"
-      style="position: fixed; top: 20px; right: calc((100% - 1600px) / 2 + 24px); z-index: 2"
-    >
+    <div class="flex fixed-button-area">
       <el-button
         type="info"
         @click="formVisible = !formVisible"
@@ -1957,6 +1954,16 @@ input[type='number'] {
   left: 0;
   top: 0;
 }
+.fixed-button-area {
+  position: fixed;
+  top: 20px;
+  right: 24px;
+  z-index: 2;
+
+  @media screen and (min-width: 1600px) {
+    right: calc((100% - 1600px) / 2 + 24px);
+  }
+}
 .screen {
   margin: 0 auto;
   font-size: 12pt;
@@ -2002,7 +2009,8 @@ input[type='number'] {
   }
 }
 .screen {
-  background-color: #fff;
+  background-color: rgba(#fff, 1);
+  box-shadow: 0 0 0 1px rgba(255, 255, 255, .4) inset, 0 .5em 1em rgba(0, 0, 0, 0.6);
   max-width: 1600px;
   margin: 0 auto;
 
@@ -2421,7 +2429,7 @@ input[type='number'] {
   .pdf-wrap {
     position: relative;
     width: 21cm;
-    margin:0 auto;
+    margin: 0 auto;
     box-shadow: 1px 1px 2pt 0px $subColor;
     & + .pdf-wrap {
       margin-top: 20px;