Skip to content

D
DoorLock
Commit 4fe9c697 by wangying
Options

1.1.4 / 2017-11-07 

==================
 * 1.上传css样式
parent c0436304
Showing with 582 additions and 28 deletions
History.md
1.1.3 / 2017-11-06 1.1.4 / 2017-11-07
==================
* 1.上传css样式
1.1.3 / 2017-11-06
================== ==================
* 1.上传css样式 * 1.上传css样式
......
dev/src/lang/zh.json
...@@ -216,11 +216,6 @@ ...@@ -216,11 +216,6 @@
} }
}, },
"userList":{
"name": "姓名：{0}",
"id": "指纹ID:<span>{0}</span>密码ID:<span>{1}</span>IC卡ID:<span>{2}</span>",
"noUserTip": "暂无用户"
},
"commstatusLoading":{ "commstatusLoading":{
"connectSuccess": "Wi-Fi连接成功，正在绑定...", "connectSuccess": "Wi-Fi连接成功，正在绑定...",
"bindSuccess": "绑定成功", "bindSuccess": "绑定成功",
...@@ -319,6 +314,7 @@ ...@@ -319,6 +314,7 @@
"error": "请求发送失败" "error": "请求发送失败"
}, },
"deviceList":{ "deviceList":{
"model": "型号：" "model": "型号：",
"noDeviceTip": "暂无产品型号"
} }
} }
\ No newline at end of file
web/lib/less/addDevice/addDevice.less
...@@ -57,6 +57,9 @@ ...@@ -57,6 +57,9 @@
.u-list-load{ .u-list-load{
.listLoad(); .listLoad();
} }
.u-list-tip{
.listNoCont("noDevice.png");
}
} }
//配置Wi-Fi //配置Wi-Fi
...@@ -178,6 +181,8 @@ ...@@ -178,6 +181,8 @@
.buttonPosition(); .buttonPosition();
} }
.mediaPosition();
.u-comm-loading(); .u-comm-loading();
.custom-comm-loading(); .custom-comm-loading();
\ No newline at end of file
web/lib/less/bindUser/bindUser.less
...@@ -81,6 +81,8 @@ ...@@ -81,6 +81,8 @@
.buttonPosition(); .buttonPosition();
} }
.mediaPosition();
//用户列表 //用户列表
.u-swipe-list(); .u-swipe-list();
......
web/lib/less/doorlockManage/doorlockManage.less
...@@ -36,6 +36,8 @@ ...@@ -36,6 +36,8 @@
.buttonPosition(); .buttonPosition();
} }
.mediaPosition();
//门锁管理 //门锁管理
.grid-list{ .grid-list{
position: absolute; position: absolute;
...@@ -188,7 +190,8 @@ ...@@ -188,7 +190,8 @@
.custom-switch{ .custom-switch{
position: absolute; position: absolute;
top: 0; top: 0;
right: 13px; right: 0;
width: 126px;
height: 100%; height: 100%;
.u-switch-handle{ .u-switch-handle{
width: 40px; width: 40px;
......
web/lib/less/doorlockUsers/doorlockUser.less
...@@ -187,7 +187,7 @@ ...@@ -187,7 +187,7 @@
.mask(1051,@CUSTOM-BACKDROP-BG); .mask(1051,@CUSTOM-BACKDROP-BG);
.guideStep1{ .guideStep1{
position: absolute; position: absolute;
top: 65px; top: 44px;
left: 0; left: 0;
width: 100%; width: 100%;
.guideStep1Cont{ .guideStep1Cont{
...@@ -275,7 +275,7 @@ ...@@ -275,7 +275,7 @@
.guideStep2, .guideStep2,
.guideStep4{ .guideStep4{
position: absolute; position: absolute;
bottom: 150px; bottom: 65px;
left: 0; left: 0;
width: 100%; width: 100%;
} }
...@@ -284,7 +284,7 @@ ...@@ -284,7 +284,7 @@
} }
.guideStep3{ .guideStep3{
position: absolute; position: absolute;
top: 139px; top: 120px;
left: 0; left: 0;
width: 100%; width: 100%;
.guideStep3Cont{ .guideStep3Cont{
...@@ -326,4 +326,6 @@ ...@@ -326,4 +326,6 @@
margin-top: -2px; margin-top: -2px;
} }
} }
} }
\ No newline at end of file
.mediaPosition(true);
\ No newline at end of file
web/lib/less/doorlockUsers/unlockInfo.less
...@@ -109,6 +109,7 @@ ...@@ -109,6 +109,7 @@
padding: 10px 42px; padding: 10px 42px;
font-size: 0; font-size: 0;
margin: 0 -12px; margin: 0 -12px;
position: relative;
li{ li{
color: #00ffff; color: #00ffff;
font-size: 14px; font-size: 14px;
...@@ -175,7 +176,7 @@ ...@@ -175,7 +176,7 @@
.u-select-tip{ .u-select-tip{
top: 80px; top: 80px;
.transform(none); .transform(none);
.listNoCont(inherit,45px 45px,58px); .listNoCont("noCont.png",45px 45px,inherit,57px);
} }
} }
...@@ -192,7 +193,8 @@ ...@@ -192,7 +193,8 @@
height: auto; height: auto;
text-align: center; text-align: center;
color: #00ffff; color: #00ffff;
margin: 37px auto 0; margin: 27px auto 0;
padding: 10px 0;
.u-switch-handle{ .u-switch-handle{
position: relative; position: relative;
top: auto; top: auto;
...@@ -244,4 +246,172 @@ ...@@ -244,4 +246,172 @@
.guide-dialog{ .guide-dialog{
.mask(1051,@CUSTOM-BACKDROP-BG); .mask(1051,@CUSTOM-BACKDROP-BG);
} .guideStep1{
\ No newline at end of file position: absolute;
top: 44px;
left: 0;
width: 100%;
.modeSelect:after{
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
width: 360px;
height: 100%;
margin: 0 auto;
border: 2px dashed;/*no*/
border-radius: 5px;
}
.guideStep1Tip{
.bgImg("guideArrow1.png");
background-position: 190px top;
background-repeat: no-repeat;
.background-size(24px 57px);
padding-top: 64px;
margin-top: -2px;
font-size: 19px;
font-family: tipFont;
text-align: center;
}
}
.guideStep3{
position: absolute;
top: 147px;
left: 0;
width: 100%;
.guideStep3Tip{
.bgImg("guideArrow3.png");
background-position: 184px bottom;
background-repeat: no-repeat;
.background-size(16px 65px);
padding-bottom: 77px;
margin-bottom: -2px;
font-size: 19px;
font-family: tipFont;
text-align: center;
line-height: 23px;
span{
color: #00ffff;
}
}
.guideStep3Cont{
position: relative;
padding-bottom: 7px;
ul{
li{
font-size: 16px;
padding: 22px 80px 11px 42px;
position: relative;
p{
&:nth-child(1){
float: left;
margin-right: 36px;
.text_oneRow_ellipsis();
}
&:nth-child(2){
overflow: hidden;
.text_oneRow_ellipsis();
}
}
&:before{
content: '\e6a9';
position: absolute;
bottom: 9px;
right: 42px;
.iconfont(25px);
color: #00ffff;
}
&:after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 1px;/*no*/
.white_gradient_border();
}
&.active:before{
content: '\e6aa';
}
}
}
//虚线框
&:after{
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
width: 360px;
height: 100%;
margin: 0 auto;
border: 2px dashed;/*no*/
border-radius: 5px;
}
}
}
.guideStep5{
position: absolute;
top: 248px;
left: 0;
width: 100%;
.guideStep5Tip{
.bgImg("guideArrow4.png");
background-position: 164px bottom;
background-repeat: no-repeat;
.background-size(39px 179px);
padding-bottom: 188px;
margin-bottom: -3px;
font-size: 19px;
font-family: tipFont;
text-align: center;
line-height: 23px;
}
.guideStep5Cont{
position: relative;
p{
text-align: center;
position: relative;
color: #00ffff;
padding: 17px 0;
&:before{
content: '\e6a9';
.iconfont(17px);
display: inline-block;
vertical-align: middle;
margin-right: 9px;
}
&.active:before{
content: '\e6aa';
}
}
//虚线框
&:after{
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
width: 360px;
height: 100%;
margin: 0 auto;
border: 2px dashed;/*no*/
border-radius: 5px;
}
}
}
.guideStep2,
.guideStep4,
.guideStep6{
position: absolute;
bottom: 65px;
left: 0;
width: 100%;
}
.custom-dialog-button{
.button(200px);
}
}
.mediaPosition(true,true,true);
\ No newline at end of file
web/lib/less/doorlockUsers/userList.less
...@@ -103,6 +103,13 @@ ...@@ -103,6 +103,13 @@
.listLoad(); .listLoad();
} }
.user-list-tip{
.transformV_center(left,0);
width: 100%;
text-align: center;
.listNoCont("noUser.png");
}
//添加用户 //添加用户
.inputBox(200px,40px,auto,"gray_addUser_icon.png",90px,65px 65px); .inputBox(200px,40px,auto,"gray_addUser_icon.png",90px,65px 65px);
...@@ -124,4 +131,6 @@ ...@@ -124,4 +131,6 @@
.custom-button{ .custom-button{
.button(); .button();
.buttonPosition(); .buttonPosition();
} }
\ No newline at end of file
.mediaPosition();
\ No newline at end of file
web/lib/less/login/login.less
...@@ -86,6 +86,8 @@ ...@@ -86,6 +86,8 @@
.button(); .button();
} }
.mediaPosition(false,fasle,false,true);
.link{ .link{
width: 275px; width: 275px;
margin: 5px auto; margin: 5px auto;
......
web/lib/less/public/core.less
...@@ -177,7 +177,50 @@ p{ ...@@ -177,7 +177,50 @@ p{
position: absolute; position: absolute;
bottom: 65px; bottom: 65px;
left: 0; left: 0;
right: 0; right: 0;
}
.mediaPosition(@guideBtnBool: false,@guideStepBool:false,@switchBool:false,@loginBtnBool:false){
@media (min-width: 360px/*no*/) and(max-height: 570px/*no*/){
.custom-button{
bottom: 45px;
}
//指引蒙层
&when(@guideBtnBool){
.guide-dialog{
& .guideStep2,
& .guideStep4,
& .guideStep6{
bottom: 45px;
}
}
}
&when(@guideStepBool){
.guide-dialog{
.guideStep5{
top: 228px;
.guideStep5Cont p{
padding: 12px 0;
}
}
}
}
&when(@switchBool){
.custom-setHijack-switch{
margin-top: 0;
}
}
&when(@loginBtnBool){
.custom-guide-button{
bottom: 45px;
}
}
}
} }
//自定义输入框组件 //自定义输入框组件
......
web/view/addDevice/addDevice.css
...@@ -601,6 +601,17 @@ p { ...@@ -601,6 +601,17 @@ p {
line-height: 0.933rem; line-height: 0.933rem;
} }
.custom-device-list .u-list-tip {
background-image: url("../../resources/image/noDevice.png");
background-position: top center;
background-repeat: no-repeat;
-webkit-background-size: 1.627rem 1.627rem;
background-size: 1.627rem 1.627rem;
color: #91929a;
font-size: 0.427rem;
padding-top: 2.347rem;
}
.wifiAddHelp { .wifiAddHelp {
margin: 0.8rem 1.013rem 1.547rem; margin: 0.8rem 1.013rem 1.547rem;
} }
...@@ -894,6 +905,12 @@ p { ...@@ -894,6 +905,12 @@ p {
right: 0; right: 0;
} }
@media (min-width: 360px /*no*/) and (max-height: 570px /*no*/) {
.custom-button {
bottom: 1.2rem;
}
}
.u-comm-loading { .u-comm-loading {
position: fixed; position: fixed;
top: 0; top: 0;
......
web/view/bindUser/bindUser.css
...@@ -706,6 +706,12 @@ p { ...@@ -706,6 +706,12 @@ p {
right: 0; right: 0;
} }
@media (min-width: 360px /*no*/) and (max-height: 570px /*no*/) {
.custom-button {
bottom: 1.2rem;
}
}
.u-swipe-list { .u-swipe-list {
width: 100%; width: 100%;
height: 100%; height: 100%;
......
web/view/doorlockManage/doorlockManage.css
...@@ -522,6 +522,12 @@ p { ...@@ -522,6 +522,12 @@ p {
color: #999; color: #999;
} }
@media (min-width: 360px /*no*/) and (max-height: 570px /*no*/) {
.custom-button {
bottom: 1.2rem;
}
}
.grid-list { .grid-list {
position: absolute; position: absolute;
top: 1.173rem; top: 1.173rem;
...@@ -914,7 +920,8 @@ p { ...@@ -914,7 +920,8 @@ p {
.custom-switch { .custom-switch {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0.347rem; right: 0;
width: 3.36rem;
height: 100%; height: 100%;
} }
......
web/view/doorlockUsers/doorlockUser.css
...@@ -900,7 +900,7 @@ p { ...@@ -900,7 +900,7 @@ p {
.guide-dialog .guideStep1 { .guide-dialog .guideStep1 {
position: absolute; position: absolute;
top: 1.733rem; top: 1.173rem;
left: 0; left: 0;
width: 100%; width: 100%;
} }
...@@ -1006,7 +1006,7 @@ p { ...@@ -1006,7 +1006,7 @@ p {
.guide-dialog .guideStep2, .guide-dialog .guideStep2,
.guide-dialog .guideStep4 { .guide-dialog .guideStep4 {
position: absolute; position: absolute;
bottom: 4rem; bottom: 1.733rem;
left: 0; left: 0;
width: 100%; width: 100%;
} }
...@@ -1031,7 +1031,7 @@ p { ...@@ -1031,7 +1031,7 @@ p {
.guide-dialog .guideStep3 { .guide-dialog .guideStep3 {
position: absolute; position: absolute;
top: 3.707rem; top: 3.2rem;
left: 0; left: 0;
width: 100%; width: 100%;
} }
...@@ -1082,4 +1082,16 @@ p { ...@@ -1082,4 +1082,16 @@ p {
text-align: center; text-align: center;
line-height: 0.64rem; line-height: 0.64rem;
margin-top: -0.053rem; margin-top: -0.053rem;
}
@media (min-width: 360px /*no*/) and (max-height: 570px /*no*/) {
.custom-button {
bottom: 1.2rem;
}
.guide-dialog .guideStep2,
.guide-dialog .guideStep4,
.guide-dialog .guideStep6 {
bottom: 1.2rem;
}
} }
\ No newline at end of file
web/view/doorlockUsers/unlockInfo.css
...@@ -692,6 +692,7 @@ p { ...@@ -692,6 +692,7 @@ p {
padding: 0.267rem 1.12rem; padding: 0.267rem 1.12rem;
font-size: 0; font-size: 0;
margin: 0 -0.32rem; margin: 0 -0.32rem;
position: relative;
} }
.modeSelect li { .modeSelect li {
...@@ -871,14 +872,14 @@ p { ...@@ -871,14 +872,14 @@ p {
top: 2.133rem; top: 2.133rem;
-webkit-transform: none; -webkit-transform: none;
transform: none; transform: none;
background-image: url("../../resources/image/inherit"); background-image: url("../../resources/image/noCont.png");
background-position: top center; background-position: top center;
background-repeat: no-repeat; background-repeat: no-repeat;
-webkit-background-size: 1.2rem 1.2rem; -webkit-background-size: 1.2rem 1.2rem;
background-size: 1.2rem 1.2rem; background-size: 1.2rem 1.2rem;
color: #91929a; color: #91929a;
font-size: 1.547rem; font-size: inherit;
padding-top: 2.347rem; padding-top: 1.52rem;
} }
.tip { .tip {
...@@ -949,7 +950,8 @@ p { ...@@ -949,7 +950,8 @@ p {
height: auto; height: auto;
text-align: center; text-align: center;
color: #00ffff; color: #00ffff;
margin: 0.987rem auto 0; margin: 0.72rem auto 0;
padding: 0.267rem 0;
} }
.custom-setHijack-switch .u-switch-handle { .custom-setHijack-switch .u-switch-handle {
...@@ -1057,4 +1059,238 @@ p { ...@@ -1057,4 +1059,238 @@ p {
height: 100%; height: 100%;
z-index: 1051; z-index: 1051;
background-color: rgba(36, 38, 53, 0.9); background-color: rgba(36, 38, 53, 0.9);
}
.guide-dialog .guideStep1 {
position: absolute;
top: 1.173rem;
left: 0;
width: 100%;
}
.guide-dialog .guideStep1 .modeSelect:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
width: 9.6rem;
height: 100%;
margin: 0 auto;
border: 2px dashed;
border-radius: 0.133rem;
}
.guide-dialog .guideStep1 .guideStep1Tip {
background-image: url("../../resources/image/guideArrow1.png");
background-position: 5.067rem top;
background-repeat: no-repeat;
-webkit-background-size: 0.64rem 1.52rem;
background-size: 0.64rem 1.52rem;
padding-top: 1.707rem;
margin-top: -0.053rem;
font-size: 0.507rem;
font-family: tipFont;
text-align: center;
}
.guide-dialog .guideStep3 {
position: absolute;
top: 3.92rem;
left: 0;
width: 100%;
}
.guide-dialog .guideStep3 .guideStep3Tip {
background-image: url("../../resources/image/guideArrow3.png");
background-position: 4.907rem bottom;
background-repeat: no-repeat;
-webkit-background-size: 0.427rem 1.733rem;
background-size: 0.427rem 1.733rem;
padding-bottom: 2.053rem;
margin-bottom: -0.053rem;
font-size: 0.507rem;
font-family: tipFont;
text-align: center;
line-height: 0.613rem;
}
.guide-dialog .guideStep3 .guideStep3Tip span {
color: #00ffff;
}
.guide-dialog .guideStep3 .guideStep3Cont {
position: relative;
padding-bottom: 0.187rem;
}
.guide-dialog .guideStep3 .guideStep3Cont ul li {
font-size: 0.427rem;
padding: 0.587rem 2.133rem 0.293rem 1.12rem;
position: relative;
}
.guide-dialog .guideStep3 .guideStep3Cont ul li p:nth-child(1) {
float: left;
margin-right: 0.96rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.guide-dialog .guideStep3 .guideStep3Cont ul li p:nth-child(2) {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.guide-dialog .guideStep3 .guideStep3Cont ul li:before {
content: '\e6a9';
position: absolute;
bottom: 0.24rem;
right: 1.12rem;
font-family: iconfont;
font-size: 0.667rem;
-webkit-font-smoothing: antialiased;
line-height: 1;
color: #00ffff;
}
.guide-dialog .guideStep3 .guideStep3Cont ul li:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 1px;
background: -webkit-linear-gradient(left, #242635, #fff, #242635);
background: linear-gradient(to right, #242635, #fff, #242635);
}
.guide-dialog .guideStep3 .guideStep3Cont ul li.active:before {
content: '\e6aa';
}
.guide-dialog .guideStep3 .guideStep3Cont:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
width: 9.6rem;
height: 100%;
margin: 0 auto;
border: 2px dashed;
border-radius: 0.133rem;
}
.guide-dialog .guideStep5 {
position: absolute;
top: 6.613rem;
left: 0;
width: 100%;
}
.guide-dialog .guideStep5 .guideStep5Tip {
background-image: url("../../resources/image/guideArrow4.png");
background-position: 4.373rem bottom;
background-repeat: no-repeat;
-webkit-background-size: 1.04rem 4.773rem;
background-size: 1.04rem 4.773rem;
padding-bottom: 5.013rem;
margin-bottom: -0.08rem;
font-size: 0.507rem;
font-family: tipFont;
text-align: center;
line-height: 0.613rem;
}
.guide-dialog .guideStep5 .guideStep5Cont {
position: relative;
}
.guide-dialog .guideStep5 .guideStep5Cont p {
text-align: center;
position: relative;
color: #00ffff;
padding: 0.453rem 0;
}
.guide-dialog .guideStep5 .guideStep5Cont p:before {
content: '\e6a9';
font-family: iconfont;
font-size: 0.453rem;
-webkit-font-smoothing: antialiased;
line-height: 1;
display: inline-block;
vertical-align: middle;
margin-right: 0.24rem;
}
.guide-dialog .guideStep5 .guideStep5Cont p.active:before {
content: '\e6aa';
}
.guide-dialog .guideStep5 .guideStep5Cont:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
width: 9.6rem;
height: 100%;
margin: 0 auto;
border: 2px dashed;
border-radius: 0.133rem;
}
.guide-dialog .guideStep2,
.guide-dialog .guideStep4,
.guide-dialog .guideStep6 {
position: absolute;
bottom: 1.733rem;
left: 0;
width: 100%;
}
.guide-dialog .custom-dialog-button {
width: 5.333rem;
border-radius: 0.133rem;
background-color: transparent;
border: 1px solid;
color: #00ffff;
font-size: 0.427rem;
}
.guide-dialog .custom-dialog-button:active {
background-color: #153D4C;
}
.guide-dialog .custom-dialog-button.disabled {
background-color: transparent;
color: #999;
}
@media (min-width: 360px /*no*/) and (max-height: 570px /*no*/) {
.custom-button {
bottom: 1.2rem;
}
.guide-dialog .guideStep2,
.guide-dialog .guideStep4,
.guide-dialog .guideStep6 {
bottom: 1.2rem;
}
.guide-dialog .guideStep5 {
top: 6.08rem;
}
.guide-dialog .guideStep5 .guideStep5Cont p {
padding: 0.32rem 0;
}
.custom-setHijack-switch {
margin-top: 0;
}
} }
\ No newline at end of file
web/view/doorlockUsers/userList.css
...@@ -581,6 +581,24 @@ p { ...@@ -581,6 +581,24 @@ p {
line-height: 0.933rem; line-height: 0.933rem;
} }
.user-list-tip {
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 100%;
text-align: center;
background-image: url("../../resources/image/noUser.png");
background-position: top center;
background-repeat: no-repeat;
-webkit-background-size: 1.627rem 1.627rem;
background-size: 1.627rem 1.627rem;
color: #91929a;
font-size: 0.427rem;
padding-top: 2.347rem;
}
.inputBox { .inputBox {
position: relative; position: relative;
margin: 0 1.12rem; margin: 0 1.12rem;
...@@ -782,4 +800,10 @@ p { ...@@ -782,4 +800,10 @@ p {
.custom-button.disabled { .custom-button.disabled {
background-color: transparent; background-color: transparent;
color: #999; color: #999;
}
@media (min-width: 360px /*no*/) and (max-height: 570px /*no*/) {
.custom-button {
bottom: 1.2rem;
}
} }
\ No newline at end of file
web/view/login/login.css
...@@ -776,6 +776,16 @@ p { ...@@ -776,6 +776,16 @@ p {
color: #999; color: #999;
} }
@media (min-width: 360px /*no*/) and (max-height: 570px /*no*/) {
.custom-button {
bottom: 1.2rem;
}
.custom-guide-button {
bottom: 1.2rem;
}
}
.link { .link {
width: 7.333rem; width: 7.333rem;
margin: 0.133rem auto; margin: 0.133rem auto;
......
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