fix(DropdownItem): missing default active color (#4330)

This commit is contained in:
neverland 2019-09-03 09:57:58 +08:00 committed by GitHub
parent b28579cfdf
commit ad4f76bdbd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 20 additions and 11 deletions

View File

@ -82,7 +82,7 @@ export default createComponent({
key={option.value}
icon={option.icon}
title={option.text}
class={bem('option')}
class={bem('option', { active })}
style={{ color: active ? activeColor : '' }}
onClick={() => {
this.showPopup = false;

View File

@ -8,6 +8,14 @@
&__option {
text-align: left;
&--active {
color: @dropdown-menu-option-active-color;
.van-dropdown-item__icon {
color: @dropdown-menu-option-active-color;
}
}
}
&--up {

View File

@ -10,7 +10,7 @@ exports[`click option 1`] = `
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell__title"><span>A</span></div>
</div>
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>B</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -29,7 +29,7 @@ exports[`close-on-click-outside 1`] = `
<div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s; display: none;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -87,7 +87,7 @@ exports[`direction up 2`] = `
<div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title van-dropdown-menu__title--down"><div class="van-ellipsis">A</div></span></div>
<div class="van-dropdown-item van-dropdown-item--up" style="z-index: 10; bottom: 1000px;">
<div class="van-popup van-popup--bottom van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-bottom">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -109,7 +109,7 @@ exports[`disable close-on-click-outside 1`] = `
<div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -140,7 +140,7 @@ exports[`render option icon 1`] = `
<div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option"><i class="van-icon van-icon-success van-cell__left-icon">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active"><i class="van-icon van-icon-success van-cell__left-icon">
<!----></i>
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
@ -164,7 +164,7 @@ exports[`show dropdown item 1`] = `
<div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -186,7 +186,7 @@ exports[`show dropdown item 2`] = `
<div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title van-dropdown-menu__title--active van-dropdown-menu__title--down"><div class="van-ellipsis">A</div></span></div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0s; display: none;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -198,7 +198,7 @@ exports[`show dropdown item 2`] = `
</div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -217,7 +217,7 @@ exports[`show dropdown item 3`] = `
<div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0s; display: none;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>
@ -229,7 +229,7 @@ exports[`show dropdown item 3`] = `
</div>
<div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
<div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s; display: none;" name="van-popup-slide-top">
<div class="van-cell van-cell--clickable van-dropdown-item__option">
<div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
<div class="van-cell__title"><span>A</span></div>
<div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
<!----></i></div>

View File

@ -260,6 +260,7 @@
@dropdown-menu-title-disabled-text-color: @gray-dark;
@dropdown-menu-title-padding: 0 @padding-xs;
@dropdown-menu-title-line-height: 18px;
@dropdown-menu-option-active-color: @blue;
// Field
@field-label-width: 90px;