codeit-bootcamp-frontend · GANGYIKIM · Feb 25, 2025 · Feb 24, 2025 · Feb 24, 2025 · GANGYIKIM
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+	"liveServer.settings.port": 5501
+}
diff --git a/faq.html b/faq.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>판다마켓</title>
+	</head>
+	<body></body>
+</html>
diff --git a/image/Img_home_01.png b/image/Img_home_01.png
diff --git a/image/Img_home_02.png b/image/Img_home_02.png
diff --git a/image/Img_home_03.png b/image/Img_home_03.png
diff --git a/image/Img_home_bottom.png b/image/Img_home_bottom.png
diff --git a/image/Img_home_top.png b/image/Img_home_top.png
diff --git a/image/ic_facebook.png b/image/ic_facebook.png
diff --git a/image/ic_instagram.png b/image/ic_instagram.png
diff --git a/image/ic_twitter.png b/image/ic_twitter.png
diff --git a/image/ic_youtube.png b/image/ic_youtube.png
diff --git a/image/logo.png b/image/logo.png
diff --git a/image/main1.png b/image/main1.png
diff --git a/image/main2.png b/image/main2.png
diff --git a/image/main3.png b/image/main3.png
diff --git a/index.html b/index.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+<html lang="ko">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>판다마켓</title>
+
+		<link rel="stylesheet" href="style.css" />
+		<link
+			rel="stylesheet"
+			as="style"
+			crossorigin
+			href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css" />
+	</head>
+	<body>
+		<header>
+			<div class="header_wrap">
+				<a href="/"><img src="/image/logo.png" alt="판다마켓 로고" class="logo" /></a>
+				<a href="/login.html" class="login">로그인</a>
+			</div>
+		</header>
+		<main>
+			<div class="heading">
+				<div class="text_box">
+					<h1 class="heading_title">
+						<span>일상의 모든 물건을 </span>
+						<span>거래해 보세요</span>
+					</h1>
+					<a href="/items.html" class="view_button">구경하러 가기</a>
+				</div>
+				<img src="/image/Img_home_top.png" />
+			</div>
+
+			<div class="hot_item content_wrap">
+				<div class="category_box">
+					<img src="/image/Img_home_01.png" />
+					<div class="category_description">
+						<h3 class="category_title">Hot item</h3>
+						<h1 class="title">인기 상품을<br />확인해 보세요</h1>
+						<p class="description">
+							가장 HOT한 중고거래 물품을<br />
+							판다 마켓에서 확인해 보세요
+						</p>
+					</div>
+				</div>
+			</div>
+
+			<div class="search content_wrap">
+				<div class="category_box">
+					<img src="/image/Img_home_02.png" />
+					<div class="category_description">
+						<h3 class="category_title">Search</h3>
+						<h1 class="title">
+							구매를 원하는<br />
+							상품을 검색하세요
+						</h1>
+						<p class="description">
+							구매하고 싶은 물품은 검색해서<br />
+							쉽게 찾아보세요
+						</p>
+					</div>
+				</div>
+			</div>
+
+			<div class="register content_wrap">
+				<div class="category_box">
+					<img src="/image/Img_home_03.png" />
+					<div class="category_description">
+						<h3 class="category_title">Register</h3>
+						<h1 class="title">
+							판매를 원하는<br />
+							상품을 등록하세요
+						</h1>
+						<p class="description">
+							어떤 물건이든 판매하고 싶은 상품을<br />
+							쉽게 등록하세요
+						</p>
+					</div>
+				</div>
+			</div>
+
+			<div class="ad">
+				<h1 class="title">믿을 수 있는<br />판다마켓 중고 거래</h1>
+				<img src="/image/Img_home_bottom.png" class="ad_img" />
+			</div>
+		</main>
+		<footer>
+			<div class="ft_content_wrap">
+				<span class="codeit">@codeit - 2024</span>
+				<div class="privacy_faq">
+					<a href="/privacy.html" class="policy">Privacy Policy</a>
+					<a href="faq.html">FAQ</a>
+				</div>
+				<div class="icons">
+					<a href="https://www.facebook.com/?locale=ko_KR" target="_blank"></a
+					><img src="/image/ic_facebook.png" alt="페이스북" />
+					<a href="https://x.com/?lang=ko" target="_blank"></a
+					><img src="/image/ic_twitter.png" alt="트위터" />
+					<a href="https://www.youtube.com/" target="_blank"></a
+					><img src="/image/ic_youtube.png" alt="유튜브" />
+					<a href="https://www.instagram.com/" target="_blank"></a
+					><img src="/image/ic_instagram.png" alt="인스타그램" />
+				</div>
-				<div class="icons">
-					<a href="https://www.facebook.com/?locale=ko_KR" target="_blank"></a
-					><img src="/image/ic_facebook.png" alt="페이스북" />
-					<a href="https://x.com/?lang=ko" target="_blank"></a
-					><img src="/image/ic_twitter.png" alt="트위터" />
-					<a href="https://www.youtube.com/" target="_blank"></a
-					><img src="/image/ic_youtube.png" alt="유튜브" />
-					<a href="https://www.instagram.com/" target="_blank"></a
-					><img src="/image/ic_instagram.png" alt="인스타그램" />
-				</div>
+				<ul class="icons">
+				        <li>
+					          <a href="https://www.facebook.com/?locale=ko_KR" target="_blank">
+  					                <img src="/image/ic_facebook.png" alt="페이스북" />
+  					          </a>
+  					</li>
+				</ul>
-				<div class="icons">
-					<a href="https://www.facebook.com/?locale=ko_KR" target="_blank"></a
-					><img src="/image/ic_facebook.png" alt="페이스북" />
-					<a href="https://x.com/?lang=ko" target="_blank"></a
-					><img src="/image/ic_twitter.png" alt="트위터" />
-					<a href="https://www.youtube.com/" target="_blank"></a
-					><img src="/image/ic_youtube.png" alt="유튜브" />
-					<a href="https://www.instagram.com/" target="_blank"></a
-					><img src="/image/ic_instagram.png" alt="인스타그램" />
-				</div>
+				<ul class="icons">
+				        <li>
+					          <a href="https://www.facebook.com/?locale=ko_KR" target="_blank">
+  					                <img src="/image/ic_facebook.png" alt="페이스북" />
+  					          </a>
+  					</li>
+				</ul>
+			</div>
+		</footer>
+	</body>
+</html>
diff --git a/items.html b/items.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>판다마켓</title>
+	</head>
+	<body></body>
+</html>
diff --git a/login.html b/login.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>판다마켓</title>
+	</head>
+	<body></body>
+</html>
diff --git a/privacy.html b/privacy.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>판다마켓</title>
+	</head>
+	<body></body>
+</html>