paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-23 04:52:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

message_feed UI: Update logo dimensions for better scalability.

Browse Source 
Change 'z' logo dimensions so that it scales according to chosen font
size.

Fix: #34266
(cherry picked from commit 8682db5573)
This commit is contained in:
Jitendra Kumar
2025-04-05 09:24:27 +00:00
committed by Tim Abbott
parent 859cc29657
commit a04dd1bb92
1 changed files with 12 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
web/styles/zulip.css
View File

@@ -220,9 +220,9 @@ p.n-margin {
.alert-zulip-logo,
.top-messages-logo,
.bottom-messages-logo {
width: 24px;
height: 24px;
margin: 0 auto 12px;
width: 1.7143em; /* 24px at 14px/em */
height: 1.7143em;
margin: 0 auto 0.8571em; /* 12px at 14px/em */
& svg {
& circle {
@@ -246,10 +246,6 @@ p.n-margin {
/* Since padding under message header is not transparent
we need to position it below the padding. */
padding-top: var(--header-padding-bottom);
margin-bottom: 0;
/* To fit the logo inside the spinner. */
position: relative;
top: -2px;
}
/* See https://web.dev/animations-guide/#triggers before adding any funny animation properties here. */
@@ -1201,13 +1197,20 @@ nav {
#loading_newer_messages_indicator_box_container {
position: absolute;
left: 50%;
/* Override the base rules in app_components.css, which would require
coordination with loading.make_indicator */
.loading_indicator_spinner {
height: 2.7143em; /* 38px at 14px/em */
width: 2.7143em; /* 38px at 14px/em */
}
}
#loading_older_messages_indicator_box,
#loading_newer_messages_indicator_box {
position: relative;
left: -50%;
top: -43px;
left: -1.3571em; /* 50% of 38px = 19px at 14px/em */
top: -3.0714em; /* -43px at 14px/em */
z-index: 1;
border-radius: 6px;
}