weui
Version:
A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.
132 lines (128 loc) • 3.16 kB
text/less
/*
* Tencent is pleased to support the open source community by making WeUI available.
*
* Copyright (C) 2017 THL A29 Limited, a Tencent company. All rights reserved.
*
* Licensed under the MIT License (the "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://opensource.org/licenses/MIT
*
* Unless required by applicable law or agreed to in writing, software distributed under the License is
* distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
* either express or implied. See the License for the specific language governing permissions and
* limitations under the License.
*/
@import "../../base/fn";
@import "../weui-button/weui-button";
a {
.weui-msg__desc &,
.weui-msg__desc-primary &,
.weui-msg__tips & {
color: @weuiLinkColorDefault;
display: inline-block;
vertical-align: baseline;
}
}
.weui-msg {
padding-top: @weuiMsgPaddingTop;
padding: calc(@weuiMsgPaddingTop ~"+ constant(safe-area-inset-top)") constant(safe-area-inset-right) constant(safe-area-inset-bottom) constant(safe-area-inset-left);
padding: calc(@weuiMsgPaddingTop ~"+ env(safe-area-inset-top)") env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
text-align: center;
line-height: 1.4;
min-height: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
background-color: var(--weui-BG-2);
}
.weui-msg__icon-area {
margin-bottom: 32px;
}
.weui-msg__text-area {
margin-bottom: 32px;
padding: 0 32px;
flex: 1;
line-height: 1.6;
.hyphens;
&:first-child { padding-top: 96px; }
}
.weui-msg__title {
margin-bottom: @weuiMsgTitleGap;
font-weight: 500;
font-size: 22px;
color: @weuiTextColorTitle;
}
.weui-msg__desc {
font-size: 17px;
font-weight: 400;
color: @weuiTextColorTitle;
margin-bottom: 16px;
}
.weui-msg__desc-primary {
font-size: 14px;
color: @weuiTextColorDesc;
margin-bottom: 16px;
}
.weui-msg__custom-area {
text-align: left;
word-wrap: break-word;
hyphens: auto;
margin-bottom: 16px;
.weui-msg__title + & {
margin-top: 48px;
}
.weui-msg__desc + &,
.weui-msg__desc-primary + & {
margin-top: 40px;
}
.weui-cells__group_form {
.weui-cells {
margin: 0;
}
}
}
.weui-msg__opr-area {
margin-bottom: 16px;
.weui-btn-area { margin: 0; }
.weui-btn + .weui-btn { margin-bottom: 16px; }
&:last-child { margin-bottom: 96px; }
& + .weui-msg__extra-area {
margin-top: 48px;
}
}
.weui-msg__tips-area {
margin-bottom: 16px;
padding: 0 40px;
.hyphens;
.weui-msg__opr-area + & {
margin-bottom: 48px;
}
&:last-child {
margin-bottom: 64px;
}
}
.weui-msg__tips {
font-size: 14px;
color: @weuiTextColorDesc;
}
.weui-msg__extra-area {
margin-bottom: 24px;
padding: 0 32px;
box-sizing: border-box;
font-size: 12px;
color: @weuiTextColorDesc;
a,
navigator {
color: @weuiLinkColorDefault;
}
navigator {
display: inline;
}
}
// 部分场景需要去掉头部间距
.weui-msg_align-top {
.weui-msg__text-area {
&:first-child { padding-top: 0; }
}
}