diff --git a/layouts/client.vue b/layouts/client.vue
index 73a40d6..fdce980 100644
--- a/layouts/client.vue
+++ b/layouts/client.vue
@@ -6,14 +6,21 @@
main bar
-
-
-
-
-
-
-
+
@@ -26,6 +33,9 @@ import type { GuildResponse } from '~/types/interfaces';
const loading = useState("loading", () => false);
const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds");
+for (let i = 0; i < 20; i++) {
+ guilds?.push(guilds[0]);
+}
//const servers = await fetchWithApi("/servers") as { uuid: string, name: string, description: string }[];
//console.log("servers:", servers);
@@ -124,13 +134,24 @@ const members = [
}
#left-column {
+ display: grid;
+ grid-template-rows: 1fr auto;
+ overflow-y: hidden;
+ border-right: 1px solid rgb(70, 70, 70);
+ padding-top: 1dvh;
+ padding-bottom: 1dvh;
+}
+
+#left-column-top {
display: flex;
flex-direction: column;
- gap: 2dvh;
- padding-left: .5dvw;
- padding-right: .5dvw;
- border-right: 1px solid rgb(70, 70, 70);
- padding-top: 1.5dvh;
+ gap: 1.5dvh;
+ overflow-y: scroll;
+}
+
+#left-column-bottom {
+ padding-top: 1dvh;
+ border-top: 1px solid rgb(70, 70, 70);
}
#middle-left-column {
@@ -148,6 +169,21 @@ const members = [
display: flex;
flex-direction: column;
gap: 1dvh;
+ overflow-y: scroll;
+}
+
+#join-server-button {
+ color: white;
+ background-color: transparent;
+ border: none;
+ cursor: pointer;
+ font-size: 2rem;
+ padding: 0;
+ display: inline-block;
+}
+
+#join-server-icon {
+ float: left;
}
\ No newline at end of file