inital member list support

src/webpage/style.css

@@ -1379,6 +1379,7 @@ span {
 	width: 100%;
 	height: 100dvh;
 	align-content: space-around;
+	align-items: stretch;
 }
 .userflex{
 	display:flex;
@@ -2219,3 +2220,51 @@ form div{
 .mentionMD:hover{
 	background:color-mix(in srgb,var(--mention-md-bg),white 10%);
 }
+#sideDiv{
+	flex-grow:0;
+	flex-shrink:0;
+	width:2.5in;
+	box-shadow: -.02in 0 .04in black;
+	&:empty{
+		width:0in;
+	}
+;
+	align-items: stretch;
+	/* overflow-x: hidden; */
+	overflow-y: unset;
+	scrollbar-width: none;
+}
+
+.memberList{
+	padding:.05in;
+	>div{
+		width: 100%;
+		>div{
+			width:100%;
+			padding:.04in .02in;
+			margin: .01in 0.0in;
+			border-radius:.1in;
+			&:hover{
+				background:var(--message-bg-hover);
+			}
+			flex-shrink: 1;
+			cursor: pointer;
+			box-sizing:border-box;
+			gap:.05in;
+			align-items: center;
+		}
+		img{
+			width:40px;
+			height:40px;
+		}
+		box-sizing: border-box;
+	}
+}
+.offline{
+	h3{
+		color:var(--primary-text)
+	}
+	>div{
+		opacity:.4;
+	}
+}