YanaDH 8 years ago
parent
commit
46e965d796

+ 33 - 1
miaomiao/www/css/style.css

xqd xqd
@@ -1,4 +1,36 @@
 /*login*/
+.login{
+    margin-bottom: 60px
+}
+.login .box{
+    border-bottom: 1px solid #F4F4F4;
+    height: 48px;
+    padding: 10px 0;
+    font-size: 15px
+}
+.login span:nth-child(1){
+    color: #949494;
+    margin-top: 7px;
+    width: 33%;
+    float:left;
+}
+.login .clear{
+    float: right;
+    margin-top: 7px;
+    color: #E1E1E1;
+}
+.login .verifyCode{
+    float: right;
+    margin-top: 9px;
+    font-size: 14px;
+    color: #00C3DA
+}
+.login input{
+    color: #949494;
+}
+.login input::-webkit-input-placeholder{
+    color: #E1E1E1;
+}
 .lgsocial{
     text-align:center;
     padding:1rem;
@@ -14,7 +46,7 @@
 }
     
 .lglogin {
-    margin-top:2rem;
+    margin-top:3rem;
 }
 .lglogin span {
     text-align: center;

+ 3 - 0
miaomiao/www/js/controllers/account.js

xqd
@@ -51,6 +51,9 @@
                     wait(seconds - 1);
             }, 1000);
         };
+            $scope.clear = function(){
+                document.getElementById("tel").value = "";
+            }
     }]);
   
 })(angular.module('app.controllers'));

+ 24 - 14
miaomiao/www/templates/account/login.html

xqd
@@ -1,24 +1,34 @@
 <ion-view view-title="瞄瞄">
-    <ion-content>
-        <div  style="padding:30px">
+    <ion-content style="padding: 10%">
+        <div  style="padding:0 0 30px 0">
             <img ng-src="img/icon_login.svg"  style="margin:0 auto;display:block;width:100px;border-radius:50px"/>
         </div>
-        <div class="list">
-            <div class="item item-input">
-                <input type="tel" ng-model="vm.mobile" placeholder="手机号码">
+        <div class="login">
+            <div class="box">
+                <span>手机号码</span>
+                <span class="fl">
+                    <input id="tel" type="tel" ng-model="vm.mobile" placeholder="请输入手机号码">
+                </span>
+                <span class="clear" ng-click="clear()">
+                    <i class="icon ion-android-close" style="font-size: 1.5rem"></i>
+                </span>
             </div>
-            <div class="item item-input">
-                <input class="code" type="text" ng-model="vm.verify_code" placeholder="短信验证码">
-                <button ng-click="getVerifyCode()" class="button button-calm" style="margin-right:5px">{{vm.waitSeconds}}</button>
+            <div style="clear:both; margin-bottom: 30px;"></div>
+            <div class="box">
+                <span>短信验证码</span>
+                <span style="float:left; width: 38%">
+                    <input ng-model="vm.verify_code" type="text" placeholder="请输入验证码">
+                </span>
+                <span ng-click="getVerifyCode()" class="verifyCode">
+                    {{vm.waitSeconds}}
+                </span>
             </div>
         </div>
-        <div class="padding">
-            <button type="submit" ng-click="login()" class="button button-block button-calm">
-                登录
-            </button>
-        </div>
+        <button type="submit" ng-click="login()" class="button button-block button-calm" style="border-radius: 50px;">
+                登 录
+        </button>
         <div  class="lglogin">
-            <span>社交媒体登录</span>
+            <span style="font-size: 15px; color: #E1E1E1">- 社交媒体登录 -</span>
             <div class="lgsocial">
                 <img ng-src="img/icon_weibo.svg"/>
                 <img ng-src="img/icon_wechat.svg"/>