ui design for sign-in and sign-up page
add /login and /sign-up link for user signing fix typo error
This commit is contained in:
		
							parent
							
								
									9c3a8ff299
								
							
						
					
					
						commit
						ffcfd428b8
					
				
					 8 changed files with 176 additions and 40 deletions
				
			
		|  | @ -5,31 +5,109 @@ | |||
|  */ | ||||
| 
 | ||||
| body { | ||||
| 	padding-top: 70px; | ||||
|     background: #F6F6F6; | ||||
| } | ||||
| .navbar { | ||||
| 	min-height: 45px; | ||||
| 
 | ||||
| /* gogits nav header */ | ||||
| .gogs-masthead { | ||||
|     background-color: #428bca; | ||||
|     box-shadow: inset 0 -2px 5px rgba(0, 0, 0, .1); | ||||
|     min-height: 45px; | ||||
|     padding: 2px 16px; | ||||
| } | ||||
| .navbar-brand { | ||||
| 	height: 45px; | ||||
| 	padding: 5px 10px 0px 10px; | ||||
| 	border-left: 1px solid #e5e5e5; | ||||
| 	border-right: 1px solid #e5e5e5; | ||||
| 
 | ||||
| /* gogits nav item link */ | ||||
| .gogs-nav-item { | ||||
|     position: relative; | ||||
|     display: inline-block; | ||||
|     padding: 10px; | ||||
|     font-weight: bold; | ||||
|     color: #EEE; | ||||
|     font-size: 100%; | ||||
| } | ||||
| .navbar-inverse .navbar-brand:focus, .navbar-inverse .navbar-brand:hover { | ||||
| 	background-color: #f0f0f0; | ||||
| 
 | ||||
| .gogs-nav-item:hover, | ||||
| .gogs-nav-item:focus { | ||||
|     color: #fff; | ||||
|     text-decoration: none; | ||||
| } | ||||
| .navbar-brand img { | ||||
| 	width: 32px; | ||||
| 
 | ||||
| .gogs-nav-item.navbar-btn { | ||||
|     cursor: pointer; | ||||
|     margin-top: 8px; | ||||
|     padding: 5px 15px; | ||||
| } | ||||
| .navbar-nav > li > a { | ||||
| 	font-size: 16px; | ||||
| 	padding-top: 13px; | ||||
| 
 | ||||
| /* gogits nav item active status */ | ||||
| .gogs-nav .active { | ||||
|     color: #fff; | ||||
| } | ||||
| .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus { | ||||
| 	color: rgb(153, 153, 153); | ||||
| 
 | ||||
| .gogs-nav .active:after { | ||||
|     position: absolute; | ||||
|     bottom: -2px; | ||||
|     left: 50%; | ||||
|     width: 0; | ||||
|     height: 0; | ||||
|     margin-left: -5px; | ||||
|     vertical-align: middle; | ||||
|     content: " "; | ||||
|     border-right: 5px solid transparent; | ||||
|     border-bottom: 5px solid; | ||||
|     border-left: 5px solid transparent; | ||||
| } | ||||
| .navbar-btn, .navbar .btn { | ||||
| 	padding: 5px 15px; | ||||
| 	margin-top: 7px; | ||||
| 
 | ||||
| /* gogits logo */ | ||||
| #gogs-logo { | ||||
|     width: 28px; | ||||
| } | ||||
| 
 | ||||
| /* gogits body */ | ||||
| #gogs-body { | ||||
|     padding-top: 30px; | ||||
|     padding-bottom: 60px; | ||||
| } | ||||
| 
 | ||||
| /* gogits login card */ | ||||
| #gogs-login-card { | ||||
|     width: 600px; | ||||
|     margin: auto; | ||||
|     padding: 30px; | ||||
|     background: #fff; | ||||
|     border: 1px solid #ccc; | ||||
|     border-radius: 5px; | ||||
|     box-sizing: border-box; | ||||
| } | ||||
| 
 | ||||
| #gogs-login-card h3 { | ||||
|     margin-top: 0; | ||||
|     margin-bottom: 30px; | ||||
|     padding-bottom: 20px; | ||||
|     border-bottom: 1px solid #ccc; | ||||
| } | ||||
| 
 | ||||
| #gogs-login-card .form-control { | ||||
|     padding: 6px 12px; | ||||
|     box-sizing: content-box; | ||||
| } | ||||
| 
 | ||||
| #gogs-login-card .control-label { | ||||
|     height: 44px; | ||||
|     line-height: 30px; | ||||
| } | ||||
| 
 | ||||
| #gogs-login-card .btn{ | ||||
|     cursor: pointer; | ||||
|     margin-right: 1.2em; | ||||
| } | ||||
| 
 | ||||
| #gogs-social-login{ | ||||
|     margin-top: 30px; | ||||
|     padding-top: 20px; | ||||
|     border-top: 1px solid #ccc; | ||||
| } | ||||
| 
 | ||||
| #gogs-social-login .btn{ | ||||
|     float: none; | ||||
|     margin: auto; | ||||
| } | ||||
|  | @ -13,7 +13,7 @@ import ( | |||
| 	"github.com/gogits/gogs/models" | ||||
| ) | ||||
| 
 | ||||
| func AddPublickKey(req *http.Request, r render.Render) { | ||||
| func AddPublicKey(req *http.Request, r render.Render) { | ||||
| 	if req.Method == "GET" { | ||||
| 		r.HTML(200, "user/publickey_add", map[string]interface{}{ | ||||
| 			"Title": "Add Public Key", | ||||
|  |  | |||
|  | @ -16,8 +16,15 @@ import ( | |||
| 	"github.com/gogits/gogs/utils/log" | ||||
| ) | ||||
| 
 | ||||
| func SignIn(r render.Render) { | ||||
| 	r.Redirect("/user/signup", 302) | ||||
| func SignIn(req *http.Request, r render.Render) { | ||||
| 	if req.Method == "GET" { | ||||
| 		r.HTML(200, "user/signin", map[string]interface{}{ | ||||
| 			"Title": "Log In", | ||||
| 		}) | ||||
| 		return | ||||
| 	} | ||||
| 
 | ||||
| 	// todo sign in
 | ||||
| } | ||||
| 
 | ||||
| func SignUp(req *http.Request, r render.Render) { | ||||
|  |  | |||
|  | @ -1,4 +1,16 @@ | |||
| <nav class="navbar navbar-inverse navbar-fixed-top"> | ||||
| <div class="gogs-masthead" id="masthead"> | ||||
|     <div class="container"> | ||||
|         <nav class="gogs-nav"> | ||||
|             <a class="gogs-nav-item active" href="/"><img src="/img/favicon.png" alt="Gogs Logo" id="gogs-logo"></a> | ||||
|             <a class="gogs-nav-item" href="#">Dashboard</a> | ||||
|             <a class="gogs-nav-item" href="#">Explore</a> | ||||
|             <a class="gogs-nav-item" href="#">Help</a> | ||||
|             <a class="gogs-nav-item navbar-right navbar-btn btn btn-danger" href="/login/">Sign in</a> | ||||
|             <!--<a class="gogs-nav-item navbar-right" href="#">Profile</a>--> | ||||
|         </nav> | ||||
|     </div> | ||||
| </div> | ||||
| <!--<nav class="navbar navbar-inverse navbar-fixed-top"> | ||||
| 	<div class="container"> | ||||
| 		<div class="navbar-header"> | ||||
| 			<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#gogs-navbar-collapse"> | ||||
|  | @ -15,4 +27,4 @@ | |||
| 			<a href="/user/signin" class="navbar-right btn btn-success navbar-btn">Sign In</a> | ||||
| 		</div> | ||||
| 	</div> | ||||
| </nav> | ||||
| </nav>--> | ||||
|  |  | |||
|  | @ -1,6 +1,6 @@ | |||
| {{template "base/head" .}} | ||||
| {{template "base/navbar" .}} | ||||
| <div class="container"> | ||||
| <div id="gogs-body" class="container"> | ||||
| 	Website is still in the progress of building...please come back later! | ||||
| </div> | ||||
| {{template "base/footer" .}} | ||||
							
								
								
									
										34
									
								
								templates/user/signin.tmpl
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										34
									
								
								templates/user/signin.tmpl
									
									
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,34 @@ | |||
| {{template "base/head" .}} | ||||
| {{template "base/navbar" .}} | ||||
| <div class="container" id="gogs-body"> | ||||
|     <form action="/user/signup" method="post" class="form-horizontal" id="gogs-login-card"> | ||||
|         <h3>Log in</h3> | ||||
|         <div class="form-group"> | ||||
|             <label class="col-md-4 control-label">Username or Email: </label> | ||||
|             <div class="col-md-6"> | ||||
|                 <input name="account" class="form-control" placeholder="Type your username or e-mail address"> | ||||
|             </div> | ||||
|         </div> | ||||
|         <div class="form-group"> | ||||
|             <label class="col-md-4 control-label">Password: </label> | ||||
|             <div class="col-md-6"> | ||||
|                 <input name="passwd" type="password" class="form-control" placeholder="Type your password"> | ||||
|             </div> | ||||
|         </div> | ||||
|         <div class="form-group"> | ||||
|             <div class="col-md-offset-4 col-md-6"> | ||||
|                 <button type="submit" class="btn btn-lg btn-primary">Log In</button> | ||||
|                 <a href="/forget-password/">Forgot your password?</a> | ||||
|             </div> | ||||
|         </div> | ||||
|         <div class="form-group"> | ||||
|             <div class="col-md-offset-4 col-md-6"> | ||||
|                 <a href="/sign-up/">Need an account? Sign up free.</a> | ||||
|             </div> | ||||
|         </div> | ||||
|         <div class="form-group text-center" id="gogs-social-login"> | ||||
|             <a class="btn btn-default btn-lg">Social Login</a> | ||||
|         </div> | ||||
|     </form> | ||||
| </div> | ||||
| {{template "base/footer" .}} | ||||
|  | @ -1,43 +1,44 @@ | |||
| {{template "base/head" .}} | ||||
| {{template "base/navbar" .}} | ||||
| <div class="container"> | ||||
| 	<form action="/user/signup" method="post" class="form-horizontal"> | ||||
| <div class="container" id="gogs-body"> | ||||
| 	<form action="/user/signup" method="post" class="form-horizontal" id="gogs-login-card"> | ||||
|         <h3>Sign Up</h3> | ||||
| 		<div class="form-group"> | ||||
| 			<label class="col-md-4 control-label">Username: </label> | ||||
| 			<div class="col-md-3"> | ||||
| 			<div class="col-md-6"> | ||||
| 				<input name="username" class="form-control" placeholder="Type your username"> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<div class="form-group"> | ||||
| 			<label class="col-md-4 control-label">Email: </label> | ||||
| 			<div class="col-md-3"> | ||||
| 			<div class="col-md-6"> | ||||
| 				<input name="email" class="form-control" placeholder="Type your e-mail address"> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<div class="form-group"> | ||||
| 			<label class="col-md-4 control-label">Password: </label> | ||||
| 			<div class="col-md-3"> | ||||
| 			<div class="col-md-6"> | ||||
| 				<input name="passwd" type="password" class="form-control" placeholder="Type your password"> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<div class="form-group"> | ||||
| 			<label class="col-md-4 control-label">Re-type: </label> | ||||
| 			<div class="col-md-3"> | ||||
| 			<div class="col-md-6"> | ||||
| 				<input type="password" class="form-control" placeholder="Re-type your password"> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<div class="form-group"> | ||||
| 		    <div class="col-md-offset-4 col-md-3"> | ||||
| 		    	<button type="submit" class="btn btn-info">Sign Up</button> | ||||
| 		    <div class="col-md-offset-4 col-md-6"> | ||||
| 		    	<button type="submit" class="btn btn-lg btn-primary">Create an account</button> | ||||
| 		    </div> | ||||
| 		</div> | ||||
| 
 | ||||
| 	    <div class="col-md-offset-4 col-md-3"> | ||||
| 	    	<a href="/user/signin">Already have an account? Sign in now!</a> | ||||
| 	    <div class="form-group"> | ||||
|             <div class="col-md-offset-4 col-md-6"> | ||||
|                 <a href="/sign-up">Already have an account? Sign in now!</a> | ||||
|             </div> | ||||
| 	    </div> | ||||
| 	</form> | ||||
| </div> | ||||
|  |  | |||
							
								
								
									
										8
									
								
								web.go
									
									
									
									
									
								
							
							
						
						
									
										8
									
								
								web.go
									
									
									
									
									
								
							|  | @ -48,10 +48,14 @@ func runWeb(*cli.Context) { | |||
| 
 | ||||
| 	// Routers.
 | ||||
| 	m.Get("/", routers.Dashboard) | ||||
| 	m.Get("/user/signin", user.SignIn) | ||||
| 	m.Any("/login", user.SignIn) | ||||
| 	m.Any("/user/signin", user.SignIn) | ||||
| 
 | ||||
| 	m.Any("/sign-up", user.SignUp) | ||||
| 	m.Any("/user/signup", user.SignUp) | ||||
| 
 | ||||
| 	m.Any("/user/delete", user.Delete) | ||||
| 	m.Any("/user/publickey/add", user.AddPublickKey) | ||||
| 	m.Any("/user/publickey/add", user.AddPublicKey) | ||||
| 	m.Any("/repo/create", repo.Create) | ||||
| 	m.Any("/repo/delete", repo.Delete) | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue