Strength without justice is meaningless.

Strength without justice is meaningless.

src/pages/main_page/internal_apps/App.css

@@ -55,12 +55,9 @@
     color: white;
     width: 873px;
     max-width: 100%;
-<<<<<<< HEAD
-=======
-    z-index: 99;
->>>>>>> c1541b44c7395eafd8f1fdc951aeb5c6ab2dbdeb
     display: flex;
     align-items: flex-start;
+    z-index: 1;
     background-color: #333333df;
     height: 50svh;    
     backdrop-filter: blur(10px);
@@ -72,14 +69,13 @@
 }
 
 .frametest2{
-<<<<<<< HEAD
 border-radius: 20px;
-=======
     border-bottom-left-radius: 20px;
     border-bottom-right-radius: 20px;
-    background-color: #333;
+    backdrop-filter: blur(30px);
+
+    background-color: #333333d3;
     height: 50svh;    
->>>>>>> c1541b44c7395eafd8f1fdc951aeb5c6ab2dbdeb
 }
 
 .filesystemtxt {

src/pages/main_page/internal_apps/App.tsx

@@ -1,4 +1,4 @@
-import React, { useState, RefObject } from "react";
+import React, { useState, RefObject, useEffect } from "react";
 import { useDraggable } from '../Grid';
 import './App.css';
 

src/pages/main_page/internal_apps/file_system.tsx

@@ -42,15 +42,10 @@ function file_system() : [JSX.Element, React.Dispatch<React.SetStateAction<strin
     let app_html = <div className='frametest2' onContextMenu={right_click}>
     {Application}
     </div>;
-<<<<<<< HEAD
-    let app = <App element={app_html} name='File System'/>;
-    set_fs_html(app);
-};
-=======
     const [display, set_display] = useState('none');
-    let app = <App element={app_html} display={display} set_display={set_display} name='feet pics'/>;
+    let app = <App element={app_html} display={display} set_display={set_display} name='File System'/>;
     return [app, set_display];
->>>>>>> c1541b44c7395eafd8f1fdc951aeb5c6ab2dbdeb
-}
+};
+
 
 export default file_system;

src/pages/main_page/main_page.css

@@ -17,8 +17,9 @@
   justify-content: flex-end; /* Align items to the right */
   position: fixed;
   bottom: 0;
+  z-index: 2000;
   height: 5svh;
-  backdrop-filter: blur(10px);
+  backdrop-filter: blur(50px);
 
   width: 100%;
  }
@@ -126,18 +127,35 @@ color: white;
   bottom: 0;
   min-width: 100%;
   min-height: 100%;
-  z-index: -1;
+  z-index: -2;
   object-fit: cover;
  }
 
 
 .menu{
   position: absolute;
   bottom: -50svh;
-  width: 30svw;
+  width: 25svw;
   height: 50svh;
+  z-index: 4;
   background-color: #3333338b;
   transition: all 0.1s ease-in-out;
+  backdrop-filter: blur(50px);
+  border-right: 2px #0202022f;
+  border-top: 2px #0202022f;
+  border-left: 2px #0202022f;
+  border-bottom: 3px rgba(249, 249, 249, 0.496);
+  border-style: outset;
+  border-top-right-radius: 20px;
+  border-top-left-radius: 20px;
+
+}
+
+.menutext {
+  margin-right: 500px;
+  padding-left: 10px;
+  color: rgb(255, 255, 255);
+  font-weight: normal;
 }
 
 .show{

src/pages/main_page/main_page.tsx

@@ -3,26 +3,16 @@ import './main_page.css';
 import Grid from './Grid';
 import folder from './assets/folder.png';
 import menu_icon from './assets/computer-laptop-color-icon.webp';
-<<<<<<< HEAD
 import search from './assets/search.png';
 import terminald from './assets/terminal.png';
-=======
-import search from './assets/search-icon.svg';
-import terminald from './assets/Terminal-icon.png';
->>>>>>> c1541b44c7395eafd8f1fdc951aeb5c6ab2dbdeb
 import file_system from './internal_apps/file_system';
 import ibetonhakari from './assets/TOCA2.mp4';;
 import { desktop_app } from './Grid';
 
 
 export default function MainPage() {
-<<<<<<< HEAD
-    const [fs, set_fs] = useState(<></>);
-    const example_app = desktop_app("Files", folder, file_system(set_fs));
-=======
     const [app, fs_display] = file_system();
-    const example_app = desktop_app("Dolphin", folder, () => {fs_display('inherit')});
->>>>>>> c1541b44c7395eafd8f1fdc951aeb5c6ab2dbdeb
+    const example_app = desktop_app("Files", folder, () => {fs_display('inherit')});
     const not_example_app = desktop_app("Search", search, () => { console.log("test"); });
     const terminal = desktop_app("Terminal", terminald, () => {});
     const [menu, set_menu] = useState(false);
@@ -36,18 +26,12 @@ export default function MainPage() {
                 <img className='terminalimg' src={terminald} alt="" />
                 <p className='time'>12:09 AM <br /> 12/10/2027</p>
             </nav>
-<<<<<<< HEAD
-            <video className='hakari' src={ibetonhakari} width="100%" height="100%" autoPlay loop muted>
-                Your browser does not support the video tag.
-            </video>
-=======
             <div className={`menu ${menu ? 'show' : 'hide'}`}>
-                <h1>test</h1>
+                <h1 className='menutext' >Applications</h1>
             </div>
             <video className='hakari' src={ibetonhakari} width="100%" height="100%" autoPlay muted loop>
     Your browser does not support the video tag.
 </video>
->>>>>>> c1541b44c7395eafd8f1fdc951aeb5c6ab2dbdeb
         </div>
     );
 }