🐞 fix(头部组件): 适配性调整

hookehuyr
Commit 9a73f4d07b1690a9d66281f2a86813152c389eba 9a73f4d0 1 parent f5d326dd
Showing 1 changed file with 9 additions and 10 deletions
src/components/common/hagerHeader.vue
--- a/src/components/common/hagerHeader.vue
View file @9a73f4d
+++ b/src/components/common/hagerHeader.vue
View file @9a73f4d
 <!--
  * @Date: 2024-09-26 13:42:11
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-10-15 16:31:18
+ * @LastEditTime: 2024-10-15 16:53:54
  * @FilePath: /hager/src/components/common/hagerHeader.vue
  * @Description: 文件描述
 -->
@@ -18,31 +18,27 @@
           </el-col>
           <el-col :sm="10" :md="10" :lg="10" :xl="10">
             <el-row class="nav-right">
-              <el-col>
+              <el-col :span="24">
                 <div class="search">
-                  <i class="el-icon-search" style="color: #00477E; padding-right: 0.5rem;"></i>&nbsp;
+                  <i class="el-icon-search" style="color: #00477E;"></i>&nbsp;
                   <input placeholder="搜索" />
                 </div>
               </el-col>
             </el-row>
           </el-col>
           <el-col :sm="8" :md="8" :lg="8" :xl="8">
-            <el-row class="nav-right">
+            <div class="nav-right" style="float: right;">
-              <el-col :sm="3" :md="3" :lg="3" :xl="3">
                 <div @click="goToWeb" class="tooltip">
                   <el-tooltip class="item" effect="dark" content="国际站" placement="bottom">
                     <i class=el-icon-orange style="font-size: 1.25rem;"></i>
                   </el-tooltip>
                 </div>
-              </el-col>
-              <el-col :sm="3" :md="3" :lg="3" :xl="3">
                 <div @click="goToLogin" class="tooltip">
                   <el-tooltip class="item" effect="dark" content="用户登录" placement="bottom">
                     <i class=el-icon-user style="font-size: 1.25rem;"></i>
                   </el-tooltip>
                 </div>
-              </el-col>
+            </div>
-            </el-row>
           </el-col>
         </el-row>
       </el-col>
@@ -543,10 +539,13 @@ export default {
         border: 1px solid #f5f5f5;
         background-color: #e3f1f7;
         padding: 0.5rem 1rem;
+        overflow: hidden;
+        width: 100%;
         input {
           border: 0;
           background-color: #E3F1F7;
-          width: 100%;
+          margin-left: 0.5rem;
+          width: calc(100% - 0.5rem);
           &::placeholder {
             color: #00477E;
           }