이승윤

style: login, 회원가입 스타일 변경

1 <% include ../includes/header.ejs %> 1 <% include ../includes/header.ejs %>
2 -<div class="row"> 2 +<div class="w-25 border border-info border-3" style="position: absolute; left: 37%; top: 17%;">
3 - <div class="col-md-4 col-md-offset-4"> 3 + <div>
4 - <div class="login-panel panel panel-default"> 4 + <div>
5 - <div class="panel-heading"> 5 + <div style="padding-top: 5%; padding-left: 5%;">
6 <h3 class="panel-title">회원가입</h3> 6 <h3 class="panel-title">회원가입</h3>
7 </div> 7 </div>
8 <div class="panel-body"> 8 <div class="panel-body">
9 <form role="form" action="" id="join_form" method="post"> 9 <form role="form" action="" id="join_form" method="post">
10 <fieldset> 10 <fieldset>
11 - <div class="form-group"> 11 + <div class="w-100" style="padding-left: 5%; padding-right: 5%;">
12 <input class="form-control" placeholder="ID" name="username" type="text" autofocus="" required=""> 12 <input class="form-control" placeholder="ID" name="username" type="text" autofocus="" required="">
13 </div> 13 </div>
14 - <div class="form-group"> 14 + <div class="w-100" style="padding-left: 5%; padding-right: 5%;padding-top: 3%">
15 <input class="form-control" placeholder="Password" name="password" type="password" value="" required=""> 15 <input class="form-control" placeholder="Password" name="password" type="password" value="" required="">
16 </div> 16 </div>
17 - <div class="form-group"> 17 + <div class="w-100" style="padding-left: 5%; padding-right: 5%;padding-top: 3%">
18 <input class="form-control" placeholder="Password 확인" name="password2" type="password" value="" required=""> 18 <input class="form-control" placeholder="Password 확인" name="password2" type="password" value="" required="">
19 </div> 19 </div>
20 - <div class="form-group"> 20 + <div class="w-100" style="padding-left: 5%; padding-right: 5%;padding-top: 3%">
21 <input class="form-control" placeholder="이름" name="displayname" type="text" value="" required=""> 21 <input class="form-control" placeholder="이름" name="displayname" type="text" value="" required="">
22 </div> 22 </div>
23 <!-- Change this to a button or input when using this as a form --> 23 <!-- Change this to a button or input when using this as a form -->
24 + <div class="d-grid gap-2 col-11 mx-auto p-2">
24 <input type="submit" class="btn btn-lg btn-success btn-block" value="가입하기"> 25 <input type="submit" class="btn btn-lg btn-success btn-block" value="가입하기">
25 - <div style="margin-top: 10px">
26 <a href="/auth/facebook" class="btn btn-lg btn-primary btn-block"> 26 <a href="/auth/facebook" class="btn btn-lg btn-primary btn-block">
27 <i class="fa fa-facebook" aria-hidden="true"></i> 페이스북 회원가입 27 <i class="fa fa-facebook" aria-hidden="true"></i> 페이스북 회원가입
28 </a> 28 </a>
......
1 <% include ../includes/header.ejs %> 1 <% include ../includes/header.ejs %>
2 -<div class="row"> 2 +<div class="w-25 border border-info border-3" style="position: absolute; left: 37%; top: 17%;">
3 - <div class="col-md-4 col-md-offset-4"> 3 + <div>
4 <%if(typeof flashMessage !=='undefined') {%> 4 <%if(typeof flashMessage !=='undefined') {%>
5 <div class="alert alert-danger" role="alert"><%=flashMessage%></div> 5 <div class="alert alert-danger" role="alert"><%=flashMessage%></div>
6 <%}%> 6 <%}%>
7 - <div class="login-panel panel panel-default"> 7 + <div>
8 - <div class="panel-heading"> 8 + <div style="padding-top: 5%; padding-left: 5%;">
9 <h3 class="panel-title">로그인</h3> 9 <h3 class="panel-title">로그인</h3>
10 </div> 10 </div>
11 <div class="panel-body"> 11 <div class="panel-body">
12 <form role="form" action="" id="login_form" method="post"> 12 <form role="form" action="" id="login_form" method="post">
13 <fieldset> 13 <fieldset>
14 - <div class="form-group"> 14 + <div class="w-100" style="padding-left: 5%; padding-right: 5%;">
15 + <label for="login" class="form-label">ID</label>
15 <input class="form-control" placeholder="ID" name="username" type="text" autofocus="" required=""> 16 <input class="form-control" placeholder="ID" name="username" type="text" autofocus="" required="">
16 </div> 17 </div>
17 - <div class="form-group"> 18 + <div class="w-100 p-3">
19 + <label for="password" class="form-label">Password</label>
18 <input class="form-control" placeholder="Password" name="password" type="password" value="" required=""> 20 <input class="form-control" placeholder="Password" name="password" type="password" value="" required="">
19 </div> 21 </div>
20 <!-- Change this to a button or input when using this as a form --> 22 <!-- Change this to a button or input when using this as a form -->
23 + <div class="d-grid gap-2 col-11 mx-auto p-2">
21 <input type="submit" class="btn btn-lg btn-success btn-block" value="로그인"> 24 <input type="submit" class="btn btn-lg btn-success btn-block" value="로그인">
22 - <div style="margin-top: 10px">
23 <a href="/auth/facebook" class="btn btn-lg btn-primary btn-block"> 25 <a href="/auth/facebook" class="btn btn-lg btn-primary btn-block">
24 <i class="fa fa-facebook" aria-hidden="true"></i> 페이스북 로그인 26 <i class="fa fa-facebook" aria-hidden="true"></i> 페이스북 로그인
25 </a> 27 </a>
......