From db6805b8b867049be537d2e853187688cfdc52bc Mon Sep 17 00:00:00 2001 From: YurenHao0426 Date: Fri, 13 Feb 2026 23:19:35 +0000 Subject: Style all scrollbars to match katex thin transparent style Removes white scrollbar backgrounds globally, using thin translucent thumbs on transparent tracks consistent with the LaTeX formula scrollbar styling. Co-Authored-By: Claude Opus 4.6 --- frontend/src/index.css | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) (limited to 'frontend/src/index.css') diff --git a/frontend/src/index.css b/frontend/src/index.css index 8bf2bbd..864f8e5 100644 --- a/frontend/src/index.css +++ b/frontend/src/index.css @@ -206,6 +206,38 @@ html, body, #root { background: rgba(156, 163, 175, 0.8); } +/* Global thin scrollbar — matches katex-display style */ +* { + scrollbar-width: thin; + scrollbar-color: rgba(156, 163, 175, 0.4) transparent; +} + +*::-webkit-scrollbar { + width: 5px; + height: 4px; +} + +*::-webkit-scrollbar-track { + background: transparent; +} + +*::-webkit-scrollbar-thumb { + background: rgba(156, 163, 175, 0.4); + border-radius: 3px; +} + +*::-webkit-scrollbar-thumb:hover { + background: rgba(156, 163, 175, 0.7); +} + +.dark *::-webkit-scrollbar-thumb { + background: rgba(156, 163, 175, 0.3); +} + +.dark *::-webkit-scrollbar-thumb:hover { + background: rgba(156, 163, 175, 0.5); +} + /* Hide the selection box that wraps selected nodes */ .react-flow__nodesselection-rect { display: none !important; -- cgit v1.2.3