feat: header

Author: leeyirie

src/App.tsx

@@ -1,7 +1,20 @@
 import './App.css';
+// import { HashRouter as Router, Route, Routes } from "react-router-dom";
+import Header from './Layout/Header/Header';
 
 function App() {
-    return <>코드이지</>;
+    return (
+        <>
+            <Header />
+            {/* <Routes>
+        <Route path="/home" element={<Main />} />
+        <Route path="/Algorithm" element={<Algorithm />} />
+        <Route path="/Theme" element={<Theme />} />
+        <Route path="/Login" element={<Login />} />
+        <Route path="/Register" element={<Register/>} />
+      </Routes> */}
+        </>
+    );
 }
 
 export default App;

src/Layout/Header/Header.scss

@@ -0,0 +1,69 @@
+.header {
+    position: fixed;
+    width: 99%;
+    top: 0;
+    left: 0;
+    z-index: 1000;
+    background-color: #000;
+    color: #fff;
+    padding: 10px 20px;
+  }
+  
+  .top-section,
+  .menu,
+  .user-section {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-right: 10px;
+  }
+  
+  .nav-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    width: 100%;
+  }
+  
+  .logo {
+    font-size: 24px;
+    color: #fff;
+    text-decoration: none;
+    margin-right: 20px;
+  }
+  
+  .icons {
+    margin-right: 10px;
+    display: flex;
+  }
+
+  .icons button {
+    border: none;
+    background-color: transparent;
+    cursor: pointer;
+    padding: 3px;
+  }
+  
+  .menu {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+  }
+  
+  .menu-item {
+    margin-right: 10px;
+  }
+  
+
+//인사말과 로그인 부분
+  .greeting {
+    margin-right: 10px;
+  }
+  
+  .login-link,
+  .signup-link {
+    margin-left: 10px;
+    text-decoration: none;
+    color: #fff;
+  }
+