diff --git a/uniro_frontend/package-lock.json b/uniro_frontend/package-lock.json index d657c01..9fb6f47 100644 --- a/uniro_frontend/package-lock.json +++ b/uniro_frontend/package-lock.json @@ -2577,6 +2577,8 @@ "typescript": { "optional": true } + } + }, "node_modules/cookie": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz", diff --git a/uniro_frontend/public/background.png b/uniro_frontend/public/background.png new file mode 100644 index 0000000..7ad53c6 Binary files /dev/null and b/uniro_frontend/public/background.png differ diff --git a/uniro_frontend/src/App.css b/uniro_frontend/src/App.css index df674c0..8b92011 100644 --- a/uniro_frontend/src/App.css +++ b/uniro_frontend/src/App.css @@ -1,42 +1,5 @@ #root { max-width: 1280px; margin: 0 auto; - padding: 2rem; text-align: center; } - -.logo { - height: 6em; - padding: 1.5em; - will-change: filter; - transition: filter 300ms; -} -.logo:hover { - filter: drop-shadow(0 0 2em #646cffaa); -} -.logo.react:hover { - filter: drop-shadow(0 0 2em #61dafbaa); -} - -@keyframes logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} - -@media (prefers-reduced-motion: no-preference) { - a:nth-of-type(2) .logo { - animation: logo-spin infinite 20s linear; - } -} - -.card { - padding: 2em; -} - -.read-the-docs { - color: #888; -} diff --git a/uniro_frontend/src/App.tsx b/uniro_frontend/src/App.tsx index 4077067..26e9e4d 100644 --- a/uniro_frontend/src/App.tsx +++ b/uniro_frontend/src/App.tsx @@ -1,60 +1,16 @@ +import { Route, Routes } from "react-router"; import "./App.css"; -import Button from "./components/customButton"; -import Input from "./components/customInput"; -import LandingButton from "./components/landingButton"; -import useModal from "./hooks/useModal"; -import Map from "./component/Map"; +import Demo from "./pages/demo"; +import LandingPage from "./pages/landing"; +import UniversitySearchPage from "./pages/search"; function App() { - const [FailModal, isFailOpen, openFail, closeFail] = useModal(); - const [SuccessModal, isSuccessOpen, openSuccess, closeSuccess] = useModal(); - return ( - <> -
-
- - - - - -
- -
- { }} - onLengthChange={(e: string) => { - console.log(e); - }} - /> -
- -

불편한 길 제보가 완료되었습니다!

-
-

제보해주셔서 감사합니다.

-

- 관리자 검토 후 반영되니 조금만 기다려주세요. -

-
-
- -

경로를 찾을 수 없습니다

-
-

- 해당 경로에는 배리어프리한 길이 없습니다. -

-

다른 건물을 시도해주세요.

-
-
-
-
- -
-

Click on the Vite and React logos to learn more

- + + } /> + } /> + } /> + ); } diff --git a/uniro_frontend/src/assets/UNIRO.svg b/uniro_frontend/src/assets/UNIRO.svg new file mode 100644 index 0000000..fd59b65 --- /dev/null +++ b/uniro_frontend/src/assets/UNIRO.svg @@ -0,0 +1,3 @@ + + + diff --git a/uniro_frontend/src/assets/logo.svg b/uniro_frontend/src/assets/logo.svg new file mode 100644 index 0000000..8be492d --- /dev/null +++ b/uniro_frontend/src/assets/logo.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git "a/uniro_frontend/src/assets/\352\263\240\353\240\244\353\214\200\355\225\231\352\265\220.svg" "b/uniro_frontend/src/assets/\352\263\240\353\240\244\353\214\200\355\225\231\352\265\220.svg" new file mode 100644 index 0000000..53f1214 --- /dev/null +++ "b/uniro_frontend/src/assets/\352\263\240\353\240\244\353\214\200\355\225\231\352\265\220.svg" @@ -0,0 +1,9 @@ + + + + + + + + + diff --git "a/uniro_frontend/src/assets/\354\204\234\354\232\270\354\213\234\353\246\275\353\214\200\355\225\231\352\265\220.svg" "b/uniro_frontend/src/assets/\354\204\234\354\232\270\354\213\234\353\246\275\353\214\200\355\225\231\352\265\220.svg" new file mode 100644 index 0000000..849861e --- /dev/null +++ "b/uniro_frontend/src/assets/\354\204\234\354\232\270\354\213\234\353\246\275\353\214\200\355\225\231\352\265\220.svg" @@ -0,0 +1,9 @@ + + + + + + + + + diff --git "a/uniro_frontend/src/assets/\354\235\264\355\231\224\354\227\254\354\236\220\353\214\200\355\225\231\352\265\220.svg" "b/uniro_frontend/src/assets/\354\235\264\355\231\224\354\227\254\354\236\220\353\214\200\355\225\231\352\265\220.svg" new file mode 100644 index 0000000..1362898 --- /dev/null +++ "b/uniro_frontend/src/assets/\354\235\264\355\231\224\354\227\254\354\236\220\353\214\200\355\225\231\352\265\220.svg" @@ -0,0 +1,9 @@ + + + + + + + + + diff --git "a/uniro_frontend/src/assets/\354\235\270\355\225\230\353\214\200\355\225\231\352\265\220.svg" "b/uniro_frontend/src/assets/\354\235\270\355\225\230\353\214\200\355\225\231\352\265\220.svg" new file mode 100644 index 0000000..78c5ff7 --- /dev/null +++ "b/uniro_frontend/src/assets/\354\235\270\355\225\230\353\214\200\355\225\231\352\265\220.svg" @@ -0,0 +1,9 @@ + + + + + + + + + diff --git "a/uniro_frontend/src/assets/\355\225\234\354\226\221\353\214\200\355\225\231\352\265\220.svg" "b/uniro_frontend/src/assets/\355\225\234\354\226\221\353\214\200\355\225\231\352\265\220.svg" new file mode 100644 index 0000000..bf43a71 --- /dev/null +++ "b/uniro_frontend/src/assets/\355\225\234\354\226\221\353\214\200\355\225\231\352\265\220.svg" @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/uniro_frontend/src/components/customButton.tsx b/uniro_frontend/src/components/customButton.tsx index 3f00198..ab2b2c7 100644 --- a/uniro_frontend/src/components/customButton.tsx +++ b/uniro_frontend/src/components/customButton.tsx @@ -26,7 +26,7 @@ export default function Button({ children, variant = "primary", ...rest }: Custo return ( + + ); +} diff --git a/uniro_frontend/src/constant/university.ts b/uniro_frontend/src/constant/university.ts index c14ee3c..96b5792 100644 --- a/uniro_frontend/src/constant/university.ts +++ b/uniro_frontend/src/constant/university.ts @@ -7,3 +7,26 @@ export const HanyangUniversity: Coordinate = { lat: 37.558056, lng: 127.045833, }; + +export const UniversityList: { name: string; img: string }[] = [ + { + name: "고려대학교", + img: "고려대학교.svg", + }, + { + name: "서울시립대학교", + img: "서울시립대학교.svg", + }, + { + name: "이화여자대학교", + img: "이화여자대학교.svg", + }, + { + name: "인하대학교", + img: "인하대학교.svg", + }, + { + name: "한양대학교", + img: "한양대학교.svg", + }, +]; diff --git a/uniro_frontend/src/index.css b/uniro_frontend/src/index.css index 742a9a4..0dadffa 100644 --- a/uniro_frontend/src/index.css +++ b/uniro_frontend/src/index.css @@ -42,6 +42,15 @@ * { font-family: "SF Pro Display", "AppleSDGothicNeo"; outline: none; + --webkit-scrollbar-width: none; +} + +*::-webkit-scrollbar { + display: none; +} + +* { + scrollbar-width: none; } @theme { diff --git a/uniro_frontend/src/main.tsx b/uniro_frontend/src/main.tsx index 9cd1cc6..8e96476 100644 --- a/uniro_frontend/src/main.tsx +++ b/uniro_frontend/src/main.tsx @@ -2,9 +2,12 @@ import { StrictMode } from "react"; import { createRoot } from "react-dom/client"; import "./index.css"; import App from "./App.tsx"; +import { BrowserRouter } from "react-router"; createRoot(document.getElementById("root")!).render( - + + + , ); diff --git a/uniro_frontend/src/pages/demo.tsx b/uniro_frontend/src/pages/demo.tsx new file mode 100644 index 0000000..4d64dea --- /dev/null +++ b/uniro_frontend/src/pages/demo.tsx @@ -0,0 +1,58 @@ +import useModal from "../hooks/useModal"; +import Button from "../components/customButton"; +import LandingButton from "../components/landingButton"; +import Input from "../components/customInput"; +import Map from "../component/Map"; + +export default function Demo() { + const [FailModal, isFailOpen, openFail, closeFail] = useModal(); + const [SuccessModal, isSuccessOpen, openSuccess, closeSuccess] = useModal(); + + return ( + <> +
+
+ + + + + +
+ +
+ {}} + onLengthChange={(e: string) => { + console.log(e); + }} + /> +
+ +

불편한 길 제보가 완료되었습니다!

+
+

제보해주셔서 감사합니다.

+

+ 관리자 검토 후 반영되니 조금만 기다려주세요. +

+
+
+ +

경로를 찾을 수 없습니다

+
+

+ 해당 경로에는 배리어프리한 길이 없습니다. +

+

다른 건물을 시도해주세요.

+
+
+
+
+ +
+

Click on the Vite and React logos to learn more

+ + ); +} diff --git a/uniro_frontend/src/pages/landing.tsx b/uniro_frontend/src/pages/landing.tsx new file mode 100644 index 0000000..ce05879 --- /dev/null +++ b/uniro_frontend/src/pages/landing.tsx @@ -0,0 +1,24 @@ +import LandingButton from "../components/landingButton"; +import Logo from "../assets/logo.svg?react"; +import UNIRO from "../assets/UNIRO.svg?react"; +import { Link } from "react-router"; + +export default function LandingPage() { + return ( +
+
+

어디든 갈 수 있는 캠퍼스.

+

쉽고 빠르게 이동하세요.

+
+
+
+ + +
+ + + +
+
+ ); +} diff --git a/uniro_frontend/src/pages/search.tsx b/uniro_frontend/src/pages/search.tsx new file mode 100644 index 0000000..89c3824 --- /dev/null +++ b/uniro_frontend/src/pages/search.tsx @@ -0,0 +1,44 @@ +import { useState } from "react"; +import Input from "../components/customInput"; +import UniversityButton from "../components/universityButton"; +import { UniversityList } from "../constant/university"; +import Button from "../components/customButton"; +import { Link } from "react-router"; + +export default function UniversitySearchPage() { + const [selectedUniv, setSelectedUniv] = useState(""); + + return ( +
+
+ { }} placeholder="우리 학교를 검색해보세요" handleVoiceInput={() => { }} /> +
+
+
    { + setSelectedUniv(""); + }} + > + {UniversityList.map(({ name, img }) => ( + { + setSelectedUniv(name); + }} + name={name} + img={img} + /> + ))} +
+
+
+ {selectedUniv !== "" && ( + + + + )} +
+
+ ); +}