-
-
-
-
+
+ {isAuth ? (
+
+ ) : (
+
+ )}
+
+
+
+
+ {isAuth ? (
+
+
+
+ ) : (
+ ''
+ )}
diff --git a/src/main.tsx b/src/main.tsx
index e2db0b4..3de930b 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -4,9 +4,11 @@ import { HelmetProvider } from 'react-helmet-async';
import '@/lib/locales';
import { createRoot } from 'react-dom/client';
import { Routes } from '@generouted/react-router';
-
+import NProgress from 'nprogress';
+import 'nprogress/nprogress.css';
+import '@/style/nprogress.css';
createRoot(document.getElementById('root')!).render(
- ,
+
);
diff --git a/src/pages/(auth)/mypage/index.tsx b/src/pages/(auth)/mypage/index.tsx
new file mode 100644
index 0000000..4f555ee
--- /dev/null
+++ b/src/pages/(auth)/mypage/index.tsx
@@ -0,0 +1,7 @@
+export default function Index() {
+ return (
+
+ My Page
+
+ );
+}
diff --git a/src/router.ts b/src/router.ts
index d677c09..bc0b9dc 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -1,7 +1,7 @@
// Generouted, changes to this file will be overriden
/* eslint-disable */
-import { components, hooks, utils } from "@generouted/react-router/client";
+import { components, hooks, utils } from '@generouted/react-router/client';
export type Path =
| `/`
@@ -76,7 +76,8 @@ export type Path =
| `/example/typography/muted`
| `/example/typography/p`
| `/example/typography/small`
- | `/example/typography/table`;
+ | `/example/typography/table`
+ | `/mypage`;
export type Params = {};
diff --git a/src/style/nprogress.css b/src/style/nprogress.css
new file mode 100644
index 0000000..ad0c635
--- /dev/null
+++ b/src/style/nprogress.css
@@ -0,0 +1,34 @@
+/* nprogress-custom.css */
+
+/* 프로그레스 바의 애니메이션 설정 */
+#nprogress .bar {
+ position: fixed;
+ background-color: #ffc107; /* 프로그레스 바의 색상 설정 */
+ z-index: 9999; /* 다른 요소 위에 표시되도록 설정 */
+ transition: width 0.3s ease; /* 프로그레스 바의 애니메이션 설정 */
+}
+
+/* 로딩 모양 애니메이션 */
+#nprogress .spinner {
+ border: 2px solid #29d; /* 원의 테두리 설정 */
+ border-top: 2px solid #fff; /* 원의 윗부분 테두리 설정 */
+ border-radius: 50%; /* 원의 모양을 동그랗게 만듦 */
+ width: 20px; /* 로딩 모양의 너비 설정 */
+ height: 20px; /* 로딩 모양의 높이 설정 */
+ animation: spin 0.8s linear infinite; /* 회전 애니메이션 설정 */
+ position: fixed; /* 로딩 모양의 위치를 고정시킴 */
+ top: 50%; /* 로딩 모양의 상단 위치를 화면 중앙으로 조정 */
+ left: 50%; /* 로딩 모양의 좌측 위치를 화면 중앙으로 조정 */
+ transform: translate(-50%, -50%); /* 화면 중앙 정렬 */
+ z-index: 10000; /* 다른 요소 위에 표시되도록 설정 */
+}
+
+/* 회전 애니메이션 설정 */
+@keyframes spin {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}