paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-06 15:03:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

user_status: Fix alignment of select-emoji icon of user-status modal.

Browse Source 
use flex display justify-content for vertical alignment
instead of using offsets like "top". for horizontal
alignment of smiley-icon use text-align center.

Signed-off-by: sayyedarib <sayyedaribhussain4321@gmail.com>
This commit is contained in:
sayyedarib
2023-12-20 12:25:10 +05:30
committed by Tim Abbott
parent a17f18f155
commit d41ee3d3d8
1 changed files with 2 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
web/styles/user_status.css
View File

@@ -4,6 +4,7 @@
.user-status-content-wrapper { .user-status-content-wrapper {
display: flex; display: flex;
justify-content: center;
align-items: center; align-items: center;
border: 1px solid; border: 1px solid;
border-color: hsl(0deg 0% 0% / 60%); border-color: hsl(0deg 0% 0% / 60%);
@@ -30,26 +31,16 @@
width: 20px; width: 20px;
height: 20px; height: 20px;
cursor: pointer; cursor: pointer;
/*
the following rule is not necessarily better than the one
from a6bef5154197b15c20445526fd3f219b4f2e5379 but it works.
*/
top: -2px;
} }
/* For custom emojis and smiley icon to take full width. */ /* For custom emojis and smiley icon to take full width. */
& img.selected-emoji, & img.selected-emoji,
.smiley-icon { .smiley-icon {
text-align: center;
min-width: 20px; min-width: 20px;
} }
.smiley-icon { .smiley-icon {
display: block;
font-size: 18px;
position: relative;
top: -2px;
left: 2px;
&:hover { &:hover {
text-decoration: none; text-decoration: none;
} }