Fix sidebar jitter & improve ui

webroot/index.html

@@ -12,7 +12,7 @@
     <sidebarelement id="sidebar-home">
         <indicator class="active">
         </indicator>
-        <button class="icon-button" aria-label="Homepage">
+        <button class="icon-button" aria-label="Homepage" onclick="gotoHome()">
             <svg viewBox="-1 -1 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
                 <path
                         d="M1 6V15H6V11C6 9.89543 6.89543 9 8 9C9.10457 9 10 9.89543 10 11V15H15V6L8 0L1 6Z"
@@ -29,7 +29,7 @@
     <sidebarelement id="sidebar-add">
         <indicator>
         </indicator>
-        <button class="icon-button" aria-label="Add space">
+        <button class="icon-button" aria-label="Add space" onclick="gotoCreateSpace()">
             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor"
                  stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                 <line x1="12" y1="5" x2="12" y2="19"></line>
@@ -38,6 +38,13 @@
         </button>
     </sidebarelement>
     <hr>
+    <sidebarelement id="sidebar-profile" class="bottom-element">
+        <indicator>
+        </indicator>
+        <button class="icon-button" aria-label="Profile"  onclick="gotoSideProfilePopup()">
+            <img id="sidebar-pfp" src="./pfpexamp.png">
+        </button>
+    </sidebarelement>
 </sidebar>
 
 <sidebar class="second" id="roomsbar">
@@ -158,6 +165,10 @@
             showBlahNotification("error:chat.add.failed");
         }
     }
+    
+    async function createGroup() {
+        
+    }
 
     start();
 </script>