Skip to content

Commit 5056ce5

Browse files
SungbinYangSungbinYang
authored
Merge pull request #18 from SungbinYang/release/0.1.1
release: v0.1.1 버전 업데이트
2 parents 115c6f4 + 4b00f07 commit 5056ce5

15 files changed

Lines changed: 395 additions & 49 deletions

File tree

‎package.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "grit-platform-client",
33
"private": true,
4-
"version": "0.1.0",
4+
"version": "0.1.1",
55
"type": "module",
66
"scripts": {
77
"dev": "vite",
@@ -14,7 +14,8 @@
1414
},
1515
"dependencies": {
1616
"react": "^19.2.0",
17-
"react-dom": "^19.2.0"
17+
"react-dom": "^19.2.0",
18+
"react-router-dom": "^7.11.0"
1819
},
1920
"devDependencies": {
2021
"@eslint/js": "^9.39.1",

‎pnpm-lock.yaml‎

Lines changed: 45 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/App.css‎

Lines changed: 0 additions & 42 deletions
This file was deleted.

‎src/App.tsx‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
1+
import { RouterProvider } from 'react-router-dom';
2+
import router from './router';
13
import type { FC } from 'react';
24

35
const App: FC = () => {
4-
return (
5-
<div className="flex w-1/2 justify-center rounded-lg border-2 border-red-500">
6-
Hello World!
7-
</div>
8-
);
6+
return <RouterProvider router={router} />;
97
};
108

119
export default App;

‎src/components/Button.tsx‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import type { ButtonHTMLAttributes } from 'react';
2+
3+
type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost';
4+
type ButtonSize = 'sm' | 'md' | 'lg';
5+
6+
interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
7+
variant?: ButtonVariant;
8+
size?: ButtonSize;
9+
fullWidth?: boolean;
10+
}
11+
12+
const variantStyles: Record<ButtonVariant, string> = {
13+
primary: 'bg-blue-600 text-white hover:bg-blue-700 disabled:bg-blue-300',
14+
secondary: 'bg-gray-600 text-white hover:bg-gray-700 disabled:bg-gray-300',
15+
outline:
16+
'border border-gray-300 text-gray-700 hover:bg-gray-50 disabled:bg-gray-100',
17+
ghost: 'text-gray-700 hover:bg-gray-100 disabled:text-gray-300',
18+
};
19+
20+
const sizeStyles: Record<ButtonSize, string> = {
21+
sm: 'px-3 py-1.5 text-sm',
22+
md: 'px-4 py-2 text-base',
23+
lg: 'px-6 py-3 text-lg',
24+
};
25+
26+
const Button = ({
27+
variant = 'primary',
28+
size = 'md',
29+
fullWidth = false,
30+
className = '',
31+
children,
32+
...props
33+
}: ButtonProps) => {
34+
return (
35+
<button
36+
className={`
37+
rounded-lg font-medium transition-colors
38+
disabled:cursor-not-allowed
39+
${variantStyles[variant]}
40+
${sizeStyles[size]}
41+
${fullWidth ? 'w-full' : ''}
42+
${className}
43+
`}
44+
{...props}
45+
>
46+
{children}
47+
</button>
48+
);
49+
};
50+
51+
export default Button;

‎src/components/Footer.tsx‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import { Link } from 'react-router-dom';
2+
import type { FC } from 'react';
3+
4+
const Footer: FC = () => {
5+
const currentYear = new Date().getFullYear();
6+
7+
return (
8+
<footer className="border-t border-gray-200 bg-gray-50">
9+
<div className="mx-auto max-w-7xl px-4 py-8">
10+
<div className="flex flex-col items-center justify-between md:flex-row">
11+
<p className="text-sm text-gray-500">
12+
© {currentYear} Grit Platform. All rights reserved.
13+
</p>
14+
15+
<div className="mt-4 flex space-x-6 md:mt-0">
16+
<Link
17+
to="/terms"
18+
className="text-sm text-gray-500 hover:text-gray-900"
19+
>
20+
이용약관
21+
</Link>
22+
<Link
23+
to="/privacy"
24+
className="text-sm text-gray-500 hover:text-gray-900"
25+
>
26+
개인정보처리방침
27+
</Link>
28+
<Link
29+
to="/contact"
30+
className="text-sm text-gray-500 hover:text-gray-900"
31+
>
32+
문의하기
33+
</Link>
34+
</div>
35+
</div>
36+
</div>
37+
</footer>
38+
);
39+
};
40+
41+
export default Footer;

‎src/components/Header.tsx‎

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
import { type FC, useState } from 'react';
2+
import { Link } from 'react-router-dom';
3+
4+
const Header: FC = () => {
5+
const [isMenuOpen, setIsMenuOpen] = useState(false);
6+
7+
const toggleMenu = () => setIsMenuOpen(!isMenuOpen);
8+
9+
return (
10+
<header className="border-b border-gray-200 bg-white">
11+
<div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-4">
12+
<Link to="/" className="text-xl font-bold text-gray-900">
13+
Grit Platform
14+
</Link>
15+
16+
<nav className="hidden space-x-8 md:flex">
17+
<Link to="/" className="text-gray-600 hover:text-gray-900">
18+
홈
19+
</Link>
20+
<Link to="/mentors" className="text-gray-600 hover:text-gray-900">
21+
멘토 찾기
22+
</Link>
23+
<Link to="/about" className="text-gray-600 hover:text-gray-900">
24+
소개
25+
</Link>
26+
</nav>
27+
28+
<div className="hidden items-center space-x-4 md:flex">
29+
<Link to="/login" className="text-gray-600 hover:text-gray-900">
30+
로그인
31+
</Link>
32+
<Link
33+
to="/signup"
34+
className="rounded-lg bg-blue-600 px-4 py-2 text-white hover:bg-blue-700"
35+
>
36+
회원가입
37+
</Link>
38+
</div>
39+
40+
<button
41+
onClick={toggleMenu}
42+
className="flex h-10 w-10 items-center justify-center rounded-lg hover:bg-gray-100 md:hidden"
43+
aria-label={isMenuOpen ? '메뉴 닫기' : '메뉴 열기'}
44+
>
45+
{isMenuOpen ? (
46+
<svg
47+
className="h-6 w-6"
48+
fill="none"
49+
stroke="currentColor"
50+
viewBox="0 0 24 24"
51+
>
52+
<path
53+
strokeLinecap="round"
54+
strokeLinejoin="round"
55+
strokeWidth={2}
56+
d="M6 18L18 6M6 6l12 12"
57+
/>
58+
</svg>
59+
) : (
60+
<svg
61+
className="h-6 w-6"
62+
fill="none"
63+
stroke="currentColor"
64+
viewBox="0 0 24 24"
65+
>
66+
<path
67+
strokeLinecap="round"
68+
strokeLinejoin="round"
69+
strokeWidth={2}
70+
d="M4 6h16M4 12h16M4 18h16"
71+
/>
72+
</svg>
73+
)}
74+
</button>
75+
</div>
76+
77+
{/* 모바일 메뉴 */}
78+
{isMenuOpen && (
79+
<nav className="border-t border-gray-200 bg-white px-4 py-4 md:hidden">
80+
<div className="flex flex-col space-y-4 text-center">
81+
<Link
82+
to="/"
83+
className="text-gray-600 hover:text-gray-900"
84+
onClick={() => setIsMenuOpen(false)}
85+
>
86+
홈
87+
</Link>
88+
<Link
89+
to="/mentors"
90+
className="text-gray-600 hover:text-gray-900"
91+
onClick={() => setIsMenuOpen(false)}
92+
>
93+
멘토 찾기
94+
</Link>
95+
<Link
96+
to="/about"
97+
className="text-gray-600 hover:text-gray-900"
98+
onClick={() => setIsMenuOpen(false)}
99+
>
100+
소개
101+
</Link>
102+
<hr className="border-gray-200" />
103+
<Link
104+
to="/login"
105+
className="text-gray-600 hover:text-gray-900"
106+
onClick={() => setIsMenuOpen(false)}
107+
>
108+
로그인
109+
</Link>
110+
<Link
111+
to="/signup"
112+
className="rounded-lg bg-blue-600 px-4 py-2 text-white hover:bg-blue-700"
113+
onClick={() => setIsMenuOpen(false)}
114+
>
115+
회원가입
116+
</Link>
117+
</div>
118+
</nav>
119+
)}
120+
</header>
121+
);
122+
};
123+
124+
export default Header;

0 commit comments

Comments
 (0)