What2Do / What2Do

Go to a project
Toggle navigation Toggle navigation pinning
EunJi
34231ed2 1 parent 8098fd33

Decorate Homepage

Inline Side-by-side
Showing 3 changed files with 165 additions and 40 deletions
*{
margin: 0;
padding: 0;
font-family: sans-serif;
font-weight: bold;
font-size: 12px;
}
.wrap{
height: 100%;
width: 100%;
/* background-image: url(~)
background-position: center;
background-size: cover;*/
position: absolute;
}
.form-wrap{
width: 380px;
height: 480px;
position: relative;
margin: 6% auto;
background: rgba(172, 158, 158, 0.342);
padding: 5px;
overflow: hidden;
}
.button-wrap{
width: 230px;
margin: 35px auto;
position: relative;
box-shadow: 0 0 600px 9px #fcae8f;
border-radius: 30px;
}
.togglebtn{
padding: 10px 30px;
cursor: pointer;
background: transparent;
border: 0;
outline: none;
position: relative;
}
#btn1{
top: 0;
left: 0;
width: 110px;
height: 100%;
position: absolute;
/* background: linear-gradient(to right, #00498c, #9bbbd4); */
background: #9bbbd4;
border-radius: 30px;
transition: .5s;
}
#btn2{
top: 0;
left: 0;
width: 110px;
height: 100%;
margin-left: 115px;
position: absolute;
/* background: linear-gradient(to right, #00498c, #9bbbd4); */
background: #9bbbd4;
border-radius: 30px;
transition: .5s;
}
#btn:active{
margin-left: -10px;
}
.social-icons{
margin: 8px auto;
text-align: center;
}
.social-icons img{
width: 200px;
height: 50px;
cursor: pointer;
text-align: center;
}
.input-group{
top: 120px;
position: absolute;
width: 280px;
}
.input-field{
width: 100%;
padding: 10px 0;
margin: 5px 0; /*id password 입력칸 사이 간격*/
border: none;
border-bottom: 1.3px solid #999;
outline: none;
background: transparent;
}
.submit{
width: 85%;
padding: 15px 25px;
cursor: pointer;
display: block;
margin: 15px;
/* background: linear-gradient(to right, #ff105f, #ffad06); */
background: #9bbbd4;
border: 0;
outline: none;
border-radius: 30px;
}
#login{
left: 50px;
}
#sign_up{
left: 50px;
}
......@@ -7,28 +7,28 @@
<title>Login</title>
<script src="https://developers.kakao.com/sdk/js/kakao.js"></script>
<script src="https://static.nid.naver.com/js/naveridlogin_js_sdk_2.0.2.js" charset="utf-8"></script>
<link rel="stylesheet" href="/css/firstpage.css">
</head>
<body>
<h1>로그인</h1>
<br>
<form method="post" action="/login">
<table>
<tr>
<td><label>아이디</label></td>
<td><input type="text" name="id"></td>
</tr>
<tr>
<td><labeL>비밀번호</labeL></td>
<td><input type="password" name="password"></td>
</tr>
</table>
<input type="submit" value="전송" name="">
</form>
<div><a href="/auth/login/kakao"><img src="/images/kakaolog.png" width=" 300px" height="60px"></a></div>
<div><a href="/auth/login/naver"><img src="/images/naverlog.png" width=" 300px" height="60px"></a></div>
<div class="wrap">
<div class = "form-wrap">
<div class="button-wrap">
<div id="btn1"></div>
<button type = "button" class="togglebtn" >LOG IN</button>
<button type="button" class="togglebtn" onclick="location.href='/signup'">SIGN UP</button>
</div>
<form id="login" class="input-group" method="post" action="/login">
<input type="text" class = "input-field" placeholder="ID" name='id'>
<input type="password" class="input-field" placeholder="Password" name='password'>
<button class ="submit">LOGIN</button>
<div class = "social-icons">
<a href="/auth/login/kakao"><img src="/images/kakaolog.png" width=" 240px" height="57px"></a>
</div>
</form>
</div>
</div>
<a href="/signup">회원가입</a>
</body>
</html>
\ No newline at end of file
......
......@@ -2,27 +2,28 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<title>사용자 추가 테스트</title>
<title>Sign Up</title>
<link rel="stylesheet" href="/css/firstpage.css">
</head>
<body>
<h1>사용자 추가</h1>
<br>
<form method="post" action="/signup">
<table>
<tr>
<td><label>아이디</label></td>
<td><input type="text" name="id"></td>
</tr>
<tr>
<td><label>비밀번호</label></td>
<td><input type="password" name="password"></td>
</tr>
<tr>
<td><labeL>사용자명</labeL></td>
<td><input type="text" name="name"></td>
</tr>
</table>
<input type="submit" value="전송" name="">
</form>
<div class="wrap">
<div class="form-wrap">
<div class = "button-wrap">
<div id="btn2"></div>
<button type="button" class="togglebtn" onclick="location.href='/login'">LOG IN</button>
<button type = "button" class="togglebtn">SIGN UP</button>
</div>
<form id='sign_up' class="input-group" method="post" action="/signup" >
<input type="text" name='id' class='input-field' placeholder='ID'>
<input type="password" name="password" class = 'input-field' placeholder='Password'>
<input type = "text" name="name" class='input-field' placeholder="UserName">
<button class="submit">SIGN UP</button>
</form>
</div>
</div>
</body>
</html>
\ No newline at end of file
......