codeit-bootcamp-nodejs · hyeyoonS · May 21, 2024 · May 21, 2024 · May 21, 2024 · May 21, 2024
diff --git a/index.html b/index.html
@@ -0,0 +1,199 @@
+<!DOCTYPE html>
+<html lang="ko">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="keyword" content="pandamarket, 판다마켓, codeit, 코드잇" />
+    <meta property="og:title" content="PandaMarket" />
+    <meta
+      property="og:description"
+      content="일상의 모든 물건을 거래해 보세요"
+    />
+
+    <title>판다마켓</title>
+    <link
+      rel="stylesheet"
+      type="text/css"
+      href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css"
+    />
+    <link rel="stylesheet" href="./src/style/reset.css" />
+    <link rel="stylesheet" href="./src/style/index.css" type="text/css" />
+
+    <script
+      async
+      src="https://www.googletagmanager.com/gtag/js?id=G-CVD8CL1E38"
+    ></script>
+    <script>
+      window.dataLayer = window.dataLayer || [];
+      function gtag() {
+        dataLayer.push(arguments);
+      }
+      gtag("js", new Date());
+
+      gtag("config", "G-CVD8CL1E38");
+    </script>
+  </head>
+  <body>
+    <nav class="header_nav" role="navigation">
+      <a href="/">
+        <img
+          src="src/assets/svg/Logo-Large.svg"
+          alt="판다마켓로고"
+          class="navLogo"
+        />
+      </a>
+      <div class="header_category">
+        <a class="category_btn" href="/">자유게시판</a>
+        <a class="category_btn" href="/">중고마켓</a>
+      </div>
+      <a class="login_btn" href="/pages/signin.html">로그인</a>
+    </nav>
+    <header class="header_section">
+      <div class="header_container">
+        <div class="header_wrapper">
+          <h1 class="header_title">
+            일상의 모든 물건을<br />
+            거래해보세요
+          </h1>
+          <a href="/pages/items.html" class="header_btn">구경하러가기 </a>
+        </div>
+        <div class="header_img_container">
+          <img
+            src="src/assets/image/header-content-image.png"
+            alt="헤더 이미지"
+            width="996"
+            height="417"
+          />
+        </div>
+      </div>
+    </header>
+
+    <main id="main">
+      <section class="section_container_left">
+        <div class="section_wrapper">
+          <img
+            src="/src/assets/image/home_01-image.png"
+            alt="link_save_img"
+            class="section_img"
+          />
+          <div class="text_content_right">
+            <div class="section_badge">Hot item</div>
+            <span class="section_title">
+              인기 상품을
+              <br />
+              확인해보세요
+            </span>
+            <p class="section_summary">
+              가장 HOT한 중고거래 물품을
+              <br />
+              판다 마켓에서 확인해 보세요
+            </p>
+          </div>
+        </div>
+      </section>
+
+      <section class="section_container_right">
+        <div class="section_wrapper">
+          <div class="text_content_left">
+            <div class="section_badge">Search</div>
+            <span class="section_title">
+              구매를 원하는
+              <br />
+              상품을 검색하세요
+            </span>
+            <p class="section_summary">
+              구매하고 싶은 물품은 검색해서
+              <br />
+              쉽게 찾아보세요
+            </p>
+          </div>
+          <img
+            src="/src/assets/image/home_02-image.png"
+            alt="folder_name_modify_img"
+            class="section_img"
+          />
+        </div>
+      </section>
+
+      <section class="section_container_left">
+        <div class="section_wrapper">
+          <img
+            src="/src/assets/image/home_03-image.png"
+            alt="social_media_share_img"
+            class="section_img"
+          />
+          <div class="text_content_right">
+            <div class="section_badge">Register</div>
+            <span class="section_title">
+              판매를 원하는
+              <br />
+              상품을 등록하세요
+            </span>
+            <p class="section_summary">
+              어떤 물건이든 판매하고 싶은 상품을
+              <br />
+              쉽게 등록하세요
+            </p>
+          </div>
+        </div>
+      </section>
+    </main>
+    <section class="bottom_header_section">
+      <div class="header_container">
+        <div class="header_wrapper">
+          <h1 class="header_title">
+            믿을 수 있는<br />
+            판다마켓 중고거래
+          </h1>
+        </div>
+        <div class="bottom_header_img_container">
+          <img
+            src="src/assets/image/home_bottom-iamge.png"
+            alt="바텀헤더 이미지"
+            width="996"
+            height="540"
+          />
+        </div>
+      </div>
+    </section>
+    <footer>
+      <div class="footer_wrapper">
+        <span class="copyright"> ©codeit - 2024 </span>
+        <div class="explain">
+          <a href="/pages/privacy.html" class="footer_link">Privacy Policy</a>
+          <a href="/pages/faq.html" class="footer_link">FAQ</a>
+        </div>
+        <div class="sns_icon">
+          <a
+            href="https://www.facebook.com/?locale=ko_KR"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <img src="/src/assets/svg/facebook-icon.svg" alt="facebook_ogo" />
+          </a>
+          <a
+            href="https://www.twitter.com/"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <img src="/src/assets/svg/twitter-icon.svg" alt="twitterLogo" />
+          </a>
+          <a
+            href="https://www.youtube.com/"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <img src="/src/assets/svg/youtube-icon.svg" alt="youtubeLogo" />
+          </a>
+          <a
+            hre="https://www.instagram.com/"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <img src="/src/assets/svg/instagram-icon.svg" alt="instagramLogo" />
+          </a>
+        </div>
+      </div>
+    </footer>
+  </body>
+</html>
diff --git a/pages/faq.html b/pages/faq.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="ko">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>FQA</title>
+    <!-- <link rel="stylesheet" href="/styles/sign.css" /> -->
+  </head>
+  <body>
+    FQA 페이지에용
+  </body>
+</html>
diff --git a/pages/items.html b/pages/items.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="ko">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>items</title>
+    <!-- <link rel="stylesheet" href="/styles/sign.css" /> -->
+  </head>
+  <body>
+    아이템 페이지에용
+  </body>
+</html>
diff --git a/pages/privacy.html b/pages/privacy.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="ko">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Privacy</title>
+    <!-- <link rel="stylesheet" href="/styles/sign.css" /> -->
+  </head>
+  <body>
+    프라이버시 페이지에용
+  </body>
+</html>
diff --git a/pages/signin.html b/pages/signin.html
@@ -0,0 +1,12 @@
+<!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="/styles/sign.css" /> -->
+  </head>
+  <body>
+    로그인 페이지에용
+  </body>
+</html>
diff --git a/src/assets/image/Header-Content-Image.png b/src/assets/image/Header-Content-Image.png
diff --git a/src/assets/image/home_01-image.png b/src/assets/image/home_01-image.png
diff --git a/src/assets/image/home_02-image.png b/src/assets/image/home_02-image.png
diff --git a/src/assets/image/home_03-image.png b/src/assets/image/home_03-image.png
diff --git a/src/assets/image/home_bottom-iamge.png b/src/assets/image/home_bottom-iamge.png
diff --git a/src/assets/svg/Logo-Large.svg b/src/assets/svg/Logo-Large.svg
diff --git a/src/assets/svg/Logo-Small.svg b/src/assets/svg/Logo-Small.svg
diff --git a/src/assets/svg/X-icon.svg b/src/assets/svg/X-icon.svg
diff --git a/src/assets/svg/default-profile-icon.svg b/src/assets/svg/default-profile-icon.svg
diff --git a/src/assets/svg/facebook-icon.svg b/src/assets/svg/facebook-icon.svg