From f69571847a9c594488b14fa351e01330b66cb99d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Astori?= Date: Fri, 13 Jul 2018 00:22:25 -0400 Subject: [PATCH] Make userlist section titles sticky on scroll --- client/css/style.css | 17 +++++++++++++---- client/themes/morning.css | 1 + 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index ba45183e..dba8c996 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -5,6 +5,9 @@ /* Main text color */ --body-color: #222; + /* Secondary text color, dimmed. Make sure to keep contrast WCAG 2.0 AA compliant on var(--window-bg-color) */ + --body-color-muted: #767676; + /* Background color of the whole page */ --body-bg-color: #415364; @@ -1564,13 +1567,19 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */ white-space: nowrap; } +#chat .user-mode { + margin-bottom: 15px; +} + #chat .user-mode::before { - content: ""; - border-bottom: 1px solid #eee; + background: var(--window-bg-color); + color: var(--body-color-muted); display: block; + font-size: 0.85em; line-height: 1.6; - padding: 12px 16px 10px; - margin-bottom: 10px; + padding: 5px 16px; + position: sticky; + top: 0; } #chat .user-mode.owner::before { diff --git a/client/themes/morning.css b/client/themes/morning.css index 2cdf150f..48d361e7 100644 --- a/client/themes/morning.css +++ b/client/themes/morning.css @@ -2,6 +2,7 @@ :root { --body-color: #f3f3f3; + --body-color-muted: #b7c5d1; --link-color: #77abd9; --window-bg-color: #303e4a; --date-marker-color: #97ea70;