Commit a10d6e71 authored by Lee Soobeom's avatar Lee Soobeom
Browse files

파일 병합1

parent 40411703
import React from "react";
import { BrowserRouter, Route, Routes, Link, Outlet} from "react-router-dom";
import "tailwindcss/tailwind.css";
import Header from "./pages/header";
import Body from "./pages/body";
import Board from "./pages/board";
import Login from "./pages/login";
import Citylist from "./pages/citylist";
import Theme from "./pages/theme";
import Header from "./Pages/header";
import Body from "./Pages/body";
import Board from "./Pages/board";
import Login from "./Pages/login";
import Citylist from "./Pages/citylist";
import Theme from "./Pages/theme";
import Signup from "./Pages/signup";
export const App = () => {
return (
<BrowserRouter>
<Routes>
<Route path="/login" element={<Login />} />
<Route path="/signup" element={<signup />} />
<Route path="/signup" element={<Signup />} />
<Route path="/" element={<Header />}>
<Route index element={<Body />} />
<Route path="/board" element={<Board />} />
......
import React from "react";
function range(start:number, end:number) {
return (new Array(end - start + 1)).fill(undefined).map((_, i) => i + start);
}
export default function BoardPage() {
const imgs = range(0,7); //[1,2,3,4,5,6,7]
return (
<div className="flex flex-col items-center">
<div className="flex flex-col items-center mt-6">
<div>
`Travel Report's Board`
</div>
<div>
`여행지 후기를 남겨주세요!`
</div>
</div>
<div className="flex flex-col w-10/12 mt-16 ">
<div>
<div className="bg-gray-500 border-y-2 h-10">
Board
</div>
<div>
{imgs.map(img => (
<div className="flex flex-row h-16 divide-x-2 border-2 border-solid ">
<div className="basis-1/12 bg-gray-100">{img}</div>
<div className="basis-full">title</div>
<div className="basis-3/12">date</div>
<div className="basis-2/12">like</div>
</div>
))}
</div>
</div>
</div>
</div>
);
}
\ No newline at end of file
import React from "react";
import { Link, Outlet } from "react-router-dom";
export default function BodyPage() {
return (
<div className="flex flex-col">
<div className="flex px-5 py-5">
<div className="flex w-full bg-emerald-400 rounded">Theme</div>
</div>
<div className="flex flex-col h-96 px-5 py-5 md:flex-row">
<div className="flex px-5 py-5">
<div className="w-full h-20 md:h-full bg-gray-400 rounded">Citylist</div>
</div>
<div className="flex px-5 py-5 md:w-full">
<div className="w-full h-96 bg-red-400 rounded">Pic</div>
</div>
</div>
</div>
);
}
\ No newline at end of file
import React from "react";
import { Link, Outlet } from "react-router-dom";
export default function HomePage() {
return (
<div className="flex flex-col">
<div className="flex flex-row h-12 place-content-between md:place-content-between xl:place-content-between ">
<Link to="/"><div className="w-24 h-11 bg-blue-400 rounded">Travel Report</div></Link>
<div className="flex flex-row-reverse">
<Link to="/login"><div className="w-12 h-11 text-xs bg-yellow-400 rounded">Login</div></Link>
<Link to="/board"><div className="w-12 h-11 text-xs bg-green-300 rounded">Board</div></Link>
<div>
<label>
{/* <span className="sr-only">Search</span> */}
<input className="placeholder:italic placeholder:text-slate-400 block bg-white w-full border border-slate-300 rounded-md py-2 pl-9 pr-3 shadow-sm focus:outline-none focus:border-sky-500 focus:ring-sky-500 focus:ring-1 sm:text-sm" placeholder="Search for anything..." type="text" name="search" />
</label>
</div>
</div>
</div>
<hr />
<Outlet />
</div>
);
}
\ No newline at end of file
import React from "react";
export default function Login() {
return (
<div>login page</div> // Login Page
);
}
\ No newline at end of file
import React from "react";
export default function Board() {
function range(start:number, end:number) {
return (new Array(end - start + 1)).fill(undefined).map((_, i) => i + start);
}
export default function BoardPage() {
const imgs = range(0,7); //[1,2,3,4,5,6,7]
return (
<div>Board</div> // Board Page
<div className="flex flex-col items-center">
<div className="flex flex-col items-center mt-6">
<div>
`Travel Report's Board`
</div>
<div>
`여행지 후기를 남겨주세요!`
</div>
</div>
<div className="flex flex-col w-10/12 mt-16 ">
<div>
<div className="bg-gray-500 border-y-2 h-10">
Board
</div>
<div>
{imgs.map(img => (
<div className="flex flex-row h-16 divide-x-2 border-2 border-solid ">
<div className="basis-1/12 bg-gray-100">{img}</div>
<div className="basis-full">title</div>
<div className="basis-3/12">date</div>
<div className="basis-2/12">like</div>
</div>
))}
</div>
</div>
</div>
</div>
);
};
\ No newline at end of file
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment