feat(Search): add @search-content-background-color var

src/search/index.less

@@ -5,12 +5,13 @@
   align-items: center;
   box-sizing: border-box;
   padding: @search-padding;
+  background-color: @search-background-color;
 
   &__content {
     display: flex;
     flex: 1;
     padding-left: @padding-xs;
-    background-color: @search-background-color;
+    background-color: @search-content-background-color;
     border-radius: @border-radius-sm;
 
     &--round {

src/search/index.tsx

@@ -126,6 +126,7 @@ Search.props = {
   rightIcon: String,
   actionText: String,
   showAction: Boolean,
+  background: String,
   shape: {
     type: String,
     default: 'square',
@@ -134,10 +135,6 @@ Search.props = {
     type: Boolean,
     default: true,
   },
-  background: {
-    type: String,
-    default: '#fff',
-  },
   leftIcon: {
     type: String,
     default: 'search',

src/search/test/__snapshots__/demo.spec.js.snap

@@ -3,7 +3,7 @@
 exports[`renders demo correctly 1`] = `
 <div>
   <div>
-    <div class="van-search" style="background: rgb(255, 255, 255);">
+    <div class="van-search">
       <div class="van-search__content van-search__content--square">
         <div class="van-cell van-cell--borderless van-field">
           <div class="van-field__left-icon"><i class="van-icon van-icon-search">
@@ -17,7 +17,7 @@ exports[`renders demo correctly 1`] = `
   </div>
   <div>
     <form action="/">
-      <div class="van-search van-search--show-action" style="background: rgb(255, 255, 255);">
+      <div class="van-search van-search--show-action">
         <div class="van-search__content van-search__content--square">
           <div class="van-cell van-cell--borderless van-field">
             <div class="van-field__left-icon"><i class="van-icon van-icon-search">
@@ -32,7 +32,7 @@ exports[`renders demo correctly 1`] = `
     </form>
   </div>
   <div>
-    <div class="van-search" style="background: rgb(255, 255, 255);">
+    <div class="van-search">
       <div class="van-search__content van-search__content--square">
         <div class="van-cell van-cell--borderless van-field">
           <div class="van-field__left-icon"><i class="van-icon van-icon-search">
@@ -45,7 +45,7 @@ exports[`renders demo correctly 1`] = `
     </div>
   </div>
   <div>
-    <div class="van-search" style="background: rgb(255, 255, 255);">
+    <div class="van-search">
       <div class="van-search__content van-search__content--square">
         <div class="van-cell van-cell--borderless van-field">
           <div class="van-field__left-icon"><i class="van-icon van-icon-search">
@@ -71,7 +71,7 @@ exports[`renders demo correctly 1`] = `
     </div>
   </div>
   <div>
-    <div class="van-search van-search--show-action" style="background: rgb(255, 255, 255);">
+    <div class="van-search van-search--show-action">
       <div class="van-search__content van-search__content--square">
         <div class="van-search__label">地址</div>
         <div class="van-cell van-cell--borderless van-field">

src/search/test/__snapshots__/index.spec.js.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`action-text prop 1`] = `
-<div class="van-search van-search--show-action" style="background: rgb(255, 255, 255);">
+<div class="van-search van-search--show-action">
   <div class="van-search__content van-search__content--square">
     <div class="van-cell van-cell--borderless van-field">
       <div class="van-field__left-icon"><i class="van-icon van-icon-search">
@@ -16,7 +16,7 @@ exports[`action-text prop 1`] = `
 `;
 
 exports[`label slot 1`] = `
-<div class="van-search" style="background: rgb(255, 255, 255);">
+<div class="van-search">
   <div class="van-search__content van-search__content--square">
     <div class="van-search__label">Custom Label</div>
     <div class="van-cell van-cell--borderless van-field">
@@ -31,7 +31,7 @@ exports[`label slot 1`] = `
 `;
 
 exports[`left-icon prop 1`] = `
-<div class="van-search" style="background: rgb(255, 255, 255);">
+<div class="van-search">
   <div class="van-search__content van-search__content--square">
     <div class="van-cell van-cell--borderless van-field">
       <div class="van-field__left-icon"><i class="van-icon van-icon-setting-o">
@@ -45,7 +45,7 @@ exports[`left-icon prop 1`] = `
 `;
 
 exports[`right-icon prop 1`] = `
-<div class="van-search" style="background: rgb(255, 255, 255);">
+<div class="van-search">
   <div class="van-search__content van-search__content--square">
     <div class="van-cell van-cell--borderless van-field">
       <div class="van-field__left-icon"><i class="van-icon van-icon-search">
@@ -62,7 +62,7 @@ exports[`right-icon prop 1`] = `
 `;
 
 exports[`right-icon slot 1`] = `
-<div class="van-search" style="background: rgb(255, 255, 255);">
+<div class="van-search">
   <div class="van-search__content van-search__content--square">
     <div class="van-cell van-cell--borderless van-field">
       <div class="van-field__left-icon"><i class="van-icon van-icon-search">

src/style/var.less

@@ -553,7 +553,8 @@
 
 // Search
 @search-padding: 10px @padding-sm;
-@search-background-color: @gray-1;
+@search-background-color: @white;
+@search-content-background-color: @gray-1;
 @search-input-height: 34px;
 @search-label-padding: 0 5px;
 @search-label-color: @text-color;