diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index b6c3fa9..5327bc1 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,5 +1,5 @@
import { useEffect, useState } from 'react';
-import Navigation from './components/Navigation';
+import Navigation from './components/Navigation/Navigation';
import DocsGPT from './components/DocsGPT';
import './App.css';
diff --git a/frontend/src/components/Navigation.tsx b/frontend/src/components/Navigation.tsx
deleted file mode 100644
index 4c0a632..0000000
--- a/frontend/src/components/Navigation.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import React, { useState } from 'react';
-
-function MobileNavigation() {
- return
Mobile Navigation
;
-}
-
-function DesktopNavigation() {
- return Desktop Navigation
;
-}
-
-export default function Navigation({ isMobile }: { isMobile: boolean }) {
- if (isMobile) {
- return ;
- } else {
- return ;
- }
-}
diff --git a/frontend/src/components/Navigation/Navigation.tsx b/frontend/src/components/Navigation/Navigation.tsx
new file mode 100644
index 0000000..de28347
--- /dev/null
+++ b/frontend/src/components/Navigation/Navigation.tsx
@@ -0,0 +1,26 @@
+import React, { useState } from 'react';
+import Arrow1 from './imgs/arrow.svg';
+
+function MobileNavigation() {
+ return Mobile Navigation
;
+}
+
+function DesktopNavigation() {
+ return (
+
+
+
+
+
+ );
+}
+
+export default function Navigation({ isMobile }: { isMobile: boolean }) {
+ if (isMobile) {
+ return ;
+ } else {
+ return ;
+ }
+}
diff --git a/frontend/src/components/Navigation/imgs/arrow.svg b/frontend/src/components/Navigation/imgs/arrow.svg
new file mode 100644
index 0000000..8debfc9
--- /dev/null
+++ b/frontend/src/components/Navigation/imgs/arrow.svg
@@ -0,0 +1,3 @@
+