codeit-bootcamp-frontend · addiescode-sj · Apr 4, 2025 · Apr 1, 2025 · Apr 1, 2025 · Apr 1, 2025
diff --git a/faq/index.html b/faq/index.html
diff --git a/images/bottom_banner.png b/images/bottom_banner.png
diff --git a/images/favi.ico b/images/favi.ico
diff --git a/images/hot_item.png b/images/hot_item.png
diff --git a/images/ic_facebook.png b/images/ic_facebook.png
diff --git a/images/ic_instagram.png b/images/ic_instagram.png
diff --git a/images/ic_twitter.png b/images/ic_twitter.png
diff --git a/images/ic_youtube.png b/images/ic_youtube.png
diff --git a/images/logo.png b/images/logo.png
diff --git a/images/register.png b/images/register.png
diff --git a/images/search.png b/images/search.png
diff --git a/images/top_main.png b/images/top_main.png
diff --git a/index.html b/index.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>판다마켓</title>
+
+    <link rel="icon" href="./images/favi.ico">
+    <link rel="stylesheet" href="reset.css">
+    <link rel="stylesheet" href="style.css" />
+</head>
+
+<body>
+    <div class="page-wrapper">
+        <header>
+            <nav class="nav__container">
+                <a class="nav__logo" href="./">
+                    <img src="./images/logo.png" alt="판다마켓로고">
+                </a>
+                <a class="nav__button" href="./login">로그인</a>
+            </nav>
+        </header>
+        <main>
+            <section class="main__hero">
+                <article class="hero__content container">
+                    <div class="hero__text">
+                        <h2>일상의 모든 물건을<br> 거래해 보세요</h2>
+                        <a href="./items">
+                            <button type="button">
+                                <span>
+                                    구경하러 가기
+                                </span>
+                            </button>
+                        </a>
+                    </div>
+                    <img class="hero__img" src="./images/top_main.png" alt="판다마켓메인이미지">
+                </article>
+            </section>
+            <section class="main__hot-item">
+                <article class="hot-item__content container">
+                    <img src="./images/hot_item.png" alt="핫아이템">
+                    <div class="hot-item__text">
+                        <span>Hot item</span>
+                        <h2>
+                            인기 상품을<br>
+                            확인해 보세요
+                        </h2>
+                        <p>
+                            가장 HOT한 중고거래 물품을 판다 마켓에서 확인해 보세요
+                        </p>
+                    </div>
+                </article>
+            </section>
+            <section class="main__search">
+                <article class="search__content container">
+                    <div class="search__text">
+                        <span>Search</span>
+                        <h2>
+                            구매를 원하는<br>
+                            상품을 검색하세요
+                        </h2>
+                        <p>
+                            구매하고 싶은 물품은 검색해서 쉽게 찾아보세요
+                        </p>
+                    </div>
+                    <img src="./images/search.png" alt="상품검색">
+                </article>
+            </section>
+            <section class="main__register">
+                <article class="register__content container">
+                    <img src="./images/register.png" alt="판매등록">
+                    <div class="register__text">
+                        <span>Register</span>
+                        <h2>
+                            판매를 원하는<br>
+                            상품을 등록하세요
+                        </h2>
+                        <p>
+                            어떤 물건이든 판매하고 싶은 상품을 쉽게 등록하세요
+                        </p>
+                    </div>
+                </article>
+            </section>
+            <section class="main__banner">
+                <div class="container">
+                    <div class="banner__text">
+                        믿을 수 있는<br>
+                        판다마켓 중고 거래
+                    </div>
+                    <img src="./images/bottom_banner.png" alt="판다마켓광고">
+                </div>
+            </section>
+        </main>
+        <footer>
+            <div class="footer__container container">
+                <span>©codeit - 2024</span>
+                <div>
+                    <a href="./privacy">Privacy Policy</a>
+                    <a href="./faq">FAQ</a>
+                </div>
+                <ul class="footer__sns-list">
+                    <li><a target="_blank" href="https://www.facebook.com/?locale=ko_KR"><img src="./images/ic_facebook.png" alt="페이스북" /></a></li>
+                    <li><a target="_blank" href="https://x.com/i/flow/login?input_flow_data=%7B%22requested_variant%22%3A%22eyJsYW5nIjoia28ifQ%3D%3D%22%7D"><img src="./images/ic_twitter.png" alt="트위터" /></a></li>
+                    <li><a target="_blank" href="https://www.youtube.com/?hl=ko&gl=KR&app=desktop"><img src="./images/ic_youtube.png" alt="유튜브" /></a></li>
+                    <li><a target="_blank" href="https://www.instagram.com/"><img src="./images/ic_instagram.png" alt="인스타그램" /></a></li>
+                </ul>
+            </div>
+        </footer>
+    </div>
+</body>
+
+</html>
diff --git a/items/index.html b/items/index.html
diff --git a/login/index.html b/login/index.html
diff --git a/privacy/index.html b/privacy/index.html
diff --git a/reset.css b/reset.css
@@ -0,0 +1,20 @@
+@charset "UTF-8";
+
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+li {
+    list-style: none;
+}
+
+img {
+    vertical-align: top;
+}
+
+a{
+    text-decoration: none;
+    color:black
+}