Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Don't overlap tile bubbles with timestamps in modern layout #8908

Merged
merged 2 commits into from
Jun 27, 2022
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 7 additions & 1 deletion res/css/views/messages/_EventTileBubble.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,17 @@ limitations under the License.
padding: 10px;
border-radius: 8px;
margin: 10px auto;
max-width: min(90%, 600px);
// Reserve space for external timestamps, but also cap the width
max-width: min(calc(100% - 2 * 48px), 600px);
robintown marked this conversation as resolved.
Show resolved Hide resolved
box-sizing: border-box;
display: grid;
grid-template-columns: 24px minmax(0, 1fr) min-content min-content;

.mx_EventTile[data-layout=bubble] & {
// Timestamps are inside the tile, so the width can be less constrained
max-width: 600px;
}

&::before, &::after {
position: relative;
grid-column: 1;
Expand Down