restructured the files and created skeleton for the Login component

src/components/App.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Button, Box } from "@mui/material"
-import variables from "./variables.module.scss"
+import variables from "@scss/variables.module.scss"
-import "./style.scss"
+import "@scss/style.scss"
 
 export default function App() {
     let boxStyle = {

src/components/Login.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+import { Card } from "@mui/material"
+
+export default function Login(){
+    return (
+        <main id="root">
+            
+        </main>
+    )
+}

src/index.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react' 
 import { createRoot } from 'react-dom/client' 
-import App from "./App"
+import App from "./components/App"
 
 createRoot(document.querySelector("#root")).render(<App />)