首页搜索栏

src/assets/styles/portal-index.scss

@@ -444,6 +444,9 @@
 }
 // boe-index
 @media screen and (max-width: 1366px){
+  .portal-input{
+    width: 260px;
+  }
   .btn-user{
     width: 70px;
   }
@@ -726,6 +729,9 @@
  }
 }
 @media screen and (max-width: 1680px) and (min-width:1367px){
+  .portal-input{
+    width: 280px;
+  }
   .btn-user{
     width: 75px;
   }
@@ -1014,6 +1020,9 @@
 }
 
 @media screen and (max-width: 1920px) and (min-width: 1681px){
+  .portal-input{
+    width: 290px;
+  }
   .btn-user{
     width: 80px;
   }
@@ -1289,6 +1298,9 @@
   .btn-user{
     width: 80px;
   }
+  .portal-input{
+    width: 300px;
+  }
   .course-banner {// 首页banner导航条样式
     .swiper-button-prev{
       left: 44%;

src/components/PortalHeader.vue

@@ -55,8 +55,8 @@
           </div>
         </div>
         <div class="portal-top-right">
-          <div v-if="goSearch !=10" style="position: relative;">
+          <div  v-if="goSearch !=10" style="position: relative;">
-            <el-input v-show="!hideSearch" placeholder="搜索全部" style="width: 260px;border-radius: 20px !important; " @keyup.enter.native="searchJump()" clearable maxlength="50" v-model="keyword" >
+            <el-input class="portal-input" v-show="!hideSearch" placeholder="搜索全部" style="border-radius: 20px !important; " @keyup.enter.native="searchJump()" clearable maxlength="50" v-model="keyword" >
               <el-select  v-model="findType" style="width: 75px; border-radius:20px !important;" slot="prepend" placeholder="请选择">
                 <el-option label="课程" value="1"></el-option>
                 <el-option label="案例" value="2"></el-option>
@@ -303,6 +303,7 @@ export default {
 </script>
 
 <style scoped rel="stylesheet/scss" lang="scss">
+
 ::v-deep .el-dropdown-menu__item:not(.is-disabled):hover{
     background-color: #fff !important;
     color: #0059FF !important;