Skip to content

Commit

Permalink
Normalize inline spacing of image and file button on ThreadView (#8664)
Browse files Browse the repository at this point in the history
  • Loading branch information
luixxiul authored May 21, 2022
1 parent 5082d67 commit 23babbb
Show file tree
Hide file tree
Showing 2 changed files with 12 additions and 17 deletions.
4 changes: 3 additions & 1 deletion res/css/views/rooms/_EventBubbleTile.scss
Original file line number Diff line number Diff line change
Expand Up @@ -243,10 +243,12 @@ limitations under the License.
}

.mx_EventTile_line {
--EventBubbleTile_line-margin-inline-end: -12px;

position: relative;
display: flex;
gap: 5px;
margin: 0 -12px 0 -9px;
margin: 0 var(--EventBubbleTile_line-margin-inline-end) 0 -9px;
border-top-left-radius: var(--cornerRadius);
border-top-right-radius: var(--cornerRadius);

Expand Down
25 changes: 9 additions & 16 deletions res/css/views/rooms/_EventTile.scss
Original file line number Diff line number Diff line change
Expand Up @@ -895,7 +895,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
margin-inline-end: var(--BaseCard_EventTile-spacing-horizontal);

.mx_EventTile_line.mx_EventTile_mediaLine {
padding: 0 !important;
padding: 0;
max-width: 100%;

.mx_MFileBody {
Expand All @@ -907,7 +907,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
align-items: flex-end;

.mx_EventTile_line.mx_EventTile_mediaLine {
margin: 0 -13px 0 0; // align with normal messages
margin: 0 var(--EventBubbleTile_line-margin-inline-end) 0 0; // align with normal messages
}
}
}
Expand Down Expand Up @@ -935,6 +935,13 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
}
}

.mx_MFileBody,
.mx_MImageBody {
display: block; // Apply margin to span element
margin-inline-start: var(--ThreadView_group_spacing-start);
margin-inline-end: var(--ThreadView_group_spacing-end);
}

.mx_ReplyChain_wrapper {
.mx_MLocationBody {
margin-inline-start: 0;
Expand Down Expand Up @@ -965,20 +972,6 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
}
}
}

.mx_EventTile_mediaLine {
padding-inline-start: var(--ThreadView_group_spacing-start);
}
}

.mx_EventTile_mediaLine {
padding-inline-start: var(--BaseCard_EventTile-spacing-horizontal);
padding-right: 50px;

.mx_MImageBody {
margin: 0;
padding: 0;
}
}

.mx_MessageComposer_sendMessage {
Expand Down

0 comments on commit 23babbb

Please sign in to comment.