Skip to content

Commit

Permalink
Merge pull request #69 from April-37/Basic-모수진-sprint4
Browse files Browse the repository at this point in the history
[모수진] Sprint4
  • Loading branch information
JaeSang1998 authored Sep 3, 2024
2 parents b74d6a6 + 6afba4b commit 6fceba2
Show file tree
Hide file tree
Showing 9 changed files with 115 additions and 36 deletions.
24 changes: 12 additions & 12 deletions desktop.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,65 +10,65 @@
<div id="wrapper">
<header>
<div class="header">
<div class="header-con"><a href="/"><img src="./image/md.png" class="header-logo" alt="판다마켓"></a></div>
<div class="header-con"><input type="button" value="로그인" class="login" onClick="location.href='login.html'"></div>
<div class="header-container"><a href="/"><img src="./image/md.png" class="header-logo" alt="판다마켓"></a></div>
<div class="header-container"><input type="button" value="로그인" class="login" onClick="location.href='login.html'"></div>
</div>
</header>

<main>
<!-- main_top -->
<div class="home-top">
<div class="top-con">
<div class="top-container">
<div id="top-left">
<div id="top-info">
일상의 모든 물건을<br>
거래해 보세요<br>
</div>
<br><input id="goitems" type="button" value="구경하러 가기" onclick="location.href='items.html'">
<br><input id="go-items" type="button" value="구경하러 가기" onclick="location.href='items.html'">
</div>
<div id="top-img"><img src="./image/Img_home_top.png"></div>
</div>
</div>

<!-- main_show1 -->
<div class="show">
<div class="show-con" id="show1">
<div class="show-container" id="show1">
<div class="show-img"><img src="./image/Img_home_01.png"></div>
<div class="show-info">
<p id="show-title">Hot item</p>
<p id="show-main">인기 상품을<br>확인해 보세요</p>
<p id="show-des">가장 HOT한 중고거래 물품을<br>판다 마켓에서 확인해 보세요</p>
<p id="show-descript">가장 HOT한 중고거래 물품을<br>판다 마켓에서 확인해 보세요</p>
</div>
</div>
</div>

<!-- main_show2 -->
<div class="show">
<div class="show-con" id="show2">
<div class="show-container" id="show2">
<div class="show-info">
<p id="show-title">Search</p>
<p id="show-main">구매를 원하는<br>상품을 검색하세요</p>
<p id="show-des">구매하고 싶은 물품은 검색해서<br>쉽게 찾아보세요</p>
<p id="show-descript">구매하고 싶은 물품은 검색해서<br>쉽게 찾아보세요</p>
</div>
<div class="show-img"><img src="./image/Img_home_02.png"></div>
</div>
</div>

<!-- main_show3 -->
<div class="show">
<div class="show-con" id="show3">
<div class="show-container" id="show3">
<div class="show-img"><img src="./image/Img_home_03.png"></div>
<div class="show-info">
<p id="show-title">Register</p>
<p id="show-main">판매를 원하는<br>상품을 등록하세요</p>
<p id="show-des">어떤 물건이든 판매하고 싶은 상품을<br>쉽게 등록하세요</p>
<p id="show-descript">어떤 물건이든 판매하고 싶은 상품을<br>쉽게 등록하세요</p>
</div>
</div>
</div>

<!-- main_bottom -->
<div class="home-bottom">
<div class="bottom-con">
<div class="bottom-container">
<div id="bottom-left">
<div id="bottom-info">
믿을 수 있는<br>
Expand All @@ -82,7 +82,7 @@

<footer>
<div class="footer">
<div class="footer-con">
<div class="footer-container">
<div class="footer-text">@codeit - 2024</div>
<div class="footer-text"><a href="./privacy.html">Privacy Policy</a> &emsp; <a href="./faq.html">FAQ</a></div>
<div class="footer-text">
Expand Down
1 change: 0 additions & 1 deletion items.html

This file was deleted.

5 changes: 3 additions & 2 deletions login.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,12 @@
</head>
<body>
<main>
<div class="main-con">
<div class="main-container">
<div class="logo">
<img src="./image/lg.png">
</div>
<form method="post">
<div class="input-con">
<div class="input-container">
<div class="input-item">
<label for="email">이메일</label>
<input
Expand Down Expand Up @@ -52,5 +52,6 @@
<div class="signup">판다마켓이 처음이신가요? <a href="./signup.html">회원가입</a></div>
</div>
</main>
<script src="./login.js"></script>
</body>
</html>
28 changes: 28 additions & 0 deletions login.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
const emailForm = document.getElementById("email");
const pwdForm = document.getElementById("password");



emailForm.addEventListener("focusout", (event) => {
var emailValue=emailForm.value;
if(emailValue == '') {
event.target.style.border='1px solid var(--red)';
//todo: print error message
}
else {
event.target.style.border='0';
}
})
pwdForm.addEventListener("focusout",(event) => {
var pwdValue=pwdForm.value;
if(pwdValue == '') {
event.target.style.border='1px solid var(--red)';
// todo: print error message
}
else if(pwdValue.length < 8 ) {
event.target.style.border='1px solid var(--red)'; //todo: print error message
}
else {
event.target.style.border='0';
}
})
11 changes: 6 additions & 5 deletions signup.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,12 @@
</head>
<body>
<main>
<div class="main-con">
<div class="main-container">
<div class="logo">
<img src="./image/lg.png">
</div>
<form method="post">
<div class="input-con">
<div class="input-container">
<div class="input-item">
<label for="email">이메일</label>
<input
Expand Down Expand Up @@ -49,11 +49,11 @@
</div>
</div>
<div class="input-item">
<label for="passwordConfirmation">비밀번호 확인</label>
<label for="passwordConfirm">비밀번호 확인</label>
<div class="input-wrapper">
<input
id="passwordConfirmation"
name="passwordConfirmation"
id="passwordConfirm"
name="passwordConfirm"
type="password"
placeholder="비밀번호를 다시 한 번 입력해 주세요"
/>
Expand All @@ -77,5 +77,6 @@
<div class="login">이미 회원이신가요? <a href="./login.html">로그인</a></div>
</div>
</main>
<script src="./signup.js"></script>
</body>
</html>
50 changes: 50 additions & 0 deletions signup.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
const emailForm = document.getElementById("email");
const nickForm = document.getElementById("nickname");
const pwdForm = document.getElementById("password");
const pwdConfirmForm = document.getElementById("passwordConfirm");


emailForm.addEventListener("focusout", (event) => {
var emailValue=emailForm.value;
if(emailValue == '') {
event.target.style.border='1px solid var(--red)';
//todo: print error message
}
else {
event.target.style.border='0';
}
})
nickForm.addEventListener("focusout",(event) => {
var nickValue=nickForm.value;
if(nickValue == '') {
event.target.style.border='1px solid var(--red)';
//todo: print error message
}
else {
event.target.style.border='0';
}
})
pwdForm.addEventListener("focusout",(event) => {
var pwdValue=pwdForm.value;
if(pwdValue == '') {
event.target.style.border='1px solid var(--red)';
// todo: print error message
}
else if(pwdValue.length < 8 ) {
event.target.style.border='1px solid var(--red)'; //todo: print error message
}
else {
event.target.style.border='0';
}
})
pwdConfirmForm.addEventListener("focusout",(event) => {
var pwdValue=pwdForm.value;
var pwdConfirmValue=pwdConfirmForm.value;
if(pwdValue!=pwdConfirmValue) {
event.target.style.border='1px solid var(--red)';
//todo: print error message
}
else {
event.target.style.border='0';
}
})
28 changes: 14 additions & 14 deletions style/style_desktop.css
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ header {
height:70px;
padding:0;
}
.header-con {
.header-container {
float:left;
height:100%;
width:50%;
Expand Down Expand Up @@ -60,7 +60,7 @@ header {
display: flex;
justify-content: center;
}
.top-con{
.top-container {
width:1110px;
height:340px;
position: absolute;
Expand All @@ -83,7 +83,7 @@ header {
float:left;
width:746px;
}
#goitems {
#go-items {
width:357px;
padding:16px 124px;
border-radius: 40px;
Expand All @@ -100,7 +100,7 @@ header {
display:flex;
justify-content: center;
}
.show-con {
.show-container {
width:955px;
height:444px;
margin:0px auto;
Expand Down Expand Up @@ -134,7 +134,7 @@ header {
font-weight: 700;
line-height: 56px;
}
#show-des {
#show-descript {
font-size: 22px;
font-weight: 500;
line-height: 32px;
Expand All @@ -147,7 +147,7 @@ header {
display: flex;
justify-content: center;
}
.bottom-con{
.bottom-container {
width:1110px;
height:397px;
position: absolute;
Expand Down Expand Up @@ -176,16 +176,16 @@ header {
background-color: var(--gray900);
padding-top: 32px;
}
.footer-con {
.footer-container {
width:1120px;
margin:0px auto;
display:flex;
justify-content: space-between;
}
.footer-con .footer-text {
.footer-container .footer-text {
color:var(--gray400);
}
.footer-con .footer-text a {
.footer-container .footer-text a {
color:var(--gray200);
}

Expand All @@ -200,7 +200,7 @@ header {
#top-info {
text-align: center;
}
.footer-con {
.footer-container {
width:90%;
}
}
Expand Down Expand Up @@ -228,7 +228,7 @@ header {
display: flex;
justify-content: center;
}
.top-con {
.top-container {
width:400px;
height:100%;
justify-content: center;
Expand All @@ -240,7 +240,7 @@ header {
justify-content: center;
top:50px;
}
#goitems {
#go-items {
display: block;
margin:0 auto;
}
Expand All @@ -267,7 +267,7 @@ header {
display: flex;
justify-content: center;
}
.bottom-con {
.bottom-container {
width:400px;
height:100%;
justify-content: center;
Expand All @@ -284,7 +284,7 @@ header {
position:absolute;
bottom:0px;
}
.footer-con {
.footer-container {
width:90%;
}
}
2 changes: 1 addition & 1 deletion style/style_login.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ body {
padding:0px;
line-height: 26px;
}
.main-con {
.main-container {
margin:231px auto;
max-width:640px;
}
Expand Down
2 changes: 1 addition & 1 deletion style/style_signup.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ body {
padding:0px;
line-height: 26px;
}
.main-con {
.main-container {
margin:60px auto;
max-width:640px;
}
Expand Down

0 comments on commit 6fceba2

Please sign in to comment.