From 7dce8df4e87d4c13728f0d18ddd150c86797cc12 Mon Sep 17 00:00:00 2001 From: Karl Stolley Date: Mon, 11 Aug 2025 16:17:50 -0400 Subject: [PATCH] left_sidebar: Avoid clipping tall glyphs in DM groups, topics. --- web/styles/left_sidebar.css | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/web/styles/left_sidebar.css b/web/styles/left_sidebar.css index 495517cced..894663d866 100644 --- a/web/styles/left_sidebar.css +++ b/web/styles/left_sidebar.css @@ -1646,7 +1646,12 @@ li.active-sub-filter { overflow-wrap: break-word; line-height: var(--line-height-sidebar-topic-inner); - margin: var(--spacing-top-bottom-sidebar-topic-inner) 0; + /* To avoid clipping the tops of certain characters, + we set the top space with padding. But to make the + line-clamp effect work, we set the bottom space + with margin. */ + padding-top: var(--spacing-top-bottom-sidebar-topic-inner); + margin: 0 0 var(--spacing-top-bottom-sidebar-topic-inner) 0; } } @@ -1805,8 +1810,13 @@ li.active-sub-filter { overflow-wrap: break-word; line-height: var(--line-height-sidebar-topic-inner); - margin: var(--spacing-top-bottom-sidebar-topic-inner) 0; - padding: 0 var(--left-sidebar-before-unread-count-padding) 0 0; + /* To avoid clipping the tops of certain characters, + we set the top space with padding. But to make the + line-clamp effect work, we set the bottom space + with margin. */ + padding: var(--spacing-top-bottom-sidebar-topic-inner) + var(--left-sidebar-before-unread-count-padding) 0 0; + margin-bottom: var(--spacing-top-bottom-sidebar-topic-inner); } /*