修改样式问题

src/components/pages/race/eventCenter/anliDetail.vue

@@ -49,11 +49,7 @@
                   }}人
                 </div>
               </div>
-              <div
-                class="autorBox"
-                style="margin-left: 35px"
-                v-if="anliBox[0].info.autor.length"
-              >
+              <div class="autorBox" v-if="anliBox[0].info.autor.length">
                 <div>联系人：</div>
                 <div v-for="(a, aIndex) in anliBox[0].info.autor" :key="aIndex">
                   {{ a.sn }}
@@ -166,11 +162,11 @@
               <div>{{ si + 1 }}</div>
               <div>{{ s.staTitle }}</div>
             </div>
-            <div class="navBTitle" @click="jump('fouth')">项目活动过程</div>
-            <div class="navBTitle" @click="jump('fivth')">
+            <div class="navBTitle isHover" @click="jump('fouth')">项目活动过程</div>
+            <div class="navBTitle isHover" @click="jump('fivth')">
               项目成果交流与评价
             </div>
-            <div class="navBTitle" @click="jump('sixth')">项目成效与反思</div>
+            <div class="navBTitle isHover" @click="jump('sixth')">项目成效与反思</div>
           </div>
         </div>
         <div
@@ -2956,7 +2952,7 @@ export default {
     width: 55% !important;
   }
   .leftNav {
-    left: 10px !important;
+    left: 5% !important;
     top: 60% !important;
     transform: translateY(-25%) !important;
   }
@@ -3297,12 +3293,15 @@ body {
   position: relative;
 }
 .file > div > div:nth-child(2) > div:nth-child(1) {
-  width: 250px;
+  max-width: 190px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   cursor: pointer;
 }
+.file > div > div:nth-child(2) > div:nth-child(1):hover{
+  color: #5e5e5e;
+}
 .hdTop {
   position: relative;
   width: 100%;
@@ -3547,7 +3546,7 @@ body {
   flex-direction: row;
   flex-wrap: nowrap;
   align-items: baseline;
-  margin-left: 10px;
+  margin-left: 35px;
 }
 .Autor {
   margin: 0 5px;
@@ -3684,15 +3683,15 @@ ol {
 }
 .leftNav {
   position: fixed;
-  left: 5%;
-  top: 70%;
+  left: 2%;
+  top: 80%;
   transform: translateY(-60%);
   z-index: 999;
+  max-width: 225px;
 }
 .topNav {
   background: #316b8c;
   color: #fff;
-  width: 250px;
   height: 40px;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
@@ -3713,7 +3712,7 @@ ol {
 }
 .navBTitle {
   background: #fff;
-  font-size: 18px;
+  font-size: 16px;
   width: 100%;
   height: 40px;
   line-height: 40px;
@@ -3721,6 +3720,7 @@ ol {
   font-weight: bold;
   text-indent: 15px;
   cursor: pointer;
+  max-width: 205px;
 }
 .navLTitle {
   display: flex;
@@ -3734,9 +3734,11 @@ ol {
   border-radius: 5px;
   font-weight: bold;
   cursor: pointer;
+  font-size: 14px;
+  max-width: 205px;
 }
 .navLTitle > div:nth-child(1) {
-  width: 50px;
+  min-width: 50px;
   text-align: center;
   border-top-left-radius: 5px;
   border-bottom-left-radius: 5px;
@@ -3744,5 +3746,16 @@ ol {
 }
 .navLTitle > div:nth-child(2) {
   margin-left: 15px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-word;
+  max-width: 130px;
+}
+.navLTitle > div:nth-child(2):hover{
+  color: #5e5e5e;
+}
+.isHover{
+  color: #5e5e5e;
 }
 </style>