diff --git a/components/Guild/ChannelEntry.vue b/components/Guild/ChannelEntry.vue
index 9d785db..98f210e 100644
--- a/components/Guild/ChannelEntry.vue
+++ b/components/Guild/ChannelEntry.vue
@@ -1,10 +1,10 @@
 <template>
-  <div v-if="isCurrentChannel" class="channel-list-link-container rounded-corners current-channel" tabindex="0" :title="props.name">
+  <div v-if="isCurrentChannel" class="channel-list-link-container rounded-corners current-channel" tabindex="0">
 	<NuxtLink class="channel-list-link" :href="props.href" tabindex="-1">
 		# {{ props.name }}
 	</NuxtLink>
   </div>
-  <div v-else class="channel-list-link-container rounded-corners" tabindex="0" :title="props.name">
+  <div v-else class="channel-list-link-container rounded-corners" tabindex="0">
 	<NuxtLink class="channel-list-link" :href="props.href" tabindex="-1">
 		# {{ props.name }}
 	</NuxtLink>
@@ -25,8 +25,6 @@ const isCurrentChannel = props.uuid == props.currentUuid;
 	color: inherit;
 	padding-left: .25em;
 	padding-right: .25em;
-	overflow: hidden;
-	text-overflow: ellipsis;
 }
 
 .channel-list-link-container {
diff --git a/components/Me/DirectMessagesSidebar.vue b/components/Me/DirectMessagesSidebar.vue
index b06890b..4b5df7a 100644
--- a/components/Me/DirectMessagesSidebar.vue
+++ b/components/Me/DirectMessagesSidebar.vue
@@ -1,30 +1,27 @@
 <template>
-	<ResizableSidebar width="14rem" min-width="8rem" max-width="30rem" border-sides="right" local-storage-name="middleLeftColumn">
-		<div id="middle-left-column">
-			<div id="friend-sidebar">
-				<div>
-					<h3>Direct Messages</h3>
-				</div>
-				<VerticalSpacer />
-	
-				<NuxtLink class="user-item" :href="`/me`" tabindex="0">
-					<Icon class="user-avatar" name="lucide:user" />
-					<span class="user-display-name">Friends</span>
-				</NuxtLink>
-				<VerticalSpacer />
-				
-				<div id="direct-message-list">
-					<UserEntry v-for="user of friends" :user="user"
-							:href="`/me/${user.uuid}`"/> 
-				</div>
+	<div id="middle-left-column">
+		<div id="friend-sidebar">
+			<div>
+				<h3>Direct Messages</h3>
+			</div>
+			<VerticalSpacer />
+
+			<NuxtLink class="user-item" :href="`/me`" tabindex="0">
+				<Icon class="user-avatar" name="lucide:user" />
+				<span class="user-display-name">Friends</span>
+			</NuxtLink>
+			<VerticalSpacer />
+			
+			<div id="direct-message-list">
+				<UserEntry v-for="user of friends" :user="user"
+						:href="`/me/${user.uuid}`"/> 
 			</div>
 		</div>
-	</ResizableSidebar>
+	</div>
 </template>
 
 <script lang="ts" setup>
 import VerticalSpacer from '~/components/UserInterface/VerticalSpacer.vue';
-import ResizableSidebar from '../UserInterface/ResizableSidebar.vue';
 
 const { fetchFriends } = useApi();
 
diff --git a/components/User/UserEntry.vue b/components/User/UserEntry.vue
index d0d4ad6..064d2fb 100644
--- a/components/User/UserEntry.vue
+++ b/components/User/UserEntry.vue
@@ -34,15 +34,7 @@ const props = defineProps<{
 }
 
 .user-avatar {
-    min-width: 2.3em;
-    max-width: 2.3em;
-    min-width: 2.3em;
-    max-height: 2.3em;
-}
-
-.user-display-name {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
+    width: 2.3em;
+    height: 2.3em;
 }
 </style>
diff --git a/components/UserInterface/ContextMenu.vue b/components/UserInterface/ContextMenu.vue
index 5342b8c..1388bbd 100644
--- a/components/UserInterface/ContextMenu.vue
+++ b/components/UserInterface/ContextMenu.vue
@@ -7,13 +7,13 @@
 <script lang="ts" setup>
 import type { ContextMenuItem } from '~/types/interfaces';
 
-const props = defineProps<{ menuItems: ContextMenuItem[], pointerX: number, pointerY: number }>();
+const props = defineProps<{ menuItems: ContextMenuItem[], cursorX: number, cursorY: number }>();
 
 onMounted(() => {
 	const contextMenu = document.getElementById("context-menu");
 	if (contextMenu) {
-		contextMenu.style.left = props.pointerX.toString() + "px";
-		contextMenu.style.top = props.pointerY.toString() + "px";
+		contextMenu.style.left = props.cursorX.toString() + "px";
+		contextMenu.style.top = props.cursorY.toString() + "px";
 	}
 });
 
diff --git a/components/UserInterface/ResizableSidebar.vue b/components/UserInterface/ResizableSidebar.vue
deleted file mode 100644
index 3017dbc..0000000
--- a/components/UserInterface/ResizableSidebar.vue
+++ /dev/null
@@ -1,140 +0,0 @@
-<template>
-	<div ref="resizableSidebar" class="resizable-sidebar"
-			:style="{
-				'width': storedWidth ? `${storedWidth}px` : props.width,
-				'min-width': props.minWidth,
-				'max-width': props.maxWidth,
-				'border': props.borderSides == 'all' ? borderStyling : undefined,
-				'border-top': props.borderSides?.includes('top') ? borderStyling : undefined,
-				'border-bottom': props.borderSides?.includes('bottom') ? borderStyling : undefined,
-			}">
-		<div v-if="props.borderSides != 'right'" class="width-resizer-bar">
-			<div ref="widthResizer" class="width-resizer"></div>
-		</div>
-		<div class="sidebar-content">
-			<slot />
-		</div>
-		<div v-if="props.borderSides == 'right'" class="width-resizer-bar">
-			<div ref="widthResizer" class="width-resizer"></div>
-		</div>
-	</div>
-</template>
-
-<script lang="ts" setup>
-import type { ContextMenuItem } from '~/types/interfaces';
-
-const props = defineProps<{ width?: string, minWidth: string, maxWidth: string, borderSides: "all" | "top" | "right" | "bottom" | "left" | ("top" | "right" | "bottom" | "left")[], localStorageName?: string }>();
-
-const borderStyling = ".1rem solid var(--padding-color)";
-
-const resizableSidebar = ref<HTMLDivElement>();
-const widthResizer = ref<HTMLDivElement>();
-const storedWidth = ref<number>();
-
-const menuItems: ContextMenuItem[] = [
-	{ name: "Reset", callback: () => { resizableSidebar.value!.style.width = props.width ?? props.minWidth } }
-]
-
-onMounted(() => {
-	loadStoredWidth();
-
-	if (resizableSidebar.value && widthResizer.value) {
-		widthResizer.value.addEventListener("pointerdown", (e) => {
-			e.preventDefault();
-			if (e.button == 2) {
-				createContextMenu(e, menuItems);
-				return
-			};
-			document.body.style.cursor = "ew-resize";
-			function handleMove(pointer: PointerEvent) {
-				if (resizableSidebar.value) {
-					console.log("moving");
-					console.log("pointer:", pointer);
-					console.log("width:", resizableSidebar.value.style.width);
-					let delta = 0;
-					if (props.borderSides == 'right') {
-						delta = resizableSidebar.value.getBoundingClientRect().left;
-						console.log("delta:", delta);
-						resizableSidebar.value.style.width = `${pointer.clientX - delta}px`;
-					} else {
-						delta = resizableSidebar.value.getBoundingClientRect().right;
-						console.log("delta:", delta);
-						resizableSidebar.value.style.width = `${delta - pointer.clientX}px`;
-					}
-				}
-			}
-
-			document.addEventListener("pointermove", handleMove);
-
-			document.addEventListener("pointerup", () => {
-				console.log("pointer up");
-				document.removeEventListener("pointermove", handleMove);
-				console.log("removed pointermove event listener");
-				document.body.style.cursor = "";
-				if (resizableSidebar.value && props.localStorageName) {
-					localStorage.setItem(props.localStorageName, resizableSidebar.value.style.width);
-				}
-			}, { once: true });
-		});
-	}
-});
-
-onActivated(() => {
-	console.log("[res] activated");
-	loadStoredWidth();
-});
-
-function loadStoredWidth() {
-	if (props.localStorageName) {
-		const storedWidthValue = localStorage.getItem(props.localStorageName);
-		if (storedWidthValue) {
-			storedWidth.value = parseInt(storedWidthValue) || undefined;
-			console.log("[res] loaded stored width");
-		}
-	}
-}
-
-</script>
-
-<style>
-.resizable-sidebar > * {
-	box-sizing: border-box;
-}
-
-.resizable-sidebar {
-	display: flex;
-	background: var(--optional-channel-list-background);
-	background-color: var(--sidebar-background-color);
-	height: 100%;
-	flex: 0 0 auto;
-}
-
-.width-resizer {
-	width: .5rem;
-	cursor: col-resize;
-	position: absolute;
-	height: 100%;
-}
-
-.width-resizer-bar {
-	display: flex;
-	justify-content: center;
-	position: relative;
-	height: 100%;
-	width: 1px;
-	background-color: var(--padding-color);
-}
-
-.sidebar-content {
-	width: 100%;
-	padding-left: .25em;
-	padding-right: .25em;
-}
-
-.sidebar-content > :first-child {
-	width: 100%;
-	height: 100%;
-	overflow-y: scroll;
-	overflow-x: hidden;
-}
-</style>
\ No newline at end of file
diff --git a/layouts/client.vue b/layouts/client.vue
index 48a7f66..26a5ac9 100644
--- a/layouts/client.vue
+++ b/layouts/client.vue
@@ -224,8 +224,6 @@ function createDropdown() {
 	
 	background: var(--optional-sidebar-background);
 	background-color: var(--sidebar-background-color);
-
-	border-right: 1px solid var(--padding-color);
 }
 
 .left-column-segment {
@@ -245,6 +243,16 @@ function createDropdown() {
 	gap: var(--sidebar-icon-gap);
 }
 
+#middle-left-column {
+	padding-left: .25em;
+	padding-right: .25em;
+	border-right: 1px solid var(--padding-color);
+	min-width: 13em;
+	max-width: 13em;
+	overflow-y: scroll;
+	overflow-x: hidden;
+}
+
 #home-button {
 	height: var(--sidebar-icon-width);
 }
diff --git a/pages/servers/[serverId]/channels/[channelId].vue b/pages/servers/[serverId]/channels/[channelId].vue
index 00d4ebe..5e39ef4 100644
--- a/pages/servers/[serverId]/channels/[channelId].vue
+++ b/pages/servers/[serverId]/channels/[channelId].vue
@@ -1,33 +1,25 @@
 <template>
 	<NuxtLayout name="client">
-		<ResizableSidebar
-				width="14rem" min-width="8rem" max-width="30rem"
-				border-sides="right" local-storage-name="middleLeftColumn">
-			<div id="middle-left-column" class="main-grid-row">
-				<div id="server-name-container">
-					<span id="server-name" :title="server?.name">{{ server?.name }}</span>
-					<button id="server-settings-button" @click="toggleGuildSettings">
-						<Icon id="server-settings-icon" name="lucide:chevron-down" />
-					</button>
-					<GuildOptionsMenu v-if="showGuildSettings" />
-				</div>
-				<div id="channels-list">
-					<ChannelEntry v-for="channel of channels" :name="channel.name"
-						:uuid="channel.uuid" :current-uuid="(route.params.channelId as string)"
-						:href="`/servers/${route.params.serverId}/channels/${channel.uuid}`" />
-				</div>
+		<div id="middle-left-column" class="main-grid-row">
+			<div id="server-name-container">
+				<span id="server-name">{{ server?.name }}</span>
+				<button id="server-settings-button" @click="toggleGuildSettings">
+					<Icon id="server-settings-icon" name="lucide:chevron-down" />
+				</button>
+				<GuildOptionsMenu v-if="showGuildSettings" />
 			</div>
-		</ResizableSidebar>
+			<div id="channels-list">
+				<ChannelEntry v-for="channel of channels" :name="channel.name"
+					:uuid="channel.uuid" :current-uuid="(route.params.channelId as string)"
+					:href="`/servers/${route.params.serverId}/channels/${channel.uuid}`" />
+			</div>
+		</div>
 		<MessageArea :channel-url="channelUrlPath" />
-		<ResizableSidebar
-				width="14rem" min-width="5.5rem" max-width="30rem"
-				border-sides="left" local-storage-name="membersListWidth">
-			<div id="members-container">
-				<div id="members-list">
-					<MemberEntry v-for="member of members" :member="member" tabindex="0"/>
-				</div>
+		<div id="members-container">
+			<div id="members-list">
+				<MemberEntry v-for="member of members" :member="member" tabindex="0"/>
 			</div>
-		</ResizableSidebar>
+		</div>
 	</NuxtLayout>
 </template>
 
@@ -35,8 +27,7 @@
 import ChannelEntry from "~/components/Guild/ChannelEntry.vue";
 import GuildOptionsMenu from "~/components/Guild/GuildOptionsMenu.vue";
 import MemberEntry from "~/components/Guild/MemberEntry.vue";
-import ResizableSidebar from "~/components/UserInterface/ResizableSidebar.vue";
-import type { ChannelResponse, GuildMemberResponse, GuildResponse } from "~/types/interfaces";
+import type { ChannelResponse, GuildMemberResponse, GuildResponse, MessageResponse } from "~/types/interfaces";
 
 const route = useRoute();
 
@@ -62,18 +53,14 @@ onMounted(async () => {
 	console.log("mounting");
 	const guildUrl = `guilds/${route.params.serverId}`;
 	server.value = await fetchWithApi(guildUrl);
-	console.log("fetched guild");
 	await setArrayVariables();
-	console.log("set array variables");
 });
 
 onActivated(async () => {
 	console.log("activating");
 	const guildUrl = `guilds/${route.params.serverId}`;
 	server.value = await fetchWithApi(guildUrl);
-	console.log("fetched guild");
 	await setArrayVariables();
-	console.log("set array variables");
 });
 
 async function setArrayVariables() {
@@ -100,7 +87,18 @@ function handleMemberClick(member: GuildMemberResponse) {
 </script>
 
 <style>
+#middle-left-column {
+	padding-left: .5em;
+	padding-right: .5em;
+	border-right: 1px solid var(--padding-color);
+	background: var(--optional-channel-list-background);
+	background-color: var(--sidebar-background-color);
+}
+
 #members-container {
+	min-width: 15rem;
+	max-width: 15rem;
+	border-left: 1px solid var(--padding-color);
 	background: var(--optional-member-list-background);
 }
 
@@ -130,14 +128,12 @@ function handleMemberClick(member: GuildMemberResponse) {
 	display: flex;
 	flex-direction: column;
 	gap: .5em;
-	text-overflow: ellipsis;
 }
 
 .member-avatar {
-    min-width: 2.3em;
-    max-width: 2.3em;
-    min-width: 2.3em;
-    max-height: 2.3em;
+	height: 2.3em;
+	width: 2.3em;
+	border-radius: 50%;
 }
 
 .member-display-name {
@@ -155,8 +151,6 @@ function handleMemberClick(member: GuildMemberResponse) {
 
 #server-name {
 	font-size: 1.5em;
-	overflow: hidden;
-	text-overflow: ellipsis;
 }
 
 #server-settings-button {
diff --git a/utils/createContextMenu.ts b/utils/createContextMenu.ts
index cf93a37..88fe6fb 100644
--- a/utils/createContextMenu.ts
+++ b/utils/createContextMenu.ts
@@ -2,19 +2,15 @@ import { render } from "vue";
 import ContextMenu from "~/components/UserInterface/ContextMenu.vue";
 import type { ContextMenuItem } from "~/types/interfaces";
 
-export default (e: PointerEvent | MouseEvent, menuItems: ContextMenuItem[]) => {
+export default (e: MouseEvent, menuItems: ContextMenuItem[]) => {
   console.log("Rendering new context menu");
   const menuContainer = document.createElement("div");
-  console.log("hello");
   menuContainer.id = "context-menu";
   document.body.appendChild(menuContainer);
-  console.log("pointer x:", e.clientX);
-  console.log("pointer y:", e.clientY);
-  console.log("menu items:", menuItems);
   const contextMenu = h(ContextMenu, {
   	menuItems,
-  	pointerX: e.clientX,
-  	pointerY: e.clientY 
+  	cursorX: e.clientX,
+  	cursorY: e.clientY 
   });
   render(contextMenu, menuContainer);
   console.log("Rendered");