gorb/frontend
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

feat: change message history grids to fix scaling of message timestamps
All checks were successful
ci/woodpecker/push/build-and-publish Pipeline was successful
Details

Browse source
This commit is contained in:
SauceyRed 2025-06-03 16:18:13 +02:00
parent a56e12149b
commit d85eb03ad0
Signed by: sauceyred
GPG key ID: 270B096EF6E9A462
2 changed files with 7 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

10
components/Message.vue
View file

@ -16,7 +16,7 @@
<div class="message-text" v-html="sanitized"></div>
</div>
</div>
<div v-else ref="messageElement" :id="props.last ? 'last-message' : undefined" class="message grouped-message" tabindex="0">
<div v-else ref="messageElement" class="message grouped-message" tabindex="0">
<div class="left-column">
<div>
<span :class="{ 'invisible': dateHidden }" class="message-date side-message-date" :title="date.toString()">
@ -24,7 +24,7 @@
</span>
</div>
</div>
<div class="message-data">
<div class="message-data" :id="props.last ? 'last-message' : undefined">
<div class="message-text" v-html="sanitized"></div>
</div>
</div>
@ -100,8 +100,7 @@ onMounted(async () => {
.message {
text-align: left;
/* border: 1px solid lightcoral; */
display: grid;
grid-template-columns: 1fr 19fr;
display: contents;
align-items: center;
}
@ -110,7 +109,7 @@ onMounted(async () => {
}
#last-message {
margin-bottom: 2dvh;
margin-bottom: 1dvh;
}
.message-metadata {
@ -143,6 +142,7 @@ onMounted(async () => {
min-width: 4dvw;
text-align: center;
align-content: center;
white-space: nowrap;
}
.author-username {

4
components/MessageArea.vue
View file

@ -245,8 +245,8 @@ onMounted(async () => {
#messages {
overflow-y: scroll;
display: flex;
flex-direction: column;
display: grid;
grid-template-columns: min-content 1fr;
gap: 1dvh;
padding-left: 1dvw;
padding-right: 1dvw;