neverland 1a7889590f
perf: remove CSS variables polyfill (#4487)
* perf: remove CSS variables polyfill

* style: fix missing calc value

* perf: reduce some useless css vars
2021-09-23 17:31:28 +08:00

70 lines
1.6 KiB
Plaintext

@import '../common/style/var.less';
.van-notice-bar {
display: flex;
align-items: center;
height: var(--notice-bar-height, @notice-bar-height);
padding: var(--notice-bar-padding, @notice-bar-padding);
font-size: var(--notice-bar-font-size, @notice-bar-font-size);
color: var(--notice-bar-text-color, @notice-bar-text-color);
line-height: var(--notice-bar-line-height, @notice-bar-line-height);
background-color: var(
--notice-bar-background-color,
@notice-bar-background-color
);
&--withicon {
position: relative;
padding-right: 40px;
}
&--wrapable {
height: auto;
padding: var(--notice-bar-wrapable-padding, @notice-bar-wrapable-padding);
.van-notice-bar {
&__wrap {
height: auto;
}
&__content {
position: relative;
white-space: normal;
}
}
}
&__left-icon {
display: flex;
align-items: center;
margin-right: 4px;
vertical-align: middle;
font-size: var(--notice-bar-icon-size, @notice-bar-icon-size);
min-width: var(--notice-bar-icon-min-width, @notice-bar-icon-min-width);
}
&__right-icon {
position: absolute;
top: 10px;
right: 15px;
font-size: var(--notice-bar-icon-size, @notice-bar-icon-size);
min-width: var(--notice-bar-icon-min-width, @notice-bar-icon-min-width);
}
&__wrap {
position: relative;
flex: 1;
overflow: hidden;
height: var(--notice-bar-line-height, @notice-bar-line-height);
}
&__content {
position: absolute;
white-space: nowrap;
&.van-ellipsis {
max-width: 100%;
}
}
}