Improve login box

Author: SamyPesse

client/core/app.js

@@ -93,7 +93,7 @@ box, session, addons, box, files, commands, menu, tabs, panels, operations, loca
             var password = hr.Cookies.get("token");
 
             if (!box.isAuth() && ((email && password) || (email && box.get("public"))) && this._autologin) {
-                this.doLogin(email, password, true);
+                this.doLogin(email, password);
                 return;
             }
             return Application.__super__.render.apply(this, arguments);
@@ -168,13 +168,12 @@ box, session, addons, box, files, commands, menu, tabs, panels, operations, loca
 
             var email = this.$(".login-box #login-email").val();
             var password = this.$(".login-box #login-token").val();
-            var tosave = this.$(".login-box #login-save").is(":checked");
 
-            this.doLogin(email, password, tosave);
+            this.doLogin(email, password);
         },
 
         // Do login
-        doLogin: function(email, password, tosave) {
+        doLogin: function(email, password) {
             var that = this;
 
             // If public: generate a random password
@@ -198,13 +197,9 @@ box, session, addons, box, files, commands, menu, tabs, panels, operations, loca
             }
 
             return session.start(email, password).then(function() {
-                if (tosave) {
-                    hr.Cookies.set("email", email);
-                    hr.Cookies.set("token", password);
-                } else {
-                    hr.Cookies.set("email", "");
-                    hr.Cookies.set("token", "");
-                }
+                hr.Cookies.set("email", email);
+                hr.Cookies.set("token", password);
+
                 that.render();
             }).fail(function(err) {
                 that._autologin = false;

client/resources/stylesheets/ui/login.less

@@ -7,7 +7,7 @@
     left: 0px;
     right: 0px;
     bottom: 0px;
-    background: #fff;
+    background: #f7f7f7;
 
     .login-box {
         position: absolute;
@@ -18,8 +18,8 @@
         margin-top: -(@boxHeight/2);
         padding: 20px 20px 20px;
         border-radius: 2px;
-        background-color: #f7f7f7;
-        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
+        background-color: #fff;
+        border: 1px solid #ddd;
 
 
         .form-group {
@@ -30,13 +30,12 @@
         }
 
         .header {
-            font-size: 50px;
-            line-height: 150px;
-            opacity: 0.15;
+            line-height: 100px;
             text-align: center;
+            margin-bottom: 20px;
 
-            .fa-stack {
-                width: 2.8em;
+            img {
+                width: 92px;
             }
         }
 

client/resources/templates/main.html

@@ -25,30 +25,22 @@
 	<div class="cb-login">
 		<div class="login-box">
 			<div class="header">
-				<span class="fa-stack">
-				  <i class="fa fa-cloud fa-stack-2x"></i>
-				  <i class="fa fa-code fa-stack-1x fa-inverse"></i>
-				</span>
+  				<img src="http://localhost:8000/static/images/icons/128.png" />
 			</div>
 			<div class="inner">
 				<% if (hr.offline.isConnected()) { %>
 					<div class="form-group">
-						<input type="email" class="form-control input-lg" name="login-email" id="login-email" placeholder="Enter email" value="<%- email %>" autocomplete="off">
+						<input type="email" class="form-control input-lg" name="login-email" id="login-email" placeholder="Email" value="<%- email %>" autocomplete="off">
 						<% if (session.box.get("public")) { %>
-						<p class="help-block">This box is public, please enter an email to log in.</p>
+						<p class="help-block">This workspace is public, enter an email to identify yourself (GIT and collaborators).</p>
 						<% } %>
 					</div>
 					<% if (!session.box.get("public")) { %>
 					<div class="form-group">
-						<input type="password" class="form-control input-lg" name="login-token" id="login-token" placeholder="Enter token" value="<%- token %>" autocomplete="off">
+						<input type="password" class="form-control input-lg" name="login-token" id="login-token" placeholder="Password" value="<%- token %>" autocomplete="off">
 					</div>
 					<% } %>
-					<div class="checkbox">
-						<label>
-							<input type="checkbox" id="login-save" checked> Remember me
-						</label>
-					</div>
-					<button id="login-submit" class="btn btn-lg btn-block btn-primary">Login</button>
+					<button id="login-submit" class="btn btn-lg btn-block btn-default">Enter</button>
 				<% } else { %>
 					<div class="form-group">
 						<p class="help-block">Sorry, You can't use this workspace in offline mode.</p>