code repo added

src/App.css

@@ -3,4 +3,5 @@
   margin: 0 auto;
   padding: 2rem;
   text-align: center;
+  cursor: default;
 }

src/App.tsx

@@ -5,12 +5,12 @@ function App() {
 
   return (
     <>
-      <div>
+      <div className='nav'>
         <div>worst</div>
         <div>HELLO WORLD</div>
         <div>slowest, weirdest but most innovative</div>
       </div>
-      
+
       <CodeRepo />
 
     </>

src/Component/CodeRepo/CodeRepo.css

@@ -0,0 +1,49 @@
+.repo{
+    width: 100%;
+
+    margin-top: 30px;
+    min-height: 60vh;
+    border: 1px solid #5d5a6b;
+    border-radius: 5px;
+
+    display: flex;
+    align-items: baseline;
+    justify-content: baseline;
+}
+
+.file-manager{
+    position: relative;
+    width: 20%;
+    min-height: inherit;
+    padding: 10px 20px;
+    border-right: 1px solid #5d5a6b;
+}
+
+.file-manager img {
+    width: 30px;
+    margin-right: 10px;
+}
+
+.code{
+    width: 80%;
+    padding: 5px;
+}
+
+.folder {
+    display: flex;
+    align-items: center;
+    justify-content: baseline;
+}
+
+.folder-content{
+    margin-top: 10px;
+}
+
+.file {
+    display: flex;
+    align-items: center;
+    justify-content: baseline;
+    margin: 10px auto;
+    padding-left: 20px;
+    font-size: 18px;
+}

src/Component/CodeRepo/CodeRepo.tsx

@@ -1,6 +1,32 @@
+import "./CodeRepo.css";
+
 const CodeRepo = () => {
+  return (
+    <>
+      <div className="repo">
+        <div className="file-manager">
+          <div className="folder">
+            <img src="logo/folder.png" /> FOLDER
+          </div>
 
-    return <>CodeRepo</>
-}
+          <div className="folder-content">
+            <div className="file">
+                <img src="logo/file.png" /> File
+            </div>
+
+            <div className="file">
+                <img src="logo/file.png" /> File
+            </div>
+
+            <div className="file">
+                <img src="logo/file.png" /> File
+            </div>
+          </div>
+        </div>
+        <div className="code">CODE</div>
+      </div>
+    </>
+  );
+};
 
-export default CodeRepo;
+export default CodeRepo;

src/index.css

@@ -14,7 +14,7 @@
 }
 
 :root {
-  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+  font-family: "Space-Mono", Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
   line-height: 1.5;
   font-weight: 400;