修改样式

src/pages/main/DetailsPage.vue

@@ -2,7 +2,7 @@
   <div class="mainBox">
     <div class="mainContent">
       <div class="navigation">
-        <div class="goBack">
+        <div class="goBack newGoBack">
           <span class="back" @click="backAction()">
             <span class="iconfont">&#xe720;</span>返回
           </span>
@@ -10,7 +10,7 @@
             <li slot="reference" class="name">{{ patient_name }}</li>
           </el-popover>
         </div>
-        <div class="nav">
+        <div class="nav newNav1">
           <ul>
             <li
               v-for="(item, i) in ['病历', '透析', '今日']"
@@ -155,11 +155,11 @@ export default {
 .mainContent {
   position: relative;
   .navigation {
-    @include display-flex;
-    @include align-items-center;
-    @include text-align;
-    @include box-sizing;
-    @include justify-content-between;
+    // @include display-flex;
+    // @include align-items-center;
+    // @include text-align;
+    // @include box-sizing;
+    // @include justify-content-between;
     padding: 0.3rem 0.36rem;
     // border-bottom: 1px #e5e5e5 solid;
     position: fixed;
@@ -168,22 +168,25 @@ export default {
     right: 0;
     z-index: 100;
     background: #258ffc;
-    @media only screen and (max-width: 320px) {
-      display: -webkit-box;
+    .newGoBack {
+      float: left;
+    }
+    .newNav1 {
+      float: left;
     }
     .name {
       color: #fff;
     }
     .nav {
-      margin-right: 2.4rem;
+      margin-left: 0.4rem;
       @media only screen and (min-width: 376px) and (max-width: 415px) {
-        margin-right: 3.6rem;
+        margin-left: 1rem;
       }
       @media only screen and (min-width: 415px) and (max-width: 767px) {
-        margin-right: 3.6rem;
+        margin-left: 1.6rem;
       }
       @media only screen and (min-width: 768px) {
-        margin-right: 4rem;
+        margin-left: 2rem;
       }
       ul {
         li {