1 files changed, 56 insertions, 8 deletions
diff --git a/src/App.css b/src/App.css
index d4cd6e6..942b193 100644
--- a/src/App.css
+++ b/src/App.css
@@ -4,16 +4,16 @@
   position: fixed;
   z-index: 1;
   top: 10%;
-  left: 8%;
-  /* color: #FFFFFF; */
-  /* background-color: #111; */
+  left: 30%;
+  color: #FFFFFF;
+  background-color: #111;
   overflow-x: hidden;
   transition: 0.5s;
-  padding-top: 60px;
-  /*background-color: #333333;*/
-  /*border: 2px solid #BB86fc;*/
-  padding: 20px;
-  margin: 20px;
+  /* padding-top: 60px; */
+  background-color: #333333;
+  border: 2px solid #BB86fc;
+  /* padding: 20px; */
+  /* margin: 20px; */
   border-radius: 5px;
   overflow: auto;
 }
@@ -26,7 +26,55 @@
 .white-content {
   background: #e4e4e4;
 }
+/* .black-content {
+  background: #111111;
+} */
 
 .toggle-slider {
   display: flex;
 }
+
+.sidenav {
+  height: 80%;
+  width: 5%;
+  position: fixed;
+  z-index: 1;
+  top: 5%;
+  left: 0;
+  background-color: #111;
+  overflow-x: hidden;
+  transition: 0.5s;
+  padding-top: 60px;
+  background-color: #333333;
+  border: 2px solid #BB86fc;
+  padding: 20px;
+  margin: 20px;
+  border-radius: 5px;
+}
+
+.sidenav :hover {
+  color: #f1f1f1;
+}
+
+ul {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+  width: 5%;
+  position: fixed;
+  overflow: auto;
+}
+
+.sidenavButton {
+  display: block;
+  color: #000;
+  padding: 8px 16px;
+  background-color: #BB86fc;
+  text-decoration: none;
+  border: 1px solid #333333;
+  border-radius: 5px;
+}
+
+li:last-child {
+  border-bottom: none;
+}
+\ No newline at end of file