tt-mp
Version:
一套组件化、可复用、易扩展的头条小程序 UI 组件库
58 lines (49 loc) • 912 B
text/less
@import '../styles/mixins/index.less';
@import '../styles/themes/index.less';
.@{wux-prefix}-notification {
position: absolute;
top: -2rem;
right: 0;
left: 0;
z-index: @z-index-notification;
width: 100%;
min-height: 4rem;
padding-top: 2rem;
font-size: 0.8rem;
color: @text-color-inverse;
background-color: @notification-bg;
&__content {
display: flex;
padding: 0.3rem 0.6rem 1rem 0.6rem;
align-items: flex-start;
}
&__hd {
width: 1rem;
height: 1rem;
}
&__image {
width: 100%;
height: 100%;
}
&__bd {
width: 100%;
margin: 0 0.4rem;
}
&__title {
font-weight: bold;
}
&__text {
line-height: 1;
}
&__ft {
position: absolute;
bottom: 0.2rem;
left: 50%;
width: 2rem;
height: 0.3rem;
background: white;
border-radius: 0.15rem;
opacity: 0.5;
transform: translate3d(-50%, 0, 0);
}
}