From 6cd67638accd4fa5b627aaccbf4381fc1733add4 Mon Sep 17 00:00:00 2001
From: Hyein Jeong <jhi2359@naver.com>
Date: Wed, 27 Nov 2024 00:27:53 +0900
Subject: [PATCH 1/2] =?UTF-8?q?[FE][Feat]=20#286=20:=20=EB=8D=B0=EC=8A=A4?=
 =?UTF-8?q?=ED=81=AC=ED=83=91=20=EC=A0=91=EC=86=8D=EC=8B=9C=20=EB=AA=A8?=
 =?UTF-8?q?=EB=B0=94=EC=9D=BC=20=EC=A0=91=EC=86=8D=20=EC=9C=A0=EB=8F=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 데스크탑 접속시 모바일 접속 유도
---
 frontend/src/App.css | 27 +++++++++++++++++++++++++++
 frontend/src/App.tsx | 39 ++++++++++++++++++++++++++++++++++++++-
 2 files changed, 65 insertions(+), 1 deletion(-)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index e6a56888..f35b7213 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -1,5 +1,6 @@
 #root {
   touch-action: pan-y;
+  font-family: Pretendard, 'Pretendard Variable', sans-serif;
 }
 
 .logo {
@@ -44,3 +45,29 @@
   -ms-user-select:none;
   user-select:none
 }
+
+.overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  background-color: rgba(0, 0, 0, 0.8);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  z-index: 100000;
+}
+
+.message {
+  text-align: center;
+  font-size: 1.5rem;
+  line-height: 3;
+  display: flex;
+  flex-direction: column;
+  span {
+    line-height: 1.5;
+    font-size: 0.8rem;
+  }
+}
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 48e7dcbc..8b9f2dd5 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,4 +1,41 @@
 import { IndexRoutes } from '@/routes/IndexRoutes.tsx';
 import 'App.css';
+import { useEffect, useState } from 'react';
 
-export const App = () => <IndexRoutes />;
+export const App = () => {
+  const [isMobile, setIsMobile] = useState(true);
+
+  useEffect(() => {
+    const checkIsMobile = () => {
+      const isMobileScreen = window.innerWidth <= 768;
+
+      const userAgent = navigator.userAgent || navigator.vendor || (window as any).opera;
+      const isMobileDevice = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(
+        userAgent,
+      );
+
+      setIsMobile(isMobileScreen || isMobileDevice);
+    };
+
+    checkIsMobile();
+
+    window.addEventListener('resize', checkIsMobile);
+
+    return () => window.removeEventListener('resize', checkIsMobile);
+  }, []);
+
+  if (!isMobile) {
+    return (
+      <>
+        <div className="overlay">
+          <div className="message">
+            모바일로 접속해주세요! <span>많은 관심 감사합니다.</span>
+            <span>데스크탑 버전은 추후 업데이트될 예정이니 조금만 기다려주세요!</span>
+          </div>
+        </div>
+        <IndexRoutes />
+      </>
+    );
+  }
+  return <IndexRoutes />;
+};

From c5ba70ec66a8b87897733053b9b44dea667a3d8a Mon Sep 17 00:00:00 2001
From: Hyein Jeong <jhi2359@naver.com>
Date: Wed, 27 Nov 2024 11:56:37 +0900
Subject: [PATCH 2/2] =?UTF-8?q?[FE][Feat]=20#286=20:=20=EB=8D=B0=EC=8A=A4?=
 =?UTF-8?q?=ED=81=AC=ED=83=91=20=EC=A0=91=EC=86=8D=EC=8B=9C=20=EB=AA=A8?=
 =?UTF-8?q?=EB=B0=94=EC=9D=BC=20=EC=A0=91=EC=86=8D=20=EC=9C=A0=EB=8F=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- zIndex 수정 100000 -> 10000
---
 frontend/src/App.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index f35b7213..2889717f 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -57,7 +57,7 @@
   justify-content: center;
   align-items: center;
   color: #fff;
-  z-index: 100000;
+  z-index: 10000;
 }
 
 .message {