paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-04 22:13:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

left_sidebar: Allow condensed nav icons to scale.

Browse Source
This commit is contained in:
Karl Stolley
2025-01-28 16:40:18 -05:00
committed by Tim Abbott
parent ab58a2c656
commit 861917d2c5
1 changed files with 17 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
web/styles/left_sidebar.css
View File

@@ -668,12 +668,14 @@ li.active-sub-filter {
} }
&:not(:hover) .unread_count { &:not(:hover) .unread_count {
top: 2px; /* .unread_count has its based font-size set to 12px at 14px/em. */
right: 2px; /* 2px, 6px at 12px/1em */
width: 6px; top: 0.1667em;
height: 6px; right: 0.1667em;
font-size: 0; width: 0.5em;
height: 0.5em;
padding: 0; padding: 0;
color: transparent;
background-color: var(--color-background-unread-counter-dot); background-color: var(--color-background-unread-counter-dot);
} }
@@ -703,11 +705,11 @@ li.active-sub-filter {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
/* TODO: Set this 24px height value as a variable.
Keep filter-icon height the full height of the box. */
height: 24px;
/* Enlarge icons slightly in condensed views. */ /* Enlarge icons slightly in condensed views. */
font-size: 15px; /* 15px at 16px/1em */
font-size: 0.9375em;
/* 24px at 15px/1em */
height: 1.6em;
color: var(--color-left-sidebar-navigation-icon); color: var(--color-left-sidebar-navigation-icon);
} }
} }
@@ -969,7 +971,8 @@ li.top_left_scheduled_messages {
0 var(--left-sidebar-header-icon-toggle-width) 0 minmax(0, 0.5fr) 0 var(--left-sidebar-header-icon-toggle-width) 0 minmax(0, 0.5fr)
0 minmax(0, 1fr) 0 minmax(0, 1fr)
var(--left-sidebar-vdots-width) 0; var(--left-sidebar-vdots-width) 0;
grid-template-rows: 28px; /* 28px at 16px/1em */
grid-template-rows: 1.75em;
cursor: pointer; cursor: pointer;
border-radius: 4px; border-radius: 4px;
@@ -1047,10 +1050,12 @@ li.top_left_scheduled_messages {
/* Horizontally center vdots. */ /* Horizontally center vdots. */
justify-self: stretch; justify-self: stretch;
/* Properly size vdots. */ /* Properly size vdots. */
font-size: 17px; /* 17px at 16px/1em */
font-size: 1.0625em;
/* Occupy same clickable height as /* Occupy same clickable height as
other condensed-view icons */ other condensed-view icons */
height: 24px; /* 24px at 17px/1em */
height: 1.4118em;
/* Vertically center dots with /* Vertically center dots with
flexbox. */ flexbox. */
display: flex; display: flex;