adamf/web_server
1
1
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

Make sidebars take up full space
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 2m2s
Details

Browse Source
This commit is contained in:
Adam French
2026-03-13 15:30:34 +00:00
parent 15c721ea56
commit d5065d19e0
2 changed files with 75 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
nginx/vue/src/components/util/Chat.vue
View File

@@ -80,8 +80,9 @@ onUnmounted(() => {
</script> </script>
<template> <template>
<div class="flex flex-col"> <div class="flex-1 flex-col flex">
<Header>Chat</Header> <Header>Chat</Header>
<div class="flex-col flex flex-1">
<div <div
ref="messagesContainer" ref="messagesContainer"
class="flex flex-col flex-1 overflow-y-auto p-2" class="flex flex-col flex-1 overflow-y-auto p-2"
@@ -89,7 +90,9 @@ onUnmounted(() => {
<p v-for="message in messages" :key="message.id"> <p v-for="message in messages" :key="message.id">
<span class="text-tertiary">{{ message.authorId }}:</span> <span class="text-tertiary">{{ message.authorId }}:</span>
<template <template
v-for="(part, i) in parseMessageParts(message.text || '')" v-for="(part, i) in parseMessageParts(
message.text || '',
)"
:key="i" :key="i"
> >
<a <a
@@ -128,6 +131,7 @@ onUnmounted(() => {
</template> </template>
</p> </p>
</div> </div>
<div>
<input v-model="messageInput" @keyup.enter="sendMessage" /> <input v-model="messageInput" @keyup.enter="sendMessage" />
<input <input
ref="fileInput" ref="fileInput"
@@ -135,13 +139,18 @@ onUnmounted(() => {
class="hidden" class="hidden"
@change="onFileSelected" @change="onFileSelected"
/> />
<div class="flex justify-between"> <div class="flex gap-2">
<Button @click="sendMessage">Send</Button> <Button class="flex-1" @click="sendMessage">Send</Button>
<Button v-if="authStore.user.admin" @click="fileInput.click()" <Button
v-if="authStore.user.admin"
class="flex-1"
@click="fileInput.click()"
>Attach</Button >Attach</Button
> >
<div class="flex gap-2"> <Button class="flex-1" @click="scrollToBottom"
<Button @click="scrollToBottom">Bottom</Button> >Bottom</Button
>
</div>
</div> </div>
</div> </div>
</div> </div>

10
nginx/vue/src/views/home/Home.vue
View File

@@ -28,8 +28,10 @@ import Consumption from "./Consumption.vue";
<div <div
class="sidebar flex-1 flex flex-col m-10 w-60 gap-2 place-content-between" class="sidebar flex-1 flex flex-col m-10 w-60 gap-2 place-content-between"
> >
<div class="border-children background-children"> <div
<Chat class="h-200" /> class="flex flex-col background-children border-children flex-1 gap-2"
>
<Chat class="flex-1" />
</div> </div>
<div> <div>
<Miku class="border-tertiary border bg-bg_secondary" /> <Miku class="border-tertiary border bg-bg_secondary" />
@@ -52,7 +54,7 @@ import Consumption from "./Consumption.vue";
<Gym2 class="gym" /> <Gym2 class="gym" />
</div> </div>
<div <div
class="sidebar place-content-between flex-1 flex flex-col m-10 w-60" class="sidebar place-content-between flex-1 flex flex-col m-10 w-60 gap-2"
> >
<div <div
class="flex flex-col background-children border-children flex-1 gap-2" class="flex flex-col background-children border-children flex-1 gap-2"
@@ -60,7 +62,7 @@ import Consumption from "./Consumption.vue";
<Time /> <Time />
<Timer /> <Timer />
<Radio /> <Radio />
<CommitHistory class="h-100 overflow-y-scroll" /> <CommitHistory class="flex-1 overflow-y-scroll" />
<!-- <Elle class="flex-1" /> --> <!-- <Elle class="flex-1" /> -->
<!-- <MusicPlayer /> --> <!-- <MusicPlayer /> -->