Skip to content

Commit

Permalink
create the login page
Browse files Browse the repository at this point in the history
design the Ui style
  • Loading branch information
Cha0s0000 committed Apr 16, 2018
1 parent 92111f3 commit 9bd4943
Show file tree
Hide file tree
Showing 2 changed files with 113 additions and 0 deletions.
29 changes: 29 additions & 0 deletions pages/login/login.wxml
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
<!--pages/login/login.wxml-->
<view class="container">
<view class="login-icon">
<image class="login-img" src="../../images/icon/logo.png"></image>
</view>
<view class="login-from">

<!--name-->
<view class="inputView">
<image class="nameImage" src="../../images/icon/name.png"></image>
<label class="loginLab">Name</label>
<input class="inputText" placeholder="Steemit account" bindinput="nameInput" />
</view>
<view class="line"></view>

<!--password-->
<!-- <view class="inputView">
<image class="keyImage" src="../../images/icon/key.png"></image>
<label class="loginLab">密码</label>
<input class="inputText" password="true" placeholder="请输入密码" bindinput="passwordInput" />
</view> -->

<!--button-->
<view class="BtnView">
<button class="loginBtn" type="primary" disabled="{{disabled}}" bindtap="login">Login</button>
<button class="backBtn" type="primary" bindtap="back">Back</button>
</view>
</view>
</view>
84 changes: 84 additions & 0 deletions pages/login/login.wxss
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
/* pages/login/login.wxss */
page{
height: 100%;
}

.container {
height: 100%;
display: flex;
flex-direction: column;
padding: 0;
box-sizing: border-box;
background-color: #f2f2f2
}

/*login-icon*/
.login-icon{
flex: none;
margin-top:200rpx;
}
.login-img{
width: 400rpx;
height: 150rpx;
}

/*content*/
.login-from {
margin-top: 20px;
flex: auto;
height:100%;
}

.inputView {
background-color: #fff;
line-height: 44px;
}
/*input box */
.nameImage, .keyImage {
margin-left: 22px;
width: 14px;
height: 14px
}

.loginLab {
margin: 15px 15px 15px 10px;
color: #545454;
font-size: 14px
}
.inputText {
flex: block;
float: right;
text-align: right;
margin-right: 22px;
margin-top: 11px;
color: #cccccc;
font-size: 14px
}

.line {
width: 100%;
height: 1px;
background-color: #cccccc;
margin-top: 1px;
}
/*button*/
.BtnView {
display: flex;
flex-direction: row;
width: 100%;
height: auto;
background-color: #f2f2f2;
margin-top: 0px;
margin-bottom: 0px;
padding-bottom: 0px;
}

.loginBtn {
width: 40%;
margin-top: 35px;
}

.backBtn {
width: 40%;
margin-top: 35px;
}

0 comments on commit 9bd4943

Please sign in to comment.