Crash_Override/FreeDATA
1
0
Fork 0
mirror of https://github.com/DJ2LS/FreeDATA synced 2024-05-14 08:04:33 +00:00
Code Issues Projects Releases Packages Wiki Activity

fixed long texts causing screen overflow

Browse source
This commit is contained in:
DJ2LS 2024-05-01 10:12:51 +02:00
parent d3f378ec43
commit 0d8cd1e13d
5 changed files with 12 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
freedata_gui/src/components/chat.vue
View file

@ -118,22 +118,18 @@ watch(
</script> </script>
<template> <template>
<div class="container-fluid"> <div class="container-fluid d-flex">
<div class="row">
<!-- Chat Conversations --> <!-- Chat Conversations -->
<div class="col-3 bg-light p-0"> <div class="bg-light p-0" style="width: 250px">
<div class="container-fluid overflow-auto p-0"> <div class="container-fluid overflow-auto p-0">
<chat_conversations /> <chat_conversations />
</div> </div>
<div <div class="list-group overflow-auto" id="list-tab-chat" role="tablist"></div>
class="list-group overflow-auto"
id="list-tab-chat"
role="tablist"
></div>
</div> </div>
<!-- Chat Messages --> <!-- Chat Messages -->
<div class="col-9 border-start p-0"> <div class="flex-grow-1 border-start p-0">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<!-- Top Navbar --> <!-- Top Navbar -->
<nav class="navbar sticky-top z-0 bg-body-tertiary border-bottom p-1"> <nav class="navbar sticky-top z-0 bg-body-tertiary border-bottom p-1">
@ -170,5 +166,4 @@ watch(
</div> </div>
</div> </div>
</div> </div>
</div>
</template> </template>

2
freedata_gui/src/components/chat_messages_broadcast_received.vue
View file

@ -11,7 +11,7 @@
</div> </div>
<div class="card-body"> <div class="card-body">
<p class="card-text">{{ message.msg }}</p> <p class="card-text text-break">{{ message.msg }}</p>
</div> </div>
<div class="card-footer p-0 bg-light border-top-0"> <div class="card-footer p-0 bg-light border-top-0">

2
freedata_gui/src/components/chat_messages_broadcast_sent.vue
View file

@ -25,7 +25,7 @@
</div> </div>
<div class="card-body"> <div class="card-body">
<p class="card-text">{{ message.msg }}</p> <p class="card-text text-break">{{ message.msg }}</p>
</div> </div>
<div class="card-footer p-0 bg-primary border-top-0"> <div class="card-footer p-0 bg-primary border-top-0">

2
freedata_gui/src/components/chat_messages_received.vue
View file

@ -23,7 +23,7 @@
</div> </div>
<div class="card-body"> <div class="card-body">
<p class="card-text">{{ message.body }}</p> <p class="card-text text-break">{{ message.body }}</p>
</div> </div>
<div class="card-footer p-0 bg-light border-top-0"> <div class="card-footer p-0 bg-light border-top-0">

8
freedata_gui/src/components/chat_messages_sent.vue
View file

@ -46,8 +46,8 @@
</div> </div>
</div> </div>
<div class="card-body w-100"> <div class="card-body">
<p class="card-text w-100">{{ message.body }}</p> <p class="card-text text-break">{{ message.body }}</p>
</div> </div>
<div class="card-footer p-0 bg-secondary border-top-0"> <div class="card-footer p-0 bg-secondary border-top-0">
@ -167,9 +167,9 @@ export default {
if (this.message.body.length <= 50) { if (this.message.body.length <= 50) {
return "col-4"; return "col-4";
} else if (this.message.body.length <= 100) { } else if (this.message.body.length <= 100) {
return "col-5"; return "col-6";
} else { } else {
return "col-5"; return "col-8";
} }
}, },