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

This commit is contained in:
陈嘉涵 2020-01-27 12:26:53 +08:00
parent a5819c286e
commit ea74194990
5 changed files with 15 additions and 16 deletions

View File

@ -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 {

View File

@ -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',

View File

@ -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">

View File

@ -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">

View File

@ -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;