前言：
在小程序的日常开发中，会遇到很多官方的原生样式无法达到我们UI想实现的效果，那么我们使用组件名称去进行覆盖却不能完整的实现想要的效果，举个例子：更改原生进度条的进度颜色为渐变，使用官方的样式只能更改为16进制的纯色的hexColor。那么怎么解决？找到官方原生样式直接覆盖即可，接下来会同步微信、支付宝的原生样式，按需拿取，文章仅作记录使用。
微信小程序
wx-action-sheet-item {
background-color: #FFFFFF;
position: relative;
padding: 10px 0;
text-align: center;
font-size: 18px;
display: block;
}
wx-action-sheet-item:before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
wx-action-sheet-item:active {
background-color: #ECECEC;
}
wx-action-sheet .wx-action-sheet {
position: fixed;
left: 0;
bottom: 0;
-webkit-transform: translate(0, 100%);
transform: translate(0, 100%);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 5000;
width: 100%;
background-color: #FFFFFF;
transition: -webkit-transform .3s;
transition: transform .3s;
transition: transform .3s, -webkit-transform .3s;
}
wx-action-sheet .wx-action-sheet-show {
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
wx-action-sheet .wx-action-sheet-menu {
background-color: #FFFFFF;
}
wx-action-sheet .wx-action-sheet-mask {
position: fixed;
z-index: 1000;
width: 100%;
height: 100%;
top: 0;
left: 0;
transition: background-color 0.3s;
background-color: rgba(0, 0, 0, 0.6);
}
wx-audio {
display: inline-block;
line-height: 0;
}
wx-audio[hidden] {
display: none;
}
wx-audio > .wx-audio-default {
max-width: 100%;
min-width: 302px;
height: 65px;
background: #fcfcfc;
border: 1px solid #e0e0e0;
border-radius: 2.5px;
display: inline-block;
overflow: hidden;
}
wx-audio > .wx-audio-default > .wx-audio-left {
width: 65px;
height: 65px;
float: left;
background-color: #e6e6e6;
background-size: 100% 100%;
background-position: 50% 50%;
}
wx-audio > .wx-audio-default > .wx-audio-left > .wx-audio-button {
width: 24px;
height: 24px;
margin: 20.5px;
background-size: cover;
}
wx-audio > .wx-audio-default > .wx-audio-left > .wx-audio-button.play {
background-image: url('data:image/png;base64,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');
}
wx-audio > .wx-audio-default > .wx-audio-left > .wx-audio-button.pause {
background-image: url('data:image/png;base64,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');
}
wx-audio > .wx-audio-default > .wx-audio-right {
box-sizing: border-box;
height: 65px;
margin-left: 65px;
padding: 11px 16.5px 13.5px 15px;
overflow: hidden;
}
wx-audio > .wx-audio-default > .wx-audio-right > .wx-audio-info {
margin-right: 70px;
overflow: hidden;
}
wx-audio > .wx-audio-default > .wx-audio-right > .wx-audio-info > .wx-audio-name {
height: 22.5px;
line-height: 22.5px;
margin-bottom: 3.5px;
font-size: 14px;
color: #353535;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
wx-audio > .wx-audio-default > .wx-audio-right > .wx-audio-info > .wx-audio-author {
height: 14.5px;
line-height: 14.5px;
font-size: 12px;
color: #888888;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
wx-audio > .wx-audio-default > .wx-audio-right > .wx-audio-time {
margin-top: 3.5px;
height: 16.5px;
font-size: 12px;
color: #888888;
float: right;
}
wx-button {
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
padding-left: 14px;
padding-right: 14px;
box-sizing: border-box;
font-size: 18px;
text-align: center;
text-decoration: none;
line-height: 2.55555556;
border-radius: 5px;
-webkit-tap-highlight-color: transparent;
overflow: hidden;
color: #000000;
background-color: #F8F8F8;
}
wx-button[hidden] {
display: none !important;
}
wx-button:after {
content: " ";
width: 200%;
height: 200%;
position: absolute;
top: 0;
left: 0;
border: 1px solid rgba(0, 0, 0, 0.2);
-webkit-transform: scale(0.5);
transform: scale(0.5);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
box-sizing: border-box;
border-radius: 10px;
}
wx-button[native] {
padding-left: 0;
padding-right: 0;
}
wx-button[native] .wx-button-cover-view-wrapper {
border: inherit;
border-color: inherit;
border-radius: inherit;
background-color: inherit;
width: 100%;
height: 100%;
}
wx-button[native] .wx-button-cover-view-inner {
padding-left: 14px;
padding-right: 14px;
width: 100%;
height: 100%;
}
wx-button wx-cover-view {
line-height: inherit;
white-space: inherit;
}
wx-button[type=default] {
color: #000000;
background-color: #F8F8F8;
}
wx-button[type=primary] {
color: #FFFFFF;
background-color: #1AAD19;
}
wx-button[type=warn] {
color: #FFFFFF;
background-color: #E64340;
}
wx-button[disabled] {
color: rgba(255, 255, 255, 0.6);
}
wx-button[disabled][type=default],
wx-button[disabled]:not([type]) {
color: rgba(0, 0, 0, 0.3);
background-color: #F7F7F7;
}
wx-button[disabled][type=primary] {
background-color: #9ED99D;
}
wx-button[disabled][type=warn] {
background-color: #EC8B89;
}
wx-button[type=primary][plain] {
color: #1aad19;
border: 1px solid #1aad19;
background-color: transparent;
}
wx-button[type=primary][plain][disabled] {
color: rgba(0, 0, 0, 0.2);
border-color: rgba(0, 0, 0, 0.2);
}
wx-button[type=primary][plain]:after {
border-width: 0;
}
wx-button[type=default][plain] {
color: #353535;
border: 1px solid #353535;
background-color: transparent;
}
wx-button[type=default][plain][disabled] {
color: rgba(0, 0, 0, 0.2);
border-color: rgba(0, 0, 0, 0.2);
}
wx-button[type=default][plain]:after {
border-width: 0;
}
wx-button[plain] {
color: #353535;
border: 1px solid #353535;
background-color: transparent;
}
wx-button[plain][disabled] {
color: rgba(0, 0, 0, 0.2);
border-color: rgba(0, 0, 0, 0.2);
}
wx-button[plain]:after {
border-width: 0;
}
wx-button[type=warn][plain] {
color: #e64340;
border: 1px solid #e64340;
background-color: transparent;
}
wx-button[type=warn][plain][disabled] {
color: rgba(0, 0, 0, 0.2);
border-color: rgba(0, 0, 0, 0.2);
}
wx-button[type=warn][plain]:after {
border-width: 0;
}
wx-button[size=mini] {
display: inline-block;
line-height: 2.3;
font-size: 13px;
padding: 0 1.34em;
}
wx-button[size=mini][native] {
padding: 0;
}
wx-button[size=mini][native] .wx-button-cover-view-inner {
padding: 0 1.34em;
}
wx-button[loading]:before {
content: " ";
display: inline-block;
width: 18px;
height: 18px;
vertical-align: middle;
-webkit-animation: wx-button-loading-animate 1s steps(12, end) infinite;
animation: wx-button-loading-animate 1s steps(12, end) infinite;
background: transparent url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iciIgd2lkdGg9JzEyMHB4JyBoZWlnaHQ9JzEyMHB4JyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICAgIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIiBjbGFzcz0iYmsiPjwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjRTlFOUU5JwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoMCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSc0Ni41JyB5PSc0MCcgd2lkdGg9JzcnIGhlaWdodD0nMjAnIHJ4PSc1JyByeT0nNScgZmlsbD0nIzk4OTY5NycKICAgICAgICAgIHRyYW5zZm9ybT0ncm90YXRlKDMwIDUwIDUwKSB0cmFuc2xhdGUoMCAtMzApJz4KICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0naW5kZWZpbml0ZScvPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyM5Qjk5OUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSg2MCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9J2luZGVmaW5pdGUnLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjQTNBMUEyJwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoOTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNBQkE5QUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxMjAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCMkIyQjInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxNTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCQUI4QjknCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxODAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDMkMwQzEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyMTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDQkNCQ0InCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEMkQyRDInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEQURBREEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNFMkUyRTInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0Pgo8L3N2Zz4=) no-repeat;
background-size: 100%;
}
wx-button[loading][type=primary] {
color: rgba(255, 255, 255, 0.6);
background-color: #179B16;
}
wx-button[loading][type=primary][plain] {
color: #1aad19;
background-color: transparent;
}
wx-button[loading][type=default] {
color: rgba(0, 0, 0, 0.6);
background-color: #DEDEDE;
}
wx-button[loading][type=default][plain] {
color: #353535;
background-color: transparent;
}
wx-button[loading][type=warn] {
color: rgba(255, 255, 255, 0.6);
background-color: #CE3C39;
}
wx-button[loading][type=warn][plain] {
color: #e64340;
background-color: transparent;
}
@-webkit-keyframes wx-button-loading-animate {
0% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 360deg);
transform: rotate3d(0, 0, 1, 360deg);
}
}
@keyframes wx-button-loading-animate {
0% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 360deg);
transform: rotate3d(0, 0, 1, 360deg);
}
}
.button-hover {
color: rgba(0, 0, 0, 0.6);
background-color: #DEDEDE;
}
.button-hover[plain] {
color: rgba(53, 53, 53, 0.6);
border-color: rgba(53, 53, 53, 0.6);
background-color: transparent;
}
.button-hover[type=primary] {
color: rgba(255, 255, 255, 0.6);
background-color: #179B16;
}
.button-hover[type=primary][plain] {
color: rgba(26, 173, 25, 0.6);
border-color: rgba(26, 173, 25, 0.6);
background-color: transparent;
}
.button-hover[type=default] {
color: rgba(0, 0, 0, 0.6);
background-color: #DEDEDE;
}
.button-hover[type=default][plain] {
color: rgba(53, 53, 53, 0.6);
border-color: rgba(53, 53, 53, 0.6);
background-color: transparent;
}
.button-hover[type=warn] {
color: rgba(255, 255, 255, 0.6);
background-color: #CE3C39;
}
.button-hover[type=warn][plain] {
color: rgba(230, 67, 64, 0.6);
border-color: rgba(230, 67, 64, 0.6);
background-color: transparent;
}
wx-canvas {
width: 300px;
height: 150px;
display: block;
position: relative;
}
wx-canvas > canvas {
position: absolute;
top: 0;
left: 0;
}
wx-checkbox {
-webkit-tap-highlight-color: transparent;
display: inline-block;
}
wx-checkbox[hidden] {
display: none;
}
wx-checkbox .wx-checkbox-wrapper {
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
vertical-align: middle;
}
wx-checkbox .wx-checkbox-input {
margin-right: 5px;
-webkit-appearance: none;
appearance: none;
outline: 0;
border: 1px solid #D1D1D1;
background-color: #FFFFFF;
border-radius: 3px;
width: 22px;
height: 22px;
position: relative;
}
wx-checkbox .wx-checkbox-input.wx-checkbox-input-checked {
color: #09BB07;
}
wx-checkbox .wx-checkbox-input.wx-checkbox-input-checked:before {
font: normal normal normal 14px/1 "weui";
content: "\EA08";
font-size: 22px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -48%) scale(0.73);
-webkit-transform: translate(-50%, -48%) scale(0.73);
}
wx-checkbox .wx-checkbox-input.wx-checkbox-input-disabled {
background-color: #E1E1E1;
}
wx-checkbox .wx-checkbox-input.wx-checkbox-input-disabled:before {
color: #ADADAD;
}
wx-checkbox-group {
display: block;
}
wx-checkbox-group[hidden] {
display: none;
}
wx-icon {
display: inline-block;
font-size: 0;
}
wx-icon[hidden] {
display: none;
}
wx-icon i {
font: normal normal normal 14px/1 "weui";
}
@font-face {
font-weight: normal;
font-style: normal;
font-family: "weui";
src: url('data:application/octet-stream;base64,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') format('truetype');
}
[class^="wx-icon-"]:before,
[class*=" wx-icon-"]:before {
margin: 0;
}
.wx-icon-success {
color: #09BB07;
}
.wx-icon-success:before {
content: "\EA06";
}
.wx-icon-info {
color: #10AEFF;
}
.wx-icon-info:before {
content: "\EA03";
}
.wx-icon-warn {
color: #F76260;
}
.wx-icon-warn:before {
content: "\EA0B";
}
.wx-icon-waiting {
color: #10AEFF;
}
.wx-icon-waiting:before {
content: "\EA09";
}
.wx-icon-safe_success {
color: #09BB07;
}
.wx-icon-safe_success:before {
content: "\EA04";
}
.wx-icon-safe_warn {
color: #FFBE00;
}
.wx-icon-safe_warn:before {
content: "\EA05";
}
.wx-icon-success_circle {
color: #09BB07;
}
.wx-icon-success_circle:before {
content: "\EA07";
}
.wx-icon-success_no_circle {
color: #09BB07;
}
.wx-icon-success_no_circle:before {
content: "\EA08";
}
.wx-icon-waiting_circle {
color: #10AEFF;
}
.wx-icon-waiting_circle:before {
content: "\EA0A";
}
.wx-icon-circle {
color: #C9C9C9;
}
.wx-icon-circle:before {
content: "\EA01";
}
.wx-icon-download {
color: #09BB07;
}
.wx-icon-download:before {
content: "\EA02";
}
.wx-icon-info_circle {
color: #09BB07;
}
.wx-icon-info_circle:before {
content: "\EA0C";
}
.wx-icon-cancel {
color: #F43530;
}
.wx-icon-cancel:before {
content: "\EA0D";
}
.wx-icon-search {
color: #B2B2B2;
}
.wx-icon-search:before {
content: "\EA0E";
}
.wx-icon-clear {
color: #B2B2B2;
}
.wx-icon-clear:before {
content: "\EA0F";
}
[class^="wx-icon-"]:before,
[class*=" wx-icon-"]:before {
box-sizing: border-box;
}
wx-image {
width: 320px;
height: 240px;
display: inline-block;
overflow: hidden;
}
wx-image[hidden] {
display: none;
}
wx-image > div {
width: 100%;
height: 100%;
}
wx-image > img {
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
display: block;
}
.input-placeholder {
color: gray;
}
wx-input {
display: block;
height: 1.4rem;
text-overflow: clip;
overflow: hidden;
white-space: nowrap;
font-family: UICTFontTextStyleBody;
min-height: 1.4rem;
}
wx-input input {
position: relative;
min-height: 1.4rem;
border: none;
height: inherit;
width: 100%;
font-size: inherit;
font-weight: inherit;
font-family: UICTFontTextStyleBody;
color: inherit;
background: transparent;
display: inherit;
padding: 0;
margin: 0;
outline: none;
vertical-align: middle;
text-align: inherit;
overflow: inherit;
white-space: inherit;
text-overflow: inherit;
-webkit-tap-highlight-color: transparent;
z-index: 2;
}
wx-input[hidden] {
display: none;
}
wx-input div {
position: relative;
min-height: 1.4rem;
text-overflow: inherit;
border: none;
height: inherit;
width: inherit;
font-size: inherit;
font-weight: inherit;
font-family: UICTFontTextStyleBody;
color: inherit;
background: inherit;
padding: 0;
margin: 0;
outline: none;
text-align: inherit;
-webkit-tap-highlight-color: transparent;
}
wx-input div[type=password] div {
color: black;
}
wx-input div div {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
line-height: 100%;
height: inherit;
min-height: 1.4rem;
white-space: pre;
text-align: inherit;
overflow: hidden;
vertical-align: middle;
z-index: 1;
}
wx-input ul {
position: fixed;
left: 0;
right: 0;
z-index: 999999;
padding: 0;
background-color: white;
border: 0.5px solid #cccccc;
max-height: 204px;
min-height: 51px;
overflow: auto;
}
wx-input ul li {
display: block;
padding: 10px;
position: relative;
padding: 10px 0;
border-bottom: 0.5px solid #cccccc;
margin: 0 15px;
}
wx-input ul li:last-child {
border-bottom: none;
}
wx-input ul li .title {
font-weight: bold;
font-size: 18px;
margin-right: 50px;
}
wx-input ul li .content {
font-size: 12px;
color: #cccccc;
margin-right: 50px;
}
wx-input ul li .del {
position: absolute;
width: 50px;
height: 50px;
line-height: 50px;
top: 50%;
right: 0;
margin-top: -25px;
text-align: center;
}
.wx-loading {
position: fixed;
z-index: 2000000000;
width: 7.6em;
min-height: 7.6em;
top: 180px;
left: 50%;
margin-left: -3.8em;
background: rgba(40, 40, 40, 0.75);
text-align: center;
border-radius: 5px;
color: #FFFFFF;
font-size: 16px;
line-height: normal;
}
.wx-loading-icon {
margin: 30px 0 10px;
width: 38px;
height: 38px;
vertical-align: baseline;
display: inline-block;
-webkit-animation: weuiLoading 1s steps(12, end) infinite;
animation: weuiLoading 1s steps(12, end) infinite;
background: transparent url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iciIgd2lkdGg9JzEyMHB4JyBoZWlnaHQ9JzEyMHB4JyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICAgIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIiBjbGFzcz0iYmsiPjwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjRTlFOUU5JwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoMCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSc0Ni41JyB5PSc0MCcgd2lkdGg9JzcnIGhlaWdodD0nMjAnIHJ4PSc1JyByeT0nNScgZmlsbD0nIzk4OTY5NycKICAgICAgICAgIHRyYW5zZm9ybT0ncm90YXRlKDMwIDUwIDUwKSB0cmFuc2xhdGUoMCAtMzApJz4KICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0naW5kZWZpbml0ZScvPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyM5Qjk5OUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSg2MCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9J2luZGVmaW5pdGUnLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjQTNBMUEyJwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoOTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNBQkE5QUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxMjAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCMkIyQjInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxNTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCQUI4QjknCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxODAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDMkMwQzEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyMTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDQkNCQ0InCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEMkQyRDInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEQURBREEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNFMkUyRTInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0Pgo8L3N2Zz4=) no-repeat;
background-size: 100%;
}
.wx-loading-content {
margin: 0 0 15px;
}
.wx-loading-mask {
position: fixed;
z-index: 1000;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
@-webkit-keyframes weuiLoading {
0% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 360deg);
}
}
@keyframes weuiLoading {
0% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 360deg);
}
}
wx-map {
position: relative;
width: 300px;
height: 150px;
display: block;
}
wx-map > div > div > div {
display: none;
}
wx-map > div > div > div:first-child {
display: block;
}
.wx-mask {
position: fixed;
z-index: inherit;
width: 100%;
height: 100%;
top: 0;
left: 0;
transition: background-color 0.3s;
background-color: inherit;
}
.wx-mask[show=false] {
display: none;
}
.wx-mask-transparent {
background-color: rgba(0, 0, 0, 0);
}
wx-mask {
z-index: 1000;
position: fixed;
background-color: rgba(0, 0, 0, 0.6);
}
wx-modal .wx-modal-mask {
z-index: inherit;
width: 100%;
height: 100%;
top: 0;
left: 0;
transition: background-color 0.3s;
background-color: inherit;
z-index: 1000;
position: fixed;
background-color: rgba(0, 0, 0, 0.6);
-webkit-animation: fadeIn ease .3s forwards;
animation: fadeIn ease .3s forwards;
}
wx-modal .wx-modal-dialog {
position: fixed;
z-index: 5000;
width: 85%;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #FAFAFC;
text-align: center;
border-radius: 3px;
overflow: hidden;
}
wx-modal .wx-modal-dialog-hd {
padding: 1.2em 20px .5em;
}
wx-modal .wx-modal-dialog-hd strong {
font-weight: normal;
font-size: 17px;
}
wx-modal .wx-modal-dialog-bd {
text-align: left;
padding: 0 20px;
font-size: 15px;
color: #888;
word-wrap: break-word;
word-break: break-all;
}
wx-modal .wx-modal-dialog-ft {
position: relative;
line-height: 42px;
margin-top: 20px;
font-size: 17px;
display: -webkit-flex;
display: flex;
}
wx-modal .wx-modal-dialog-ft:before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #D5D5D6;
color: #D5D5D6;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
wx-modal .wx-modal-dialog-ft a {
position: relative;
display: block;
-webkit-flex: 1;
flex: 1;
text-decoration: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
wx-modal .wx-modal-dialog-ft a[hidden] {
display: none;
}
wx-modal .wx-modal-dialog-ft a:active {
background-color: #eee;
}
wx-modal .wx-modal-btn-primary {
color: #3CC51F;
}
wx-modal .wx-modal-btn-default {
color: #000000;
}
wx-modal .wx-modal-btn-default:before {
content: " ";
position: absolute;
right: 0;
top: 0;
width: 1px;
height: 100%;
border-right: 1px solid #D5D5D6;
color: #D5D5D6;
-webkit-transform-origin: 100% 0;
transform-origin: 100% 0;
-webkit-transform: scaleX(0.5);
transform: scaleX(0.5);
}
@media screen and (min-width: 1024px) {
wx-modal .wx-modal-dialog {
width: 35%;
}
}
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
wx-picker {
display: block;
}
wx-picker-view {
display: block;
}
wx-picker-view .wrapper {
display: -webkit-flex;
display: flex;
position: relative;
overflow: hidden;
}
wx-picker-view[hidden] {
display: none;
}
wx-picker-view-column {
-webkit-flex: 1;
flex: 1;
position: relative;
height: 100%;
overflow: hidden;
}
.wx-picker__mask {
transform: translateZ(0);
-webkit-transform: translateZ(0);
}
.wx-picker__indicator,
.wx-picker__mask {
position: absolute;
left: 0;
width: 100%;
z-index: 3;
}
.wx-picker__mask {
top: 0;
height: 100%;
margin: 0 auto;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6)), linear-gradient(0deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6));
background-position: top,bottom;
background-size: 100% 102px;
background-repeat: no-repeat;
}
.wx-picker__indicator {
height: 34px;
top: 102px;
}
.wx-picker__indicator,
.wx-picker__mask {
position: absolute;
left: 0;
width: 100%;
z-index: 3;
pointer-events: none;
}
.wx-picker__content {
position: absolute;
top: 0;
left: 0;
width: 100%;
will-change: transform;
}
.wx-picker__indicator:after,
.wx-picker__indicator:before {
content: " ";
position: absolute;
left: 0;
right: 0;
height: 1px;
color: #e5e5e5;
}
.wx-picker__indicator:before {
top: 0;
border-top: 1px solid #e5e5e5;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.wx-picker__indicator:after {
bottom: 0;
border-bottom: 1px solid #e5e5e5;
-webkit-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.wx-picker__indicator:after,
.wx-picker__indicator:before {
content: " ";
position: absolute;
left: 0;
right: 0;
height: 1px;
color: #e5e5e5;
}
wx-progress {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
wx-progress[hidden] {
display: none;
}
.wx-progress-bar {
-webkit-flex: 1;
flex: 1;
}
.wx-progress-inner-bar {
width: 0;
height: 100%;
}
.wx-progress-info {
margin-top: 0;
margin-bottom: 0;
min-width: 2em;
margin-left: 15px;
font-size: 16px;
}
wx-radio {
-webkit-tap-highlight-color: transparent;
display: inline-block;
}
wx-radio[hidden] {
display: none;
}
wx-radio .wx-radio-wrapper {
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
vertical-align: middle;
}
wx-radio .wx-radio-input {
-webkit-appearance: none;
appearance: none;
margin-right: 5px;
outline: 0;
border: 1px solid #D1D1D1;
background-color: #ffffff;
border-radius: 50%;
width: 22px;
height: 22px;
position: relative;
}
wx-radio .wx-radio-input.wx-radio-input-checked {
background-color: #09BB07;
border-color: #09BB07;
}
wx-radio .wx-radio-input.wx-radio-input-checked:before {
font: normal normal normal 14px/1 "weui";
content: "\EA08";
color: #ffffff;
font-size: 18px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -48%) scale(0.73);
-webkit-transform: translate(-50%, -48%) scale(0.73);
}
wx-radio .wx-radio-input.wx-radio-input-disabled {
background-color: #E1E1E1;
border-color: #D1D1D1;
}
wx-radio .wx-radio-input.wx-radio-input-disabled:before {
color: #ADADAD;
}
wx-radio-group {
display: block;
}
wx-radio-group[hidden] {
display: none;
}
wx-scroll-view {
display: block;
width: 100%;
}
wx-scroll-view[hidden] {
display: none;
}
.wx-scroll-view {
position: relative;
-webkit-overflow-scrolling: touch;
width: 100%;
/* display: flex; 时在安卓下会导致scrollWidth和offsetWidth一样 */
height: 100%;
max-height: inherit;
}
wx-swiper {
display: block;
height: 150px;
}
wx-swiper[hidden] {
display: none;
}
wx-swiper .wx-swiper-wrapper {
overflow: hidden;
position: relative;
width: 100%;
height: 100%;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
wx-swiper .wx-swiper-slides {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
}
wx-swiper .wx-swiper-slide-frame {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
will-change: transform;
}
wx-swiper .wx-swiper-dots {
position: absolute;
font-size: 0;
}
wx-swiper .wx-swiper-dots-horizontal {
left: 50%;
bottom: 10px;
text-align: center;
white-space: nowrap;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
wx-swiper .wx-swiper-dots-horizontal .wx-swiper-dot {
margin-right: 8px;
}
wx-swiper .wx-swiper-dots-horizontal .wx-swiper-dot:last-child {
margin-right: 0;
}
wx-swiper .wx-swiper-dots-vertical {
right: 10px;
top: 50%;
text-align: right;
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
}
wx-swiper .wx-swiper-dots-vertical .wx-swiper-dot {
display: block;
margin-bottom: 9px;
}
wx-swiper .wx-swiper-dots-vertical .wx-swiper-dot:last-child {
margin-bottom: 0;
}
wx-swiper .wx-swiper-dot {
display: inline-block;
width: 8px;
height: 8px;
cursor: pointer;
transition-property: background-color;
transition-timing-function: ease;
background: rgba(0, 0, 0, 0.3);
border-radius: 50%;
}
wx-swiper .wx-swiper-dot-active {
background-color: #000000;
}
wx-swiper-item {
display: block;
overflow: hidden;
will-change: 'transform';
}
wx-swiper-item[hidden] {
display: none;
}
wx-slider {
margin: 10px 18px;
padding: 0;
display: block;
}
wx-slider[hidden] {
display: none;
}
wx-slider .wx-slider-wrapper {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
min-height: 16px;
}
wx-slider .wx-slider-tap-area {
-webkit-flex: 1;
flex: 1;
padding: 8px 0;
}
wx-slider .wx-slider-handle-wrapper {
position: relative;
height: 2px;
border-radius: 5px;
background-color: #e9e9e9;
cursor: pointer;
transition: background-color 0.3s ease;
-webkit-tap-highlight-color: transparent;
}
wx-slider .wx-slider-track {
height: 100%;
border-radius: 6px;
background-color: #1aad19;
transition: background-color 0.3s ease;
}
wx-slider .wx-slider-handle,
wx-slider .wx-slider-thumb {
position: absolute;
left: 50%;
top: 50%;
cursor: pointer;
border-radius: 50%;
transition: border-color 0.3s ease;
}
wx-slider .wx-slider-handle {
width: 28px;
height: 28px;
margin-top: -14px;
margin-left: -14px;
background-color: transparent;
z-index: 3;
}
wx-slider .wx-slider-thumb {
z-index: 2;
box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}
wx-slider .wx-slider-step {
position: absolute;
width: 100%;
height: 2px;
background: transparent;
z-index: 1;
}
wx-slider .wx-slider-value {
color: #888;
font-size: 14px;
margin-left: 1em;
}
wx-slider .wx-slider-disabled .wx-slider-track {
background-color: #ccc;
}
wx-slider .wx-slider-disabled .wx-slider-thumb {
background-color: #FFF;
border-color: #ccc;
}
* {
margin: 0;
}
wx-switch {
-webkit-tap-highlight-color: transparent;
display: inline-block;
}
wx-switch[hidden] {
display: none;
}
wx-switch .wx-switch-wrapper {
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
vertical-align: middle;
}
wx-switch .wx-switch-input {
-webkit-appearance: none;
appearance: none;
position: relative;
width: 52px;
height: 32px;
margin-right: 5px;
border: 1px solid #DFDFDF;
outline: 0;
border-radius: 16px;
box-sizing: border-box;
background-color: #DFDFDF;
transition: background-color 0.1s, border 0.1s;
}
wx-switch .wx-switch-input:before {
content: " ";
position: absolute;
top: 0;
left: 0;
width: 50px;
height: 30px;
border-radius: 15px;
background-color: #FDFDFD;
transition: -webkit-transform .3s;
transition: transform .3s;
transition: transform .3s, -webkit-transform .3s;
}
wx-switch .wx-switch-input:after {
content: " ";
position: absolute;
top: 0;
left: 0;
width: 30px;
height: 30px;
border-radius: 15px;
background-color: #FFFFFF;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
transition: -webkit-transform .3s;
transition: transform .3s;
transition: transform .3s, -webkit-transform .3s;
}
wx-switch .wx-switch-input.wx-switch-input-checked {
border-color: #04BE02;
background-color: #04BE02;
}
wx-switch .wx-switch-input.wx-switch-input-checked:before {
-webkit-transform: scale(0);
transform: scale(0);
}
wx-switch .wx-switch-input.wx-switch-input-checked:after {
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
wx-switch .wx-checkbox-input {
margin-right: 5px;
-webkit-appearance: none;
appearance: none;
outline: 0;
border: 1px solid #D1D1D1;
background-color: #FFFFFF;
border-radius: 3px;
width: 22px;
height: 22px;
position: relative;
color: #09BB07;
}
wx-switch .wx-checkbox-input.wx-checkbox-input-checked:before {
font: normal normal normal 14px/1 "weui";
content: "\EA08";
color: inherit;
font-size: 22px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -48%) scale(0.73);
-webkit-transform: translate(-50%, -48%) scale(0.73);
}
wx-switch .wx-checkbox-input.wx-checkbox-input-disabled {
background-color: #E1E1E1;
}
wx-switch .wx-checkbox-input.wx-checkbox-input-disabled:before {
color: #ADADAD;
}
wx-text[selectable] {
user-select: text;
-webkit-user-select: text;
}
.wx-toast {
position: fixed;
z-index: 2000000000;
width: 7.6em;
min-height: 7.6em;
top: 180px;
left: 50%;
margin-left: -3.8em;
background: rgba(40, 40, 40, 0.75);
text-align: center;
border-radius: 5px;
color: #FFFFFF;
font-size: 16px;
line-height: normal;
}
.wx-toast-icon {
margin-top: 14px;
margin-bottom: 8px;
font-family: weui;
font-style: normal;
}
.wx-toast-content {
margin: 0 0 15px;
}
.wx-toast-mask {
position: fixed;
z-index: 1000;
background-color: rgba(0, 0, 0, 0.6);
width: 100%;
height: 100%;
top: 0;
left: 0;
}
wx-video {
width: 300px;
height: 225px;
display: inline-block;
line-height: 0;
overflow: hidden;
position: relative;
}
wx-video[hidden] {
display: none;
}
wx-video .wx-video-container {
width: 100%;
height: 100%;
background-color: black;
display: inline-block;
position: absolute;
top: 0;
left: 0;
}
wx-video video {
width: 100%;
height: 100%;
}
wx-video .wx-video-bar {
height: 44px;
background-color: rgba(0, 0, 0, 0.5);
overflow: hidden;
position: absolute;
bottom: 0;
right: 0;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
padding: 0 10px;
}
wx-video .wx-video-bar.full {
left: 0;
}
wx-video .wx-video-bar.part {
margin: 5px;
border-radius: 5px;
height: 34px;
}
wx-video .wx-video-bar.none {
display: none;
}
wx-video .wx-video-bar > .wx-video-controls {
display: -webkit-flex;
display: flex;
-webkit-flex-grow: 1;
flex-grow: 1;
margin: 0 8.5px;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-control-button {
width: 13px;
height: 15px;
margin: 14.5px 12.5px 14.5px 0;
background-size: 100%;
background-position: 50% 50%;
background-repeat: no-repeat;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-control-button.play {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAeCAYAAAAy2w7YAAAAAXNSR0IArs4c6QAAAWhJREFUSA1j+P///0cgBoHjQGzCQCsAtgJB/AMy5wCxGNXtQ9iBwvoA5BUCMQvVLEQxHpNzDSjkRhXLMM3GKrIeKKpEkYVYjcUu+AMo3ALE3GRZiN1MvKKPgbIRJFuG10j8koeA0gZEW4jfLIKyf4EqpgOxMEELCRpFnIJ3QGU5QMyM00LizCFa1SWgSkeslhFtBGkKVwGVy6FYSJp+klR/A6quB2JOkIWMIK0oNlOf8xBoZDE9LAI7nYn6HsBq4l96WHQEaLUpAyiOaASeAM2NgvuPBpaACt82IEYtfKls0UagecpwXyAzqGTRdaA57sjmYrAptAjUsCkGYlYMg9EFyLQI1IiZB8Ti6Obh5JNh0QmgHlOcBuKSIMGi50C18UDMiMssvOJEWPQLqKYbiHnxGkRIkoBF24DyaoTMIEoeh0W3geI+RBlArCI0iz4D+RVAzEasfqLVAQ19AcSg5LoYiKWI1kiiQgCMBLnEEcfDSgAAAABJRU5ErkJggg==');
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-control-button.pause {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAgCAYAAAAffCjxAAAAAXNSR0IArs4c6QAAAFlJREFUSA3tksEKACAIQ7X//5zq98wOgQayum8QaGweHhMzG/6OujzKAymn+0LMqivu1XznWmX8/echTIyMyAgTwA72iIwwAexgj8gIE8CO3aMRbDPMaEy5BRGaKcZv8YxRAAAAAElFTkSuQmCC');
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-progress-container {
-webkit-flex-grow: 2;
flex-grow: 2;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-progress-container > .wx-video-progress {
height: 2px;
margin: 21px 12px;
background-color: rgba(255, 255, 255, 0.5);
position: relative;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-progress-container > .wx-video-progress > .wx-video-progress-inner {
width: 100%;
height: 100%;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-progress-container > .wx-video-progress > .wx-video-ball {
width: 16px;
height: 16px;
padding: 14px;
position: absolute;
top: -21px;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-progress-container > .wx-video-progress > .wx-video-ball > .wx-video-inner {
width: 100%;
height: 100%;
background-color: #ffffff;
border-radius: 50%;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-progress-container > .wx-video-progress > .wx-video-inner {
width: 0;
height: 100%;
background-color: #ffffff;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-current-time,
wx-video .wx-video-bar > .wx-video-controls > .wx-video-duration {
height: 14.5px;
line-height: 14.5px;
margin-top: 15px;
margin-bottom: 14.5px;
font-size: 12px;
color: #cbcbcb;
}
wx-video .wx-video-bar > .wx-video-controls > .wx-video-live-button {
height: 14.5px;
line-height: 14.5px;
margin-top: 15px;
margin-bottom: 14.5px;
font-size: 12px;
color: #cbcbcb;
}
wx-video .wx-video-bar > .wx-video-danmu-btn {
white-space: nowrap;
line-height: 1;
padding: 2px 10px;
border: 1px solid #fff;
border-radius: 5px;
font-size: 13px;
color: #fff;
margin: 0 8.5px;
}
wx-video .wx-video-bar > .wx-video-danmu-btn.active {
border-color: #48c23d;
color: #48c23d;
}
wx-video .wx-video-bar > .wx-video-fullscreen {
width: 17px;
height: 17px;
/*margin: 13.5px 16px 13.5px 17px;*/
margin: 0 8.5px;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAAAXNSR0IArs4c6QAAAQRJREFUWAnt1d0NwiAQB/CmS7hHX5zFxLF0Ah2hE/lg7BT4PyMJUj6Oyt299BIioZT7ARYG59wLpTXmoXOMGO/QecxtwyWW4o42AupGALkFdX1MkHxE3Q7jIbQPqNthQogpJoZkMLRlsn/gFMQEk4OoY0oQVUwNoobhQFQwgMxUKFkt0C8+Zy61d8SeR5iHWCLOwF/MCb8Tp//ex3QFsE1HlCfKFUX2OijNFMnPKD7k76YcBoL402Zh8B77+MjlXrVvwfglXA32b0MrRgxCE2nBiEJaMOIQLkYFwsGoQWoYVUgJow4pYD4Weq4ayBqfwDYQmnUK0301kITujuawu65/l2B5A4z3Qe+Ut7EBAAAAAElFTkSuQmCC');
background-size: cover;
background-position: 50% 50%;
background-repeat: no-repeat;
}
wx-video .wx-video-danmu {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
margin-bottom: 44px;
}
wx-video .wx-video-danmu > .wx-video-danmu-item {
line-height: 1;
position: absolute;
color: #ffffff;
white-space: nowrap;
left: 100%;
transition: 3s linear;
}
wx-video .wx-video-cover {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
background-color: rgba(1, 1, 1, 0.5);
z-index: 1;
}
wx-video .wx-video-cover .wx-video-cover-play-button {
width: 15px;
height: 15px;
}
wx-video .wx-video-cover .wx-video-cover-duration {
color: #fff;
font-size: 16px;
line-height: 1;
margin-top: 10px;
}
wx-view {
display: block;
}
wx-view[hidden] {
display: none;
}
.navigator-hover {
background-color: rgba(0, 0, 0, 0.1);
opacity: 0.7;
}
wx-navigator {
height: auto;
width: auto;
display: block;
}
wx-navigator[hidden] {
display: none;
}
wx-action-sheet-cancel {
background-color: #FFFFFF;
font-size: 18px;
}
wx-action-sheet-cancel .wx-action-sheet-middle {
background-color: #EFEFF4;
height: 6px;
width: 100%;
}
wx-action-sheet-cancel .wx-action-sheet-cancel {
background-color: inherit;
position: relative;
padding: 10px 0;
text-align: center;
font-size: inherit;
display: block;
}
wx-action-sheet-cancel .wx-action-sheet-cancel:before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
wx-action-sheet-cancel .wx-action-sheet-cancel:active {
background-color: #ECECEC;
}
.textarea-placeholder {
color: grey;
}
wx-textarea {
width: 300px;
height: 150px;
display: block;
position: relative;
}
wx-textarea[hidden] {
display: none;
}
wx-textarea textarea {
outline: none;
border: none;
resize: none;
background-color: transparent;
line-height: 1.2;
z-index: 2;
position: absolute;
padding: 0;
font-family: inherit;
background: transparent;
}
wx-textarea .compute {
color: transparent;
top: 0;
z-index: 0;
}
wx-textarea div {
word-break: break-all;
line-height: 1.2;
font-family: inherit;
position: absolute;
}
/*wx-share-button {*/
/*display: inline-block;*/
/*line-height: 0;*/
/*z-index: 9999999999;*/
/*-webkit-tap-highlight-color: transparent;*/
/*>.wx-share-button-wrapper {*/
/*width: 36px;*/
/*height: 36px;*/
/*display: inline-block;*/
/*background-size: 100% 100%;*/
/*background-repeat: no-repeat;*/
/*-webkit-tap-highlight-color: transparent;*/
/*}*/
/*}*/
wx-contact-button {
display: inline-block;
line-height: 0;
z-index: 9999999999;
}
wx-contact-button[hidden] {
display: none;
}
wx-contact-button > .wx-contact-button-wrapper {
width: 18px;
height: 18px;
display: inline-block;
background-size: 100% 100%;
background-repeat: no-repeat;
-webkit-tap-highlight-color: transparent;
}
wx-movable-area {
display: block;
position: relative;
width: 10px;
height: 10px;
}
wx-movable-area[hidden] {
display: none;
}
wx-movable-view {
display: inline-block;
width: 10px;
height: 10px;
top: 0px;
left: 0px;
position: absolute;
}
wx-movable-view[hidden] {
display: none;
}
wx-cover-view {
display: block;
line-height: 1.2;
overflow: hidden;
white-space: nowrap;
pointer-events: auto;
}
wx-cover-view[hidden] {
display: none;
}
wx-cover-view .wx-cover-view {
width: 100%;
height: 100%;
text-overflow: inherit;
overflow: hidden;
white-space: inherit;
-webkit-align-items: inherit;
align-items: inherit;
-webkit-justify-content: inherit;
justify-content: inherit;
-webkit-flex-direction: inherit;
flex-direction: inherit;
}
wx-cover-image {
display: block;
line-height: 1.2;
overflow: hidden;
pointer-events: auto;
height: 100%;
width: 100%;
}
wx-cover-image img {
width: 100%;
height: 100%;
}
wx-cover-image[hidden] {
display: none;
}
wx-cover-image .wx-cover-image {
width: 100%;
height: 100%;
text-overflow: inherit;
overflow: inherit;
white-space: nowrap;
-webkit-align-items: inherit;
align-items: inherit;
-webkit-justify-content: inherit;
justify-content: inherit;
-webkit-flex-direction: inherit;
flex-direction: inherit;
font-size: 0;
}
wx-camera {
position: relative;
width: 100%;
display: block;
overflow: hidden;
}
wx-camera[hidden] {
display: none;
}
wx-camera video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
wx-live-player {
width: 300px;
height: 225px;
display: inline-block;
line-height: 0;
overflow: hidden;
position: relative;
background-color: black;
}
wx-live-player[hidden] {
display: none;
}
wx-live-player video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
wx-live-pusher {
position: relative;
width: 100%;
display: block;
overflow: hidden;
background-color: black;
}
wx-live-pusher[hidden] {
display: none;
}
wx-live-pusher video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
wx-web-view {
width: 100%;
height: 100%;
}
wx-web-view > div {
width: 100%;
height: 100%;
}
wx-ad {
display: block;
width: 100%;
overflow: hidden;
pointer-events: auto;
/*暂无广告*/
}
wx-ad .ad_bg {
width: 100%;
height: 100%;
}
wx-ad .hd_label {
position: absolute;
top: 4px;
left: 4px;
width: 28px;
text-align: center;
height: 14px;
line-height: 14px;
border-radius: 2px;
background-color: rgba(40, 40, 40, 0.6);
color: #fff;
font-size: 11px;
}
wx-ad .ft_label {
font-size: 11px;
background-color: rgba(40, 40, 40, 0.6);
position: absolute;
display: block;
height: 17px;
line-height: 17px;
font-style: normal;
color: #fff;
padding-right: 3.5px;
text-align: right;
right: 0;
bottom: 0;
}
wx-ad .ft_label_before {
content: ' ';
display: block;
width: 14px;
height: 100%;
position: absolute;
top: 0;
right: 100%;
overflow: hidden;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAiCAYAAAE7eonfAAAAAXNSR0IArs4c6QAAAolJREFUSA2tVs1rE0EUT9okNoK20ZtYQQ9tvgsNuARE0kLBgII92JMfPXjtoYVCvcWLtt49+B8mxxByScjG3xt4y5vdmZ396ELyPn/vN2/2TSaFgnjq9fq/IttkkL7BDpYRh4JwOmcp2Wq13gXpq9XqVBlI/UVhjjxVRrfbfalA+AoWwY5Go/FnvV5vq0x2suQA2RoyvCYmLCBww2iWGpKd4L1D+Z1IUJYOyhIKLb9hNEktiC34Yg3KgIZEySfWIEr+tgbDAbJVK3L5MinSpwyybgI7gSYQFdT2hxlYYvv/sh6WViAGaR/vrBQGsG0FLhaLK04ySSMQS7w0JUtfBDgYDEpYYl0mmXRtVzudTm25XN6aEsM+DRgOso1VbI3H4++wO+xzAulI00lmAMtIjxwgSf2aQBTbpC/bU61WrxGrmeKxjNjdVyYQ+azA4XD4wAYiv3WplUrlGxif28BWRt/3PRuI/FZgHMgKxBl8nwkI0IesQBcu2iNG7LUThYTI5mDEPmcCAhT74rmoxkh3EgdcMgA2m82fmBR1kblAFHeexyRFKIfuJezPR6iP4jC5CTFkfRCcx5HIWLA10plUp66Qe540n/IyE3qe9zjpiMkFZSacTqdfUSj1K8lEiHE+BFlwE8gOXHpqwtFoRBjtz5CLRMatv8QySeqTyeQM525P+tLoqTpst9u7IDtOQxDOTUWIqaRByfUkJsSZO0J3L3KxAZyIsNfrPcQl+SkvGeGt/whl8fl8TndI6gGTNVh3doitPEByjwF5ZewvBQ54G+/tIi+JxBu3if5GlcvlHyA7kcn3oasO+/1+dTabPQOBh9F/i8KxnYeJi8WiD58PvA99JXRlY+BIqs9/1uymFKVUkXgAAAAASUVORK5CYII=) no-repeat 0 0;
background-size: auto 100%;
}
wx-ad .ft_label_cover_wrap {
right: 0;
bottom: 0;
height: 17px;
position: absolute;
}
wx-ad .ft_label_cover_before {
display: block;
width: 14px;
height: 100%;
position: absolute;
top: 0;
right: 100%;
}
wx-ad .ft_label_cover {
font-size: 11px;
background-color: rgba(40, 40, 40, 0.6);
display: block;
height: 17px;
font-style: normal;
color: #fff;
padding-right: 3px;
text-align: right;
}
wx-ad .ft_label_cover .text {
line-height: 17px;
}
wx-ad .btn_miniapp {
display: inline-block;
vertical-align: middle;
padding: 0 10.5px;
height: 22.5px;
line-height: 22.5px;
font-size: 13px;
border-radius: 5px;
text-decoration: none;
}
wx-ad .btn_miniapp.skin1 {
color: #1AAD19;
border: 1px solid #1AAD19;
}
wx-ad .btn_miniapp.skin2 {
color: rgba(255, 255, 255, 0.8);
border: 1px solid rgba(255, 255, 255, 0.8);
}
wx-ad .ic_miniapp {
display: inline-block;
width: 14px;
height: 14px;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAgZJREFUSA3tlr0vBFEUxWfQ+YjSR6XQIkgoFBpRij+BiMQfIJKlIxKtTvwNJEIhyi1UiASNSMRXUAliFbLW77Ivzr7dGWaz5d7k7Jz73rnnzr7Z2feCoBrVFfhjBXK5XAOYAWlwD97BBVgDHX+UlzeN8SC4BlGRYWIO1JTXoUQVZt3gDfwnUiUskg/RKQRnXscN8gkwDhbBE3DxARlI3smrwGTEOeavU54kYLwV3Ihuw9ckzjFbEMODKAM006J7VF25D71dTI6F+/RcBhqFB+U21rqsGnp8VPJL4UGdJpXiLG8tXvNgVjy3hMc3xqAX8RA4CMNwXwujODU9zK2DftHcw1clL00p7gLbwEUW0uLUcPtXcrEm4/UM3rqJ/PWZq91MQRQtNaJuFGnQJEq74xfJo2gzE20yuQNPsVonMvZNCxrT1L7VLtCmR+STFGe+K2I+0NzhMYykD6TJD2Pkv1MULQMXtrz2voa/ih/GWMml9nVxecE3Rjgm4hXueEnyilJ9H81Yt7G9mE72urj4dCTJ1W/8KsWdwn2qv9I7fzJxzrPbBC7sD77VN2Fsygny1xFfkzjHaADYFubCtjbb4myrsy3Ptj6NU5KiH1/ixlaAUUqdY7gdAuydr0xgVgPsuGLHlqi4YmKwMh09F4w7gL2vdnCzA9wDsAOdHewaPHk1ra5A0Qp8AStESai4b58oAAAAAElFTkSuQmCC) no-repeat center;
background-size: contain;
vertical-align: middle;
position: relative;
bottom: 1px;
right: 3px;
}
wx-ad .ic_miniapp_cover {
display: inline-block;
width: 14px;
height: 14px;
position: absolute;
top: 50%;
margin-top: -7px;
left: 0;
margin-left: -2px;
}
wx-ad .da_container {
height: 100%;
position: relative;
background-color: white;
}
wx-ad .da_container .da_content {
height: 100%;
}
wx-ad .da_container .brand_info {
height: 100%;
padding-left: 8px;
}
wx-ad .da_container .btn_miniapp {
position: absolute;
top: 50%;
margin-top: -11.2px;
right: 6px;
}
wx-ad .brand_info {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
wx-ad .brand_info .avatar {
margin-right: 8.5px;
}
wx-ad .brand_info .brand_info_title {
text-align: left;
font-size: 13px;
margin: 0;
margin-bottom: 3.5px;
}
wx-ad .brand_info .brand_info_desc {
font-size: 10px;
color: #888;
margin: 0;
text-align: left;
}
wx-ad .avatar {
display: block;
width: 33px;
height: 33px;
}
wx-ad .avatar_img {
display: block;
width: 100%;
height: 100%;
}
wx-ad .avatar.radius .avatar_img {
border-radius: 50%;
}
wx-ad .info_ele {
display: inline-block;
}
wx-ad .info_ele.separate {
position: relative;
padding-right: 6px;
margin-right: 6px;
color: #888;
}
wx-ad .info_ele_separate {
display: inline-block;
width: 1px;
height: 9px;
position: absolute;
top: 50%;
margin-top: -4.5px;
right: 0;
background-color: #888;
}
wx-ad .brand_info_msg.cover .brand_info_desc {
height: 16px;
line-height: 16px;
}
wx-ad .brand_info_msg.cover .separate {
margin-right: 0;
}
wx-ad .brand_info_msg.cover .info_ele_separate {
position: static;
margin-bottom: 2px;
margin-right: 6px;
}
wx-ad .banner_full {
position: relative;
}
wx-ad .banner_full .da_banner_img {
display: block;
position: absolute;
top: 0;
height: 100%;
left: 0;
right: 0;
width: 100%;
}
wx-ad .empty_ad_container {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100%;
background-color: #DCDCDC;
color: #888888;
text-align: center;
}
wx-ad .empty_ad_container p {
margin: 0;
}
wx-ad .empty_ad_desc {
line-height: 50px;
font-size: 12px;
}
支付宝小程序
.a-page { min-height: 100vh; }
.a-page-result { display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; width: 100%; height: 100vh; background: rgb(255, 255, 255); text-align: center; }
.a-page-result-pic-error { width: 50px; height: 50px; margin: 200px auto 0px; background-size: 50px 50px; background-image: url("https://gw.alipayobjects.com/mdn/miniapp_de/afts/img/A*2kqdQo8Mia0AAAAAAAAAAABkARQnAQ"); background-repeat: no-repeat; }
.a-page-result-pic-error-dd { width: 267px; height: 138px; margin: 0px auto; background: url("https://img.alicdn.com/tfs/TB1SOiNTgTqK1RjSZPhXXXfOFXa-543-276.png") 0% 0% / 267px 138px; }
.a-page-result-title { margin-top: 20px; font-size: 20px; color: rgb(51, 51, 51); }
.a-page-result-brief { margin: 12px auto; font-size: 14px; line-height: 19px; color: rgb(153, 153, 153); max-width: 266px; text-align: center; }
.a-page-result-button-group { display: block; margin: 0px; padding: 0px 0px 50px; }
.a-page-result-button { display: block; margin-top: 26px; font-size: 20px; color: rgb(16, 142, 233); }
.a-component-permission { background-color: rgb(245, 245, 245) !important; display: flex !important; -webkit-box-pack: center !important; justify-content: center !important; -webkit-box-align: center !important; align-items: center !important; }
.a-component-permission div { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACUAAAAlCAMAAADyQNAxAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAeUExURZmZmUdwTJmZmZmZmZycnJycnJqampubm5qampqamq7t2fMAAAAKdFJOU/4A644QKa1vSszQfyflAAABFUlEQVQ4y42UW6LDIAhEkZe6/w3f0SaRpPEWfmrICRQZoBKtiXcm7i6m0U/raMIEY/78iL1QKnjldcZQq44n0SfVkKjGLFrhaXeqxi9D9BopX5/dimHyRVViK29m/Ik2qLaDJtY+lBK1sjNE0EkJSdnbfEvFJr01ZTJQcpa7sYpgVPi6fnGX76MSF2rHlcDQv34cOxp5uh1MSLihkJKc7AdlYDqtCrXo2xEMc/llQ3ApKhcr/q/N7YMJNe50AebRIMMUudijRWTr7sGMoRjmgUO20UcNCsbFeh+D1krsY9CEndM1p85umlj6Ur4iNF7Oqa+cVged0H1uhv6bx77mcdSUmO3knkjunOT+Su7CSxHHXr35/wD5yQjIzCfxhgAAAABJRU5ErkJggg=="); font-size: 16px; height: 20px; line-height: 20px; background-repeat: no-repeat; padding-left: 30px; background-size: 19px; color: rgb(216, 216, 216); overflow: hidden; }
.a-ad { width: 100%; }
.a-ai-camera, .a-ar { position: relative; width: 100%; height: 300px; display: block; overflow: hidden; }
.a-audio { min-height: 50px; }
.a-audio-container, .a-audio-poster { display: flex; }
.a-audio-container { width: 100%; border: 1px solid rgb(223, 223, 223); border-radius: 4px; min-height: 50px; overflow: hidden; }
.a-audio-poster { -webkit-box-flex: 1; flex: 1 1 0%; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; margin-right: 8px; }
.a-audio-info { -webkit-box-flex: 4; flex: 4 1 0%; }
.a-audio-info-name { font-size: 14px; margin: 0px; padding: 6px 0px 8px; }
.a-audio-info-author { font-size: 12px; color: rgb(136, 136, 136); margin: 0px; }
.a-audio-timer { -webkit-box-flex: 1; flex: 1 1 0%; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; font-size: 12px; color: rgb(136, 136, 136); }
.a-audio-tag { display: none; }
.a-button { display: block; outline: 0px; appearance: none; box-sizing: border-box; padding: 0px; text-align: center; font-size: 18px; height: 47px; line-height: 47px; border-radius: 2px; overflow: hidden; text-overflow: ellipsis; word-break: break-word; white-space: nowrap; color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); border: 1px solid rgb(238, 238, 238); }
.a-button.a-button-active { background-color: rgb(221, 221, 221); color: rgba(0, 0, 0, 0.3); }
.a-button.a-button-disabled { color: rgba(0, 0, 0, 0.6); background-color: rgba(255, 255, 255, 0.6); }
.a-button-primary { color: rgb(255, 255, 255); background-color: rgb(16, 142, 233); border-color: rgb(16, 142, 233); }
.a-button-primary.a-button-active { background-color: rgb(11, 113, 186); color: rgba(255, 255, 255, 0.3); }
.a-button-primary.a-button-disabled { color: rgba(255, 255, 255, 0.6); background-color: rgb(159, 210, 246); border: 0px; }
.a-button-warn { color: rgb(255, 255, 255); background-color: rgb(233, 79, 79); border-color: rgb(233, 79, 79); }
.a-button-warn.a-button-active { background-color: rgb(234, 60, 60); color: rgba(255, 255, 255, 0.3); border-color: rgb(233, 79, 79); }
.a-button-warn.a-button-disabled { color: rgba(255, 255, 255, 0.6); background-color: rgba(233, 79, 79, 0.4); border-width: 0px; }
.a-button-ghost { color: rgb(16, 142, 233); background-color: transparent; border-color: rgb(16, 142, 233); }
.a-button-ghost.a-button-active { color: rgb(255, 255, 255); background-color: rgb(11, 113, 186); }
.a-button-ghost.a-button-disabled { color: rgb(204, 204, 204); background-color: rgb(221, 221, 221); border: 0px; }
.a-button .a-loading-indicator { margin-right: 10px; }
.a-button-small { display: inline-block; font-size: 14px; min-width: 48px; height: 26px; line-height: 24px; padding: 0px 4px; }
.a-button-small .a-loading-indicator { margin-right: 4px; }
.a-button-small .a-loading-indicator .a-loading-item { height: 6px; width: 6px; }
.a-button-small .a-loading-indicator .a-loading-item::before { width: 8px; height: 10px; margin-left: -3.38px; margin-top: -5.56px; }
.a-camera { position: relative; width: 100%; height: 300px; display: block; overflow: hidden; }
.a-camera[hidden] { display: none; }
.a-canvas { width: 300px; height: 225px; }
.a-contact-button, .a-loading-indicator, .a-loading-item { display: inline-block; }
.a-loading-indicator.white .a-loading-item::before { background-color: rgb(255, 255, 255); }
.a-loading-item { width: 10px; height: 10px; position: relative; transform: scale(0); opacity: 0; animation: 0.766s cubic-bezier(0.42, 0, 0.58, 1) 0s infinite alternate none running AULoadingScaleColorBoth; }
.a-loading-item::before { content: " "; position: absolute; top: 50%; left: 50%; margin-left: -6.38px; margin-top: -9.56px; width: 12.75px; height: 19.13px; transform: skew(-0.46rad) scale(0.5); transform-origin: center center; border-radius: 1px 2px 2px 3px; background-color: rgb(16, 142, 233); }
.a-loading-item:nth-child(1) { animation-delay: -2.2s; }
.a-loading-item:nth-child(2) { animation-delay: -1.966s; }
.a-loading-item:nth-child(3) { animation-delay: -1.666s; }
.a-icon { display: inline-block; font-size: 0px; }
.a-icon-svg { background-size: cover; }
.a-icon-download, .a-icon-info, .a-icon-success, .a-icon-success_no_circle { fill: rgb(16, 142, 233); }
.a-icon-warn { fill: rgb(232, 160, 16); }
.a-icon-cancel { fill: rgb(244, 51, 60); }
.a-icon-waiting { fill: rgb(11, 161, 148); }
.a-icon-clear { fill: rgb(204, 204, 204); }
.a-icon-search { fill: rgb(171, 171, 171); }
.a-icon-success_dd { fill: rgb(50, 150, 250); }
.a-icon-warn_dd { fill: rgb(254, 225, 81); }
.a-icon-cancel_dd { fill: rgb(242, 86, 67); }
.a-icon-waiting_dd { fill: rgb(21, 188, 131); }
.a-icon-clear_dd { fill: rgb(191, 192, 193); }
.a-icon-info_dd, .a-icon-success_no_circle_dd { fill: rgb(50, 150, 250); }
.a-icon-search_dd { fill: rgb(191, 192, 193); }
.a-icon-download_dd { fill: rgb(50, 150, 250); }
.a-shared-checkbox { position: relative; display: inline-block; vertical-align: text-bottom; border: 1px solid rgb(201, 201, 201); border-radius: 2px; width: 22px; height: 22px; margin-right: 4px; box-sizing: border-box; }
.a-shared-checkbox-disabled { background: rgb(216, 216, 216); }
.a-shared-checkbox input { opacity: 0; width: 100%; height: 100%; z-index: 2; border: 0px; }
.a-shared-checkbox .a-icon-svg, .a-shared-checkbox input { position: absolute; top: 0px; left: 0px; }
.a-checkbox .a-icon-success_no_circle { position: absolute; top: 2px; left: 2px; }
.a-cover-image, .a-cover-view { overflow: hidden; pointer-events: auto; }
.a-cover-image { width: 300px; height: 225px; display: inline-block; }
.a-cover-image[hidden] { display: none; }
.a-cover-view { display: block; line-height: 1.2; white-space: nowrap; background-color: rgb(255, 255, 255); }
.a-image { background-repeat: no-repeat; display: inline-block; overflow: hidden; font-size: 0px; width: 300px; height: 225px; }
.a-image-lazy-load { background-color: rgba(255, 255, 255, 0.01); }
.a-input { display: inline-block; background-color: rgb(255, 255, 255); padding: 2px 5px; color: rgb(0, 0, 0); font-size: 17px; height: 25px; box-sizing: content-box; }
.a-input input:disabled { opacity: 0.4; }
.a-input-wrap { position: relative; text-overflow: inherit; border: 0px; height: 100%; width: auto; font-size: inherit; font-weight: inherit; font-family: inherit; color: inherit; background: inherit; padding: 0px; margin: 0px; outline: 0px; text-align: inherit; -webkit-tap-highlight-color: transparent; overflow: hidden; }
.a-input-wrap form { height: inherit; }
.a-input-content, .a-input-placeholder { left: 0px; top: 0px; width: 100%; height: inherit; text-align: inherit; font-family: inherit; }
.a-input-content { border: 0px; font-size: inherit; font-weight: inherit; background: 0px 0px; display: inherit; padding: 0px; margin: 0px; outline: 0px; vertical-align: middle; text-overflow: inherit; -webkit-tap-highlight-color: transparent; position: relative; color: inherit; overflow: inherit; white-space: inherit; }
.a-input-placeholder { position: absolute; white-space: nowrap; overflow: hidden; color: rgb(204, 204, 204); display: flex; -webkit-box-align: center; place-items: center flex-start; user-select: none; }
.a-input-placeholder span { -webkit-box-flex: 1; flex: 1 1 0%; padding-left: 3px; }
.a-label { display: inline-block; line-height: 1.8; }
.a-lifestyle { display: flex; height: 56px; font-size: 16px; -webkit-box-align: center; align-items: center; background-color: rgb(255, 255, 255); }
.a-lifestyle-error.a-lifestyle { background-color: transparent; }
.a-lifestyle-loading { -webkit-box-pack: center; justify-content: center; }
.a-lifestyle-name-wrap { -webkit-box-flex: 1; flex: 1 1 0%; padding-left: 15px; display: flex; overflow: hidden; }
.a-lifestyle-btn.a-button { font-size: 12px; width: 39px; height: 24px; margin-top: 0px; margin-bottom: 0px; line-height: 24px; }
.a-lifestyle-name { line-height: 34px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 20px; }
.a-lifestyle-icon { width: 34px; height: 34px; margin-right: 12px; }
.a-lifestyle-btn-wrap { padding-right: 15px; }
.a-lifestyle-btn.a-button-loading { width: 44px; }
.a-lifestyle-high { height: 71px; }
.a-lifestyle-high .a-lifestyle-icon { width: 41px; height: 41px; }
.a-lifestyle-high .a-lifestyle-name-wrap { -webkit-box-align: center; align-items: center; }
.a-lifestyle-high .a-lifestyle-memo { overflow: hidden; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; height: 48px; justify-content: space-around; }
.a-lifestyle-high .a-lifestyle-name { line-height: 24px; color: rgb(0, 0, 0); font-size: 17px; font-weight: 700; }
.a-lifestyle-high .a-lifestyle-desc { font-size: 13px; line-height: 18px; color: rgb(153, 153, 153); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.a-lottie { width: 100px; height: 100px; overflow: hidden; }
.a-live-player[hidden], .a-live-pusher[hidden], .a-lottie[hidden], .a-movable-area[hidden], .a-movable-view[hidden], .a-switch.a-switch-android .checkbox::before { display: none; }
.a-live-player, .a-live-pusher { width: 300px; height: 225px; display: inline-block; line-height: 0; overflow: hidden; position: relative; background-color: rgb(0, 0, 0); }
.a-map { width: 100vw; height: 100vh; }
.a-movable-area, .a-movable-view { position: relative; width: 10px; height: 10px; }
.a-movable-view { display: inline-block; position: absolute; top: 0px; left: 0px; transform-origin: center center; }
.a-picker-view { display: flex; height: 238px; -webkit-box-align: center; align-items: center; }
.a-picker-view-picker { position: relative; height: 100%; overflow: hidden; width: 100%; -webkit-box-flex: 1; flex: 1 1 0%; text-align: center; }
.a-picker-view-picker-mask { position: absolute; left: 0px; top: 0px; height: 100%; margin: 0px auto; width: 100%; z-index: 3; background-image: linear-gradient(rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6)), linear-gradient(to top, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6)); background-position: center top, center bottom; background-size: 100% 102px; background-repeat: no-repeat; }
.a-picker-view-picker-content { position: absolute; left: 0px; top: 0px; width: 100%; z-index: 1; }
.a-picker-view-picker-item { touch-action: manipulation; text-align: center; font-size: 16px; height: 34px; line-height: 34px; color: rgb(0, 0, 0); white-space: nowrap; text-overflow: ellipsis; }
.a-picker-view-picker-indicator { box-sizing: border-box; width: 100%; height: 34px; position: absolute; left: 0px; top: 102px; z-index: 3; }
.a-picker-view-picker-indicator::after, .a-picker-view-picker-indicator::before { content: " "; position: absolute; left: 0px; right: 0px; height: 0px; transform: scaleY(0.5); }
.a-picker-view-picker-indicator::before { top: 0px; border-top: 1px solid rgb(229, 229, 229); transform-origin: 0px 0px; }
.a-picker-view-picker-indicator::after { bottom: 0px; border-bottom: 1px solid rgb(229, 229, 229); transform-origin: 0px 100%; }
.a-progress { display: flex; -webkit-box-align: center; align-items: center; }
.a-progress-container { -webkit-box-flex: 1; flex: 1 1 0%; }
.a-progress-outer { display: block; background-color: rgb(238, 238, 238); }
.a-progress-bar { height: 0px; border-bottom: 4px solid rgb(16, 142, 233); transition: all 0.3s linear 0s; }
.a-progress-info { margin-left: 10px; }
.a-radio { border-radius: 100vh; }
.a-radio-checked { border-width: 0px; }
.a-slider { display: flex; -webkit-box-align: center; align-items: center; }
.a-slider-wrapper { -webkit-box-flex: 1; flex: 1 1 0%; padding: 0px; }
.a-slider-content { position: relative; margin: 0px; padding: 10px 0px; }
.a-slider-rail { position: absolute; width: 100%; height: 2px; background-color: rgb(221, 221, 221); box-sizing: border-box; }
.a-slider-track { position: absolute; visibility: visible; left: 0px; height: 2px; border-radius: 2px; background-color: rgb(16, 142, 233); }
.a-slider-handle { position: absolute; margin-left: -12px; margin-top: -12px; width: 22px; height: 22px; cursor: pointer; border-radius: 100vh; border: 2px solid rgb(16, 142, 233); background-color: rgb(255, 255, 255); box-sizing: border-box; }
.a-slider-handle:active { background-color: rgb(64, 165, 237); box-shadow: rgb(64, 165, 237) 0px 0px 2px; }
.a-slider-disabled { opacity: 0.3; }
.a-slider-disabled .a-slider-track { height: 2px; }
.a-slider-disabled .a-slider-handle { cursor: not-allowed; box-shadow: none; }
.a-slider-presentation { min-width: 5px; font-size: 14px; color: rgb(153, 153, 153); margin-left: 8px; }
.a-slider-a11y-wrapper { position: relative; width: 100%; z-index: 1; opacity: 0.01; }
.a-slider-a11y-input, .a-switch input[type="checkbox"] { position: absolute; top: 0px; left: 0px; width: 100%; }
.a-swiper { position: relative; display: block; visibility: visible; overflow: hidden; width: 100%; height: 150px; box-sizing: border-box; }
.a-swiper-container { position: absolute; inset: 0px; }
.a-swiper-item, .a-swiper-slides { position: absolute; width: 100%; height: 100%; }
.a-swiper-slides { display: block; top: 0px; left: 0px; transition-timing-function: ease-out; }
.a-swiper-item { will-change: auto; box-sizing: border-box; overflow: hidden; }
.a-swiper-vertical .a-swiper-slides { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }
.a-swiper-indicator { position: absolute; bottom: 0px; height: 14px; width: 100%; text-align: center; -webkit-box-pack: center; justify-content: center; display: flex; transform: translate3d(0px, 0px, 0px); }
.a-swiper-dot { display: inline-block; zoom: 1; width: 4px; height: 3px; margin: 0px 2px; background: rgb(232, 232, 232); }
.a-swiper-dot-active { width: 11px; background: rgb(16, 142, 233); }
.a-switch, .a-switch .checkbox { box-sizing: border-box; z-index: 0; cursor: pointer; position: relative; }
.a-switch { display: inline-block; vertical-align: middle; align-self: center; }
.a-switch .checkbox { width: 51px; height: 31px; border-radius: 100vh; background: rgb(229, 229, 229); margin: 0px; padding: 0px; border: 0px; transition: all 300ms ease 0s; }
.a-switch .checkbox::after, .a-switch .checkbox::before { content: " "; height: 28px; border-radius: 100vh; background: rgb(255, 255, 255); position: absolute; left: 1px; top: 1px; transition: all 200ms ease 0s; }
.a-switch .checkbox::before { box-sizing: border-box; transform: scale(1); width: 48px; z-index: 1; }
.a-switch .checkbox::after { width: 28px; z-index: 2; transform: translateX(0px); box-shadow: rgba(0, 0, 0, 0.21) 2px 2px 4px; }
.a-switch .checkbox.checkbox-disabled { z-index: 3; }
.a-switch input[type="checkbox"] { opacity: 0; height: 100%; z-index: 2; border: 0px; }
.a-switch input[type="checkbox"]:checked + .checkbox, .a-switch.a-switch-android input[type="checkbox"]:checked + .checkbox { background: rgb(16, 142, 233); }
.a-switch input[type="checkbox"]:checked + .checkbox::before, .a-switch.a-switch-android input[type="checkbox"]:checked + .checkbox::before { transform: scale(0); }
.a-switch input[type="checkbox"]:checked + .checkbox::after { transform: translateX(20px); }
.a-switch input[type="checkbox"]:disabled + .checkbox { opacity: 0.3; }
.a-switch.a-switch-android .checkbox { width: 72px; height: 23px; border-radius: 3px; background: rgb(167, 170, 166); }
.a-switch.a-switch-android .checkbox::after { width: 35px; height: 21px; border-radius: 2px; box-shadow: none; left: 1px; top: 1px; }
.a-switch.a-switch-android input[type="checkbox"]:checked + .checkbox::after { transform: translateX(35px); }
.a-text-space { white-space: pre-wrap; }
.a-text-no-space { white-space: pre-line; }
.a-textarea { position: relative; background-color: rgb(255, 255, 255); padding: 2px 5px; color: rgb(0, 0, 0); font-size: 17px; height: 42px; line-height: 1.4; }
.a-textarea-wrap { position: relative; height: 100%; width: inherit; line-height: inherit; font-family: inherit; min-height: inherit; }
.a-textarea-content, .a-textarea-placeholder { height: inherit; vertical-align: middle; text-align: inherit; }
.a-textarea-placeholder { inset: 0px 0px 0px 3px; word-break: break-all; overflow-wrap: break-word; position: absolute; overflow: hidden; color: rgb(204, 204, 204); }
.a-textarea-content { position: relative; line-height: inherit; min-height: inherit; width: 100%; font-size: inherit; font-weight: inherit; color: inherit; background: 0px 0px; display: inherit; border: 0px; padding: 0px; margin: 0px; outline: 0px; overflow: inherit; text-overflow: inherit; -webkit-tap-highlight-color: transparent; resize: none; z-index: 2; }
.a-textarea-show-count { padding-bottom: 16px; }
.a-textarea-count-wrap { position: absolute; bottom: 0px; right: 5px; color: rgb(178, 178, 178); font-size: 14px; margin: 0px; }
.a-video { width: 300px; height: 225px; position: relative; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; overflow: hidden; }
.a-video-poster { position: absolute; inset: 0px; width: 100%; height: 100%; background-image: url("https://gw.alipayobjects.com/zos/rmsportal/yFeFExbGpDxvDYnKHcrs.png"); background-size: contain; background-repeat: no-repeat; background-position: center center; }
.a-video-play { z-index: 1; width: 50px; height: 50px; background-image: url("https://gw.alipayobjects.com/mdn/miniapp_de/afts/img/A*DBiWS4fIefQAAAAAAAAAAABkARQnAQ"); background-size: 50px 50px; }
.a-video-con, .a-video-wrap { position: absolute; inset: 0px; width: 100%; height: 100%; border-radius: inherit; }
.a-web-view-mini { width: 100%; height: 200px; }
.a-rtc-room { width: 100vw; height: 100vh; }
