diff --git a/src/App.js b/src/App.js index 9da8918..b84913a 100644 --- a/src/App.js +++ b/src/App.js @@ -1,4 +1,4 @@ -import "./App.css"; +import styles from "./App.module.css"; import { Taskbar } from "./components/TaskBar.js"; import { WindowsManagerProvider } from "./hooks/WindowsManagerContext.js"; import { WindowsView } from "./components/WindowsView.js"; @@ -9,7 +9,7 @@ function App() { return ( -
+
diff --git a/src/App.css b/src/App.module.css similarity index 100% rename from src/App.css rename to src/App.module.css diff --git a/src/components/TaskBar.js b/src/components/TaskBar.js index 1c54842..cb98ab5 100644 --- a/src/components/TaskBar.js +++ b/src/components/TaskBar.js @@ -1,5 +1,5 @@ import { useEffect, useState } from "react"; -import "./TaskBar.css"; +import styles from "./TaskBar.module.css"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faBatteryFull, faSearch, faVolumeHigh, faWifi } from "@fortawesome/free-solid-svg-icons"; import ApplicationsManager from "../features/applications/applications.js"; @@ -15,8 +15,8 @@ export function Taskbar() { }, []); return ( -
-
+
+
@@ -24,7 +24,7 @@ export function Taskbar() { )}
-
+
diff --git a/src/components/TaskBar.css b/src/components/TaskBar.module.css similarity index 100% rename from src/components/TaskBar.css rename to src/components/TaskBar.module.css diff --git a/src/components/Window.js b/src/components/Window.js index 60faa66..d03e5ff 100644 --- a/src/components/Window.js +++ b/src/components/Window.js @@ -1,5 +1,5 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import "./Window.css"; +import styles from "./Window.module.css"; import { faMinus, faXmark } from "@fortawesome/free-solid-svg-icons"; import { faSquare } from "@fortawesome/free-regular-svg-icons"; import { ReactSVG } from "react-svg"; @@ -25,11 +25,11 @@ export function Window({ id, app, size, position, focused = false }) { resizeObserver.observe(document.getElementById("root")); }); - const classNames = ["Window-container"]; + const classNames = [styles["Window-container"]]; if (maximized) - classNames.push("Maximized"); + classNames.push(styles.Maximized); if (minimized) - classNames.push("Minimized"); + classNames.push(styles.Minimized); return ( -
- +
+

{app.name}

-
+
{app.windowContent}
diff --git a/src/components/Window.css b/src/components/Window.module.css similarity index 100% rename from src/components/Window.css rename to src/components/Window.module.css diff --git a/src/components/task-bar/AppButton.js b/src/components/task-bar/AppButton.js index fb6a476..69bc5f6 100644 --- a/src/components/task-bar/AppButton.js +++ b/src/components/task-bar/AppButton.js @@ -3,6 +3,7 @@ import { useEffect, useState } from "react"; import { useWindows } from "../../hooks/WindowsContext.js"; import { useWindowsManager } from "../../hooks/WindowsManagerContext.js"; import { ReactSVG } from "react-svg"; +import styles from "../TaskBar.module.css"; export function AppButton({ app }) { const [active, setActive] = useState(false); @@ -13,7 +14,7 @@ export function AppButton({ app }) { setActive(windowsManager.isAppActive(app.id)); }, [windows]); - return (); } \ No newline at end of file diff --git a/src/logo.svg b/src/logo.svg deleted file mode 100644 index 9dfc1c0..0000000 --- a/src/logo.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file