feat(Picker): update action button style (#3316)

This commit is contained in:
neverland 2020-06-24 17:38:15 +08:00 committed by GitHub
parent 11dd8df9d4
commit b4cfcceca8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 8 deletions

View File

@ -27,6 +27,7 @@
@disabled-opacity: 0.5; @disabled-opacity: 0.5;
@background-color: @gray-1; @background-color: @gray-1;
@background-color-light: #fafafa; @background-color-light: #fafafa;
@text-link-color: #576b95;
// Padding // Padding
@padding-base: 4px; @padding-base: 4px;
@ -328,8 +329,8 @@
@picker-title-font-size: @font-size-lg; @picker-title-font-size: @font-size-lg;
@picker-action-padding: 0 @padding-md; @picker-action-padding: 0 @padding-md;
@picker-action-font-size: @font-size-md; @picker-action-font-size: @font-size-md;
@picker-action-text-color: @blue; @picker-confirm-action-color: @text-link-color;
@picker-action-active-color: @active-color; @picker-cancel-action-color: @gray-6;
@picker-option-font-size: @font-size-lg; @picker-option-font-size: @font-size-lg;
@picker-option-text-color: @black; @picker-option-text-color: @black;
@picker-loading-icon-color: @blue; @picker-loading-icon-color: @blue;

View File

@ -19,13 +19,20 @@
&__confirm { &__confirm {
.theme(padding, '@picker-action-padding'); .theme(padding, '@picker-action-padding');
.theme(font-size, '@picker-action-font-size'); .theme(font-size, '@picker-action-font-size');
.theme(color, '@picker-action-text-color');
&--hover { &--hover {
.theme(background-color, '@picker-action-active-color'); opacity: @active-opacity;
} }
} }
&__confirm {
.theme(color, '@picker-confirm-action-color');
}
&__cancel {
.theme(color, '@picker-cancel-action-color');
}
&__title { &__title {
max-width: 50%; max-width: 50%;
text-align: center; text-align: center;
@ -75,13 +82,12 @@
pointer-events: none; pointer-events: none;
} }
&__loading .van-loading,
&__frame { &__frame {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 0; right: @padding-md;
left: @padding-md;
z-index: 1; z-index: 1;
width: 100%;
transform: translateY(-50%); transform: translateY(-50%);
pointer-events: none; pointer-events: none;
} }

View File

@ -1,7 +1,7 @@
<template name="toolbar"> <template name="toolbar">
<view <view
wx:if="{{ showToolbar }}" wx:if="{{ showToolbar }}"
class="van-picker__toolbar van-hairline--top-bottom toolbar-class" class="van-picker__toolbar toolbar-class"
> >
<view <view
class="van-picker__cancel" class="van-picker__cancel"