修改湖畔好店页面搜索框的位置

packages/localLife/index/index.css

@@ -6,17 +6,29 @@ page {
     /* padding-top: 100rpx; */
 }
 
-.local {
-    display: flex;
-    align-items: center;
+.localBox {
     font-size: 26rpx;
     color: #222222;
     box-sizing: border-box;
-    padding: 20rpx;
     width: 100%;
+    padding: 20rpx 0;
+    background-color: #f6f7fb;
+}
+
+.localBoxItem{
+    width: 100%;
+    display: flex;
+    align-items: center;
+    padding: 0 20rpx;
     background-color: #fff;
 }
 
+.local {
+    display: flex;
+    width: auto;
+    white-space: nowrap;
+}
+
 #local {
     height: 30rpx;
     width: 28.08rpx;
@@ -28,16 +40,16 @@ page {
 }
 
 .search {
-    background-color: #f6f7fb;
+    flex: 1;
     padding: 20rpx 0;
+    margin-left: 15rpx;
 }
 
 .searchBox {
-    width: 710rpx;
+    width: 93%;
     height: 70rpx;
-    background: #FFFFFF;
-    border-radius: 100rpx 100rpx 100rpx 100rpx;
-    margin: 0 auto;
+    background: #f6f7fb;
+    border-radius: 100rpx;
     display: flex;
     box-sizing: border-box;
     align-items: center;

packages/localLife/index/index.vue

@@ -1,7 +1,10 @@
 <template>
   <view class="container">
+    <view class="localBox">
+      <view class="localBoxItem">
         <view class="local">
-      <image id="local" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_localIcon.png"
+          <image id="local"
+            src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_localIcon.png"
             mode="aspectFill"></image>
           {{ address }}
           <u-icon name="arrow-down" color="#999999" size="28"></u-icon>
@@ -9,11 +12,14 @@
 
         <view class="search">
           <view class="searchBox">
-        <image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
+            <image
+              src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
               mode="aspectFill"></image>
             <input type="text" placeholder="请输入您想搜索的内容" />
           </view>
         </view>
+      </view>
+    </view>
 
     <view class="swiperBox">
       <swiper class="swiper" @change="swiperChange" :current="currentIndex">