bug

src/components/menu.vue

@@ -14,18 +14,17 @@
             </a>
             </a>
           </div>
           </div>
         </div>
         </div>
-        <div class="user-box fr">
-          <div class="line" style="margin-left:0px;"></div>
-          <a class="msgh fl" href="javascript:history.go(0)">
+        <div class="user-box fr row verCenter">
+          <a class="msgh" href="javascript:history.go(0)">
             <span class="el-icon-refresh icon" style="position:relative;top:3px;"></span>
             <span class="el-icon-refresh icon" style="position:relative;top:3px;"></span>
           </a>
           </a>
           <div class="line"></div>
           <div class="line"></div>
           <a href="/云芯操作手册.pdf" class="fl" target="_blank" title="操作手册"><span class="icon iconfont iconwendangguanli fl"></span></a>
           <a href="/云芯操作手册.pdf" class="fl" target="_blank" title="操作手册"><span class="icon iconfont iconwendangguanli fl"></span></a>
           <div class="line"></div>
           <div class="line"></div>
-          <div class="login-v fl">
-            <img class="fl" :src="userinfo.avatar||'https://www.ichunt.com/v3/dist/res/home/images/headimg/boy1.png'" alt="">
-            <div class="fl namex">{{ userinfo.contacts_name || '猎芯网用户' }}</div>
-            <div class="fl lo-box-drop">
+          <div class="login-v row verCenter">
+            <img :src="userinfo.avatar||'https://www.ichunt.com/v3/dist/res/home/images/headimg/boy1.png'" alt="">
+            <div class="namex">{{ userinfo.contacts_name || '猎芯网用户' }}</div>
+            <div class="lo-box-drop row verCenter">
               <span class="icon iconfont"></span>
               <span class="icon iconfont"></span>
               <div class="drop-box">
               <div class="drop-box">
                 <a href="javascript:;" @click="changePwd()">修改密码</a>
                 <a href="javascript:;" @click="changePwd()">修改密码</a>
@@ -552,8 +551,8 @@ export default {
       height: 40px;
       height: 40px;
       padding: 8px 0;
       padding: 8px 0;
       line-height: 40px;
       line-height: 40px;
-      padding-right: 36px;
       color: #A1ACC1;
       color: #A1ACC1;
+      width: 241px;
 
 
       a {
       a {
         color: #A1ACC1;
         color: #A1ACC1;
@@ -568,6 +567,12 @@ export default {
       .icon {
       .icon {
         font-size: 24px;
         font-size: 24px;
         transition: all 0.5s;
         transition: all 0.5s;
+
+        &.el-icon-refresh {
+          animation-name: layui-rotate;
+          animation-duration: 1s;
+          animation-timing-function: linear;
+        }
       }
       }
 
 
       .line {
       .line {
@@ -577,8 +582,6 @@ export default {
         float: left;
         float: left;
         margin-left: 15px;
         margin-left: 15px;
         margin-right: 15px;
         margin-right: 15px;
-        position: relative;
-        top: 5px;
       }
       }
 
 
       .msgh {
       .msgh {
@@ -627,6 +630,7 @@ export default {
             height: 55px;
             height: 55px;
             padding: 12px 0;
             padding: 12px 0;
             left: -66px;
             left: -66px;
+            top: 100%;
             background: #FFFFFF;
             background: #FFFFFF;
             box-shadow: 1px 2px 10px 0px rgba(119, 135, 145, 0.5);
             box-shadow: 1px 2px 10px 0px rgba(119, 135, 145, 0.5);
 
 
@@ -892,4 +896,14 @@ export default {
     }
     }
   }
   }
 }
 }
+
+@keyframes layui-rotate {
+  from {
+    -webkit-transform: rotate(0)
+  }
+
+  to {
+    -webkit-transform: rotate(360deg)
+  }
+}
 </style>
 </style>
\ No newline at end of file