PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Fix: Message shield alignment is not right. (#11703)

Browse source 
* Message shield alignment fixed

* Alignment fixed in all layouts

* Fixed for all font sizes
This commit is contained in:
Manan Sadana 2023-10-17 12:31:37 +05:30 committed by GitHub
parent 15d931a33f
commit 6d1aea49db
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
res/css/views/rooms/_EventBubbleTile.pcss
View file

@ -332,6 +332,9 @@ limitations under the License.
.mx_EventTile_e2eIcon { .mx_EventTile_e2eIcon {
flex-shrink: 0; /* keep it at full size */ flex-shrink: 0; /* keep it at full size */
// Keep height equal to text for shield alignment, additional 2px because of 1px padding on text
height: calc($font-18px + 2px);
} }
} }

9
res/css/views/rooms/_EventTile.pcss
View file

@ -485,7 +485,11 @@ $left-gutter: 64px;
} }
.mx_EventTile_e2eIcon { .mx_EventTile_e2eIcon {
inset: 6px 0 0 44px; inset: 0 0 0 44px;
// Keep height equal to text for alignment
height: var(--EventTile_group_line-line-height);
margin: 1px;
} }
.mx_EventTile_msgOption { .mx_EventTile_msgOption {
@ -1350,7 +1354,6 @@ $left-gutter: 64px;
.mx_EventTile[data-layout="group"] { .mx_EventTile[data-layout="group"] {
--MatrixChat_useCompactLayout_group-padding-top: $spacing-4; --MatrixChat_useCompactLayout_group-padding-top: $spacing-4;
--MatrixChat_useCompactLayout-top-avatar: 2px; --MatrixChat_useCompactLayout-top-avatar: 2px;
--MatrixChat_useCompactLayout-top-e2eIcon: 3px;
--MatrixChat_useCompactLayout_line-spacing-block: 0px; --MatrixChat_useCompactLayout_line-spacing-block: 0px;
padding-top: var(--MatrixChat_useCompactLayout_group-padding-top); padding-top: var(--MatrixChat_useCompactLayout_group-padding-top);
@ -1410,7 +1413,7 @@ $left-gutter: 64px;
} }
.mx_EventTile_e2eIcon { .mx_EventTile_e2eIcon {
top: var(--MatrixChat_useCompactLayout-top-e2eIcon); margin: 0px;
} }
.mx_DisambiguatedProfile { .mx_DisambiguatedProfile {