feat: 기능 구현

codeit-bootcamp-frontend · Feb 27, 2024 · b999b54 · b999b54
1 parent 4dc5dd0
commit b999b54
Show file tree

Hide file tree

Showing 24 changed files with 942 additions and 0 deletions.
diff --git a/img/Linkbrary-logo.svg b/img/Linkbrary-logo.svg
diff --git a/img/XLOGO.svg b/img/XLOGO.svg
diff --git a/img/codeit_search.png b/img/codeit_search.png
diff --git a/img/dogimg.png b/img/dogimg.png
diff --git a/img/eye-on.svg b/img/eye-on.svg
diff --git a/img/eyex.svg b/img/eyex.svg
diff --git a/img/facebooklogo.svg b/img/facebooklogo.svg
diff --git a/img/folder_box.png b/img/folder_box.png
diff --git a/img/folder_ch.png b/img/folder_ch.png
diff --git a/img/google-icon.svg b/img/google-icon.svg
diff --git a/img/google.svg b/img/google.svg
diff --git a/img/instagramlogo.svg b/img/instagramlogo.svg
diff --git a/img/kakao-icon.svg b/img/kakao-icon.svg
diff --git a/img/kakao.svg b/img/kakao.svg
diff --git a/img/mainimg.png b/img/mainimg.png
diff --git a/img/share_mainimg.png b/img/share_mainimg.png
diff --git a/img/youtubelogo.svg b/img/youtubelogo.svg
diff --git a/landing.html b/landing.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Linkbrary</title>
+    <link rel="stylesheet" href="./style/landing.css"/>
+  </head>
+  <body>
+    <header class="nav">
+      <a href="landing.html">
+        <img src="img/Linkbrary-logo.svg" alt="logo">
+      </a>
+      <a class="login-button" href="/signin.html">로그인</a>
+    </header>
+
+    <main>
+
+      <article class="main1">
+        <h1 class="wrinfor">
+          <span>세상의 모든 정보</span>를<br>쉽게 저장하고 관리해 보세요
+        </h1>
+        <div class="link_add_box">
+        <a href="/signup.html" class="link_add">링크 추가하기</a>
+        </div>
+       <img src="img/mainimg.png">
+      </article>
+
+      <section class="section main2">
+        <div class="wrinfor">
+        <h1>
+         <span>원하는 링크</span>를 <br>
+         저장하세요 
+        </h1>
+        <p>
+          나중에 읽고 싶은 글, 다시 보고 싶은 영상,<br>
+          사고 싶은 옷, 기억하고 싶은 모든 것을<br>
+          한 공간에 저장하세요 
+        </p>
+        </div>
+        <div class="dogimg">
+          <img src="img/dogimg.png">
+        </div>
+        </section>
+
+        <section class="section folder">
+          <div class="folder_box">
+            <img src="img/folder_ch.png" class="folder_ch1">
+          </div>
+          <div class="wrinfor">
+            <h1>링크를 폴더로 <br>
+            <span>관리</span>하세요</h1>
+            <p>
+              나만의 폴더를 무제한으로 만들고<br>
+              다양하게 활용할 수 있습니다.
+            </p>
+          </div>
+        </section>
+
+        <section class="section sharech">
+          <div class="wrinfor">
+            <h1>저장한 링크를<br>
+              <span>공유</span>해 보세요
+            </h1>
+            <p>
+              여러 링크를 폴더에 담고 공유할 수 있습니다<br>
+              가족, 친구, 동료들에게 쉽고 빠르게 링크를<br>
+              공유해 보세요
+            </p>
+          </div>
+          <div class="img_box">
+            <img class="folder_share" src="img/folder_box.png">
+          </div>
+        </section>
+
+
+        <section class="section search">
+          <img class="img_box" src="img/codeit_search.png">
+          <div class="wrinfor">
+            <h1>
+              저장한 링크를<br>
+              <span>검색</span>해 보세요
+            </h1>
+            <p>중요한 정보들을 검색으로 쉽게 찾아보세요.</p>
+          </div>
+        </section>
+    </main>
+
+
+    <footer class="footer">
+      <p class="com">@codeit - 2023</p>
+      <div class="Policy FAQ">
+        <a href="privacy.html"><p>Privacy Policy</p></a>
+        <a href="faq.html"><p>FAQ</p></a>
+      </div>
+
+      <div class="sns">
+          <a href="https://www.facebook.com/?locale=ko_KR" target="_black"><img src="img/facebooklogo.svg"></a>
+          <a href="https://twitter.com/X" target="_blank"><img src="img/XLOGO.svg"></a>
+          <a href="https://www.youtube.com/" target="_blank"><img src="img/instagramlogo.svg"></a>
+          <a href="https://www.instagram.com/" target="_blank"><img src="img/youtubelogo.svg"></a>
+        </div>
+
+    </footer>
+
+
+  </body>
+</html>
diff --git a/signin.html b/signin.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="style/signin.css">
+  <title>Linkbrary</title>
+</head>
+<body>
+  <main>
+    <div class="header">
+      <a href="index.html"><img src="img/Linkbrary-logo.svg" class="logo"></a>
+    <div class="move-link">
+      <p>회원이 아니신가요?</p>
+      <a class="signup-link" href="signup.html">회원 가입하기</a>
+    </div>
+  </div>
+
+  <div class="input-area">
+      <div class="email input">
+        <label for="email">이메일</label>
+        <input id="email" type="type" placeholder="codeit@codeit.com">
+      </div>
+  <div class="password input">
+      <label for="password">비밀번호</label>
+      <div class="password">
+          <input id="password" type="password" placeholder="">
+          <img class="eye-off" src="img/eyex.svg">
+      </div>
+    </div>
+  </div>
+
+
+  <a href="index.html" class="login-button">로그인</a>
+  <div class="social-login">
+    <p>소셜 로그인</p>
+    <div class="icon">
+      <a class="google" href="https://www.google.com/"><img src="img/google.svg" class="google-mark"></a>
+      <a class="kakao" href="https://www.kakaocorp.com/page/"><img src="img/kakao.svg" class="kakao-mark"></a>
+        </div>
+      </div>
+    </main>
+  </body>
+</html>