diff --git a/frontend/src/components/SideMenu.jsx b/frontend/src/components/SideMenu.jsx
index 659da66..b720d72 100644
--- a/frontend/src/components/SideMenu.jsx
+++ b/frontend/src/components/SideMenu.jsx
@@ -1,7 +1,7 @@
import "../css/SideMenu.css";
import PropTypes from 'prop-types';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faTimes } from '@fortawesome/free-solid-svg-icons';
+import { faTimes, faHome } from '@fortawesome/free-solid-svg-icons';
import { DataProvider } from '../contexts/DataContext';
import { useData } from '../contexts/DataContext';
@@ -63,9 +63,13 @@ const SideMenuContent = ({ isOpen, onClose }) => {
return (
+
+
{data.map(device => {
return (
diff --git a/frontend/src/css/SideMenu.css b/frontend/src/css/SideMenu.css
index 6428305..920435c 100644
--- a/frontend/src/css/SideMenu.css
+++ b/frontend/src/css/SideMenu.css
@@ -54,4 +54,37 @@
.side-menu .close-btn:hover {
color: var(--primary-color);
+}
+
+.side-menu .home-btn {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ background: none;
+ border: none;
+ font-size: 30px;
+ cursor: pointer;
+}
+
+.side-menu .home-btn .fa-home {
+ width: 30px;
+ height: 30px;
+}
+
+.side-menu .home-btn.light {
+ color: black;
+}
+
+.side-menu .home-btn.dark {
+ color: white;
+}
+
+.side-menu .home-btn:hover {
+ color: var(--primary-color);
+}
+
+hr.separation {
+ margin: 60px 0;
+ border: none;
+ border-top: 1px solid #ccc;
}
\ No newline at end of file