Commit ffe01157 by 朱建香

绑定页面样式优化

parent 4b067e59
...@@ -166,7 +166,7 @@ function connectButtonTap(self){ ...@@ -166,7 +166,7 @@ function connectButtonTap(self){
} }
},1000); },1000);
uComponents.showProcess(self, 0, Vue.t('wifiAdd.wifiBinding'), [{ uComponents.showProcess(self, 0, Vue.t('wifiAdd.wifiBinding'), [{
"class": 'custom-process-button custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => { "class": 'custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => {
// uComponents.hideProcess(self); // uComponents.hideProcess(self);
window.clearInterval(self.timeout); window.clearInterval(self.timeout);
//停止配网 //停止配网
...@@ -201,7 +201,7 @@ function connectButtonTap(self){ ...@@ -201,7 +201,7 @@ function connectButtonTap(self){
iotDebug.upload(iot,'配网中'); iotDebug.upload(iot,'配网中');
} }
uComponents.showProcess(self, 0, Vue.t('wifiAdd.wifiBinding'), [{ uComponents.showProcess(self, 0, Vue.t('wifiAdd.wifiBinding'), [{
"class": 'custom-process-button custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => { "class": 'custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => {
uComponents.hideProcess(self); uComponents.hideProcess(self);
window.clearInterval(self.timeout); window.clearInterval(self.timeout);
//停止配网 //停止配网
...@@ -455,7 +455,7 @@ function addSuccess(self){ ...@@ -455,7 +455,7 @@ function addSuccess(self){
} }
} }
},{ },{
"class": 'custom-process-button custom-process-cancelButton', 'text': Vue.t('btn.ignore'), 'callback': () => { "class": 'custom-process-cancelButton', 'text': Vue.t('btn.ignore'), 'callback': () => {
//暂不开启 //暂不开启
// uComponents.hideProcess(self); // uComponents.hideProcess(self);
// iot.navigator.fire(plus.webview.getWebviewById('device'),'returnPage',{ // iot.navigator.fire(plus.webview.getWebviewById('device'),'returnPage',{
......
...@@ -223,9 +223,9 @@ ...@@ -223,9 +223,9 @@
line-height: 1.5; line-height: 1.5;
text-align: center; text-align: center;
width: 100%; width: 100%;
display: inline-block;
position: absolute; position: absolute;
bottom: -200px; bottom: 0;
left: 0;
font-size: 12px ; font-size: 12px ;
span{ span{
&:first-child{ &:first-child{
...@@ -236,35 +236,29 @@ ...@@ -236,35 +236,29 @@
} }
} }
.custom-process .u-process-button{
text-align: center;
bottom: 65px;
}
.custom-process-button{ .custom-process-button{
position: absolute; .button();
bottom: inherit;
left: 0;
right: 0;
width: 7.333rem;
border-radius: 0.133rem;
background-color: transparent;
border: 1px solid;
color: #00ffff;
font-size: 0.427rem;
text-align: center; text-align: center;
line-height: 1; line-height: 1;
margin: 0 auto; margin: 0 auto;
padding: 0.267rem 0; padding: 10px 0;
-webkit-transition: background-color 0.2s linear; .transition(background-color 0.2s linear);
transition: background-color 0.2s linear;
background-clip: padding-box; background-clip: padding-box;
.tap_row(@CUSTOM-BUTTON-COMPONENT-ACTIVE-BG);
} }
.custom-process-cancelButton{ .custom-process-cancelButton{
bottom: 0; position: relative;
width: 100px; color: @LINKTEXT-TEXT-COLOR;
color: #00ffff; font-size: @LINKTEXT-TEXT-FONTSIZE;
font-size: 12px; display: inline-block;
background-color: transparent; min-width: 100px;
padding: 18px 0 5px; padding: 16px 26px 2px;
border: none; margin-top: 10px;
&:after{ &:after{
content: ''; content: '';
position: absolute; position: absolute;
...@@ -274,7 +268,6 @@ ...@@ -274,7 +268,6 @@
height: 1px;/*no*/ height: 1px;/*no*/
.blue_gradient_border(); .blue_gradient_border();
} }
.tap_row(transparent);
&.disabled{ &.disabled{
background-color: transparent; background-color: transparent;
} }
...@@ -290,6 +283,14 @@ ...@@ -290,6 +283,14 @@
} }
} }
.custom-process{
.u-process-content{
top: 180px;
bottom: 175px;
.transform(none);
}
}
.u-process.u-process-status-0{ .u-process.u-process-status-0{
.u-process-content{ .u-process-content{
.loading{ .loading{
...@@ -307,20 +308,8 @@ ...@@ -307,20 +308,8 @@
} }
} }
.u-process.u-process-status-1{ .u-process.u-process-status-1,.u-process.u-process-status-2{
.u-process-content{
top: 200px;
.loading{
.loading-text{
display: none;
}
}
}
}
.u-process.u-process-status-2{
.u-process-content{ .u-process-content{
top: 200px;
.loading{ .loading{
.loading-text{ .loading-text{
display: none; display: none;
......
...@@ -934,10 +934,6 @@ ...@@ -934,10 +934,6 @@
bottom: 65px; bottom: 65px;
left: 0; left: 0;
width: 100%; width: 100%;
display: table;
table-layout: fixed;
border-collapse: separate;
border-spacing: 25px 0;
li{ li{
// display: table-cell; // display: table-cell;
// color: @BUTTON-COMPONENT-COLOR; // color: @BUTTON-COMPONENT-COLOR;
......
...@@ -1008,10 +1008,6 @@ p { ...@@ -1008,10 +1008,6 @@ p {
bottom: 1.733rem; bottom: 1.733rem;
left: 0; left: 0;
width: 100%; width: 100%;
display: table;
table-layout: fixed;
border-collapse: separate;
border-spacing: 0.667rem 0;
} }
.u-process.u-process-status-0 .u-process-content { .u-process.u-process-status-0 .u-process-content {
...@@ -1166,9 +1162,9 @@ p { ...@@ -1166,9 +1162,9 @@ p {
line-height: 1.5; line-height: 1.5;
text-align: center; text-align: center;
width: 100%; width: 100%;
display: inline-block;
position: absolute; position: absolute;
bottom: -5.333rem; bottom: 0;
left: 0;
font-size: 0.32rem; font-size: 0.32rem;
} }
...@@ -1181,15 +1177,16 @@ p { ...@@ -1181,15 +1177,16 @@ p {
top: 3px; top: 3px;
} }
.custom-process .u-process-button {
text-align: center;
bottom: 1.733rem;
}
.custom-process-button { .custom-process-button {
position: absolute;
bottom: inherit;
left: 0;
right: 0;
width: 7.333rem; width: 7.333rem;
border-radius: 0.133rem; border-radius: 0.133rem;
background-color: transparent; background-color: transparent;
border: 0.027rem solid; border: 1px solid;
color: #00ffff; color: #00ffff;
font-size: 0.427rem; font-size: 0.427rem;
text-align: center; text-align: center;
...@@ -1205,14 +1202,19 @@ p { ...@@ -1205,14 +1202,19 @@ p {
background-color: #153D4C; background-color: #153D4C;
} }
.custom-process-button.disabled {
background-color: transparent;
color: #575a6d;
}
.custom-process-cancelButton { .custom-process-cancelButton {
bottom: 0; position: relative;
width: 2.667rem;
color: #00ffff; color: #00ffff;
font-size: 0.32rem; font-size: 0.32rem;
background-color: transparent; display: inline-block;
padding: 0.48rem 0 0.133rem; min-width: 2.667rem;
border: none; padding: 0.427rem 0.693rem 0.053rem;
margin-top: 0.267rem;
} }
.custom-process-cancelButton:after { .custom-process-cancelButton:after {
...@@ -1226,10 +1228,6 @@ p { ...@@ -1226,10 +1228,6 @@ p {
background: linear-gradient(to right, #242635, #00ffff, #242635); background: linear-gradient(to right, #242635, #00ffff, #242635);
} }
.custom-process-cancelButton:active {
background-color: transparent;
}
.custom-process-cancelButton.disabled { .custom-process-cancelButton.disabled {
background-color: transparent; background-color: transparent;
} }
...@@ -1239,6 +1237,13 @@ p { ...@@ -1239,6 +1237,13 @@ p {
transform: translateZ(0) scale(0.7); transform: translateZ(0) scale(0.7);
} }
.custom-process .u-process-content {
top: 4.8rem;
bottom: 4.667rem;
-webkit-transform: none;
transform: none;
}
.u-process.u-process-status-0 .u-process-content .loading { .u-process.u-process-status-0 .u-process-content .loading {
position: relative; position: relative;
} }
...@@ -1253,18 +1258,7 @@ p { ...@@ -1253,18 +1258,7 @@ p {
text-align: center; text-align: center;
} }
.u-process.u-process-status-1 .u-process-content { .u-process.u-process-status-1 .u-process-content .loading .loading-text,
top: 5.333rem;
}
.u-process.u-process-status-1 .u-process-content .loading .loading-text {
display: none;
}
.u-process.u-process-status-2 .u-process-content {
top: 5.333rem;
}
.u-process.u-process-status-2 .u-process-content .loading .loading-text { .u-process.u-process-status-2 .u-process-content .loading .loading-text {
display: none; display: none;
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment