overview搜索栏样式

src/views/overview.vue

@@ -31,11 +31,11 @@
         <div v-show="showWebFilter" class="select-bar-content exchange" :class="{'unfold' : !foldExchange}">
           <span class="title">交易所</span>
           <div class="fr">
-            <span class="ellipsis" v-show="webs.length>3 && foldExchange">...</span>
+            <span class="ellipsis" v-show="webs.length>1 && foldExchange">...</span>
             <span class="amount">{{checkedWebs.length}}</span>
             <i class="fold-button"
                :class="{'el-icon-caret-left' : foldExchange, 'el-icon-caret-bottom' : !foldExchange}"
-               v-show="webs.length>3"
+               v-show="webs.length>1"
                @click="clickFoldExchange('web')"></i>
           </div>
           <el-checkbox-button :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全部</el-checkbox-button>
@@ -46,11 +46,11 @@
         <div v-show="showCurrencyFilter" class="select-bar-content currency" :class="{'unfold' : !foldExchange0}">
           <span class="title">币种</span>
           <div class="fr">
-            <span class="ellipsis" v-show="currencies.length>3 && foldExchange0">...</span>
+            <span class="ellipsis" v-show="currencies.length>1 && foldExchange0">...</span>
             <span class="amount">{{checkedCurrencies.length}}</span>
             <i class="fold-button"
                :class="{'el-icon-caret-left' : foldExchange0, 'el-icon-caret-bottom' : !foldExchange0}"
-               v-show="currencies.length>3"
+               v-show="currencies.length>1"
                @click="clickFoldExchange('currency')"></i>
           </div>
           <el-checkbox-button :indeterminate="isIndeterminate0" v-model="checkAll0" @change="handleCheckAllChange0">全部</el-checkbox-button>
@@ -74,8 +74,6 @@
           </el-checkbox-group>
         </div>
       </div>
-    </div>
-    <div class="clearfix">
       <div v-show="!robotStatus" class="search-box fr">
         <el-input v-model="robotAccount" placeholder="通过机器人账户搜索">
           <el-button @click="searchByAccount" slot="append" icon="el-icon-search"></el-button>
@@ -564,8 +562,8 @@
     float: right;
     .select-bar-content {
       float: left;
+      width: 260px;
       margin-left: 10px;
-      width: 410px;
       padding: 5px 10px 0 65px;
       background-color: #fff;
       border-radius:4px;
@@ -573,6 +571,9 @@
       z-index: 100;
       height: 38px;
       overflow: hidden;
+      &.pair {
+        width: 410px;
+      }
       .amount {
         line-height: 26px;
 
@@ -732,7 +733,7 @@
     margin-top: 100px;
   }
   .search-box {
-    width: 410px;
+    width: 300px;
     margin: 0px 0 20px 0;
   }
 </style>