design: 로그인 및 랜딩 페이지 퍼블리싱 (#22)

* design: 전체 배경 그라데이션 삽입

* design: 로그인 페이지 에셋 추가

* design: 로그인 페이지 퍼블리싱

* design: 로그인 페이지 에셋 변경 및 반영

* design: 랜딩페이지 퍼블리싱

* remove: 불필요한 에셋 제거

* remove: 중복 에셋 제거

* refactor: 로그인 아이콘에 aria-label 추가

* style: 랜딩페이지 원 크기 수정

Author: AAminha

package.json

@@ -4,22 +4,21 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "vite --host",
+    "dev": "vite --host 0.0.0.0",
     "build": "tsc -b && vite build",
     "lint": "eslint .",
     "preview": "vite preview"
   },
   "dependencies": {
+    "@egjs/react-infinitegrid": "^4.12.0",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@egjs/react-infinitegrid": "^4.12.0",
     "@mui/icons-material": "^6.4.4",
     "@mui/material": "^6.4.4",
     "@tailwindcss/vite": "^4.0.6",
     "@tanstack/react-query": "^5.66.0",
     "axios": "^1.7.9",
     "gsap": "^3.12.7",
-    "pnpm": "^10.4.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router": "^7.1.5",

pnpm-lock.yaml

@@ -3,6 +3,7 @@ import { Route, Routes } from 'react-router';
 import useViewport from './hooks/useViewport';
 import Layout from './layouts/Layout';
 import Home from './pages/Home';
+import Landing from './pages/Landing';
 import LetterBoardPage from './pages/LetterBoard';
 import LetterBoardDetailPage from './pages/LetterBoardDetail';
 import LetterBoxPage from './pages/LetterBox';
@@ -24,6 +25,7 @@ const App = () => {
       <Route>
         <Route index element={<Home />} />
         <Route path="login" element={<LoginPage />} />
+        <Route path="landing" element={<Landing />} />
         <Route path="onboarding" element={<OnboardingPage />} />
         <Route path="letter">
           <Route element={<Layout />}>

src/App.tsx

@@ -2,22 +2,29 @@ import AlarmIcon from './alarm.svg?react';
 import ArrowLeftIcon from './arrow-left.svg?react';
 import BoardIcon from './board.svg?react';
 import CloudIcon from './cloud.svg?react';
-import ColorSirenIcon from './color-siren.svg?react';
 import DeleteIcon from './delete.svg?react';
 import EnvelopeIcon from './envelope.svg?react';
-import InformationIcon from './infromation.svg?react';
+import GoogleIcon from './google.svg?react';
+import InformationIcon from './information.svg?react';
+import KakaoIcon from './kakao.svg?react';
 import LikeFilledIcon from './like-filled.svg?react';
 import LikeOutlinedIcon from './like-outlined.svg?react';
+import NaverIcon from './naver.svg?react';
 import NoticeIcon from './notice.svg?react';
 import PersonIcon from './person.svg?react';
 import RestartIcon from './restart.svg';
 import SirenFilledIcon from './siren-filled.svg?react';
 import SirenOutlinedIcon from './siren-outlined.svg?react';
 import SnowIcon from './snow.svg?react';
+import StampIcon from './stamp.svg?react';
 import ThermostatIcon from './thermostat.svg?react';
 import WarmIcon from './warm.svg?react';
 
 export {
+  NaverIcon,
+  KakaoIcon,
+  GoogleIcon,
+  StampIcon,
   AlarmIcon,
   PersonIcon,
   ArrowLeftIcon,
@@ -29,7 +36,6 @@ export {
   SnowIcon,
   ThermostatIcon,
   WarmIcon,
-  ColorSirenIcon,
   SirenFilledIcon,
   SirenOutlinedIcon,
   NoticeIcon,