Consecutive chat messages no longer indent

Contribute Bug

AI-generated summary

A user reported that consecutive chat messages stopped indenting between commits #416 and #445, with metadata no longer aligning to the left. The issue was potentially linked to changes in CSS related to flex-direction and user-info-hidden classes. Another user couldn’t reproduce the bug, and the original reporter later confirmed it was resolved, possibly due to an update or local fix. The reporter shared CSS adjustments that restored the proper alignment, suggesting the missing styles were removed in a later commit. jimkleiber provided detailed observations and a fix jimkleiber.

1

I’m testing the chat on two instances and I noticed that somewhere between commit #416 and current (#445), the consecutive chat messages are no longer being indented. I tried to dig into the code but for some reason couldn’t figure out what happened.

On #416, it looks like this:

image
image674×172 17 KB

And now on #445 it looks like this:

image
image730×264 19.1 KB

It seems the meta-data / timestamp is no longer showing to the left of the chat, but above it, and I’m not sure what happened.

Seems as if lines 486 and 473 changes, which removed the flex-direction: row from 486 and also this from 473:

.tc-messages-container .tc-message.user-info-hidden .tc-meta-data {
    align-items: flex-start;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    padding-top: 0.3em;
    width: var(--message-left-width);
}

But I could be wrong, still learning how to debug across git commits.

1 Like
2

Are you still seeing this? I’m not seeing it here or on our internal instance.

2 Likes
3

Nope, I think either an update fixed it or something fixed it on my side. I’ve been feeling kinda lost in trying debug chat, so I can’t remember what fixed this but it is definitely fixed on my side.

Thank you for following up!

Edit: for some reason, I had to add this CSS to get the user-info-hidden (consecutive texts) to line up properly…I think a found the code in a previous version, so maybe it disappeared somewhere:

.tc-messages-container .tc-message.user-info-hidden .tc-meta-data {
    align-items: flex-start;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    padding-top: 0.3em;
    width: var(--message-left-width);
}

.tc-messages-container .tc-message.user-info-hidden .tc-message-container {
    flex-direction: row;
}
2 Likes