blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

[improvement] NoticeBar: add less vars

Browse Source
This commit is contained in:
陈嘉涵 2019-05-16 16:49:22 +08:00
parent 7d37091f00
commit 6fc31f27fa
2 changed files with 21 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/notice-bar/index.less
View File

@ -4,17 +4,17 @@
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
height: 40px; height: @notice-bar-height;
padding: 0 15px; padding: @notice-bar-padding;
color: @orange-dark; color: @notice-bar-text-color;
font-size: 14px; font-size: @notice-bar-font-size;
line-height: 24px; line-height: @notice-bar-line-height;
background-color: @orange-light; background-color: @notice-bar-background-color;
&__left-icon, &__left-icon,
&__right-icon { &__right-icon {
min-width: 22px; min-width: @notice-bar-icon-min-width;
font-size: 16px; font-size: @notice-bar-icon-size;
} }
&__right-icon { &__right-icon {
@ -24,7 +24,7 @@
&__wrap { &__wrap {
position: relative; position: relative;
flex: 1; flex: 1;
height: 24px; height: @notice-bar-line-height;
overflow: hidden; overflow: hidden;
} }
@ -47,7 +47,7 @@
&--wrapable { &--wrapable {
height: auto; height: auto;
padding: 8px 15px; padding: @notice-bar-wrapable-padding;
.van-notice-bar { .van-notice-bar {
&__wrap { &__wrap {

11
packages/style/var.less
View File

@ -285,6 +285,17 @@
@nav-bar-title-font-size: 16px; @nav-bar-title-font-size: 16px;
@nav-bar-title-text-color: @text-color; @nav-bar-title-text-color: @text-color;
// NoticeBar
@notice-bar-height: 40px;
@notice-bar-padding: 0 15px;
@notice-bar-wrapable-padding: 8px 15px;
@notice-bar-text-color: @orange-dark;
@notice-bar-font-size: 14px;
@notice-bar-line-height: 24px;
@notice-bar-background-color: @orange-light;
@notice-bar-icon-size: 16px;
@notice-bar-icon-min-width: 22px;
// Notify // Notify
@notify-padding: 6px 15px; @notify-padding: 6px 15px;
@notify-font-size: 14px; @notify-font-size: 14px;