root/Jyotisha
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(sidebar): restyle session history as a quiet overlay scrollbar
Independent Staging Quality Gate / validate (push) Successful in 9m58s
Details
Independent Staging Quality Gate / publish (push) Successful in 9m28s
Details

Browse Source 
The native always-on track and white chrome were competing with the parchment sidebar.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Jesse_Chen
2026-08-19 18:36:36 +08:00
co-authored by Cursor
parent bffc74efc5
commit 99833eba56
3 changed files with 36 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/globals.css
+15 -1
View File
@@ -388,7 +388,21 @@ button:disabled { cursor: default; opacity: .45; }
.chat-app { width: 100%; height: 100%; min-height: 0; overflow: hidden; display: grid; background: var(--color-canvas); grid-template-columns: minmax(0, 1fr); }
.sidebar { position: relative; width: 100%; height: 100%; min-width: 0; min-height: 0; overflow: hidden; display: flex; flex-direction: column; border-right: 1px solid var(--sidebar-border); color: var(--sidebar-foreground); padding: var(--space-5) var(--space-3) 0; background: var(--sidebar-background); backdrop-filter: saturate(130%) blur(20px); }
[data-sidebar="header"] { flex: 0 0 auto; }
[data-sidebar="content"] { min-height: 0; flex: 1 1 auto; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
[data-sidebar="content"] { min-height: 0; flex: 1 1 auto; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: transparent transparent; }
[data-sidebar="content"]:hover, [data-sidebar="content"]:focus-within { scrollbar-color: color-mix(in srgb, var(--color-ink) 26%, transparent) transparent; }
[data-sidebar="content"]::-webkit-scrollbar { width: 10px; background: transparent; }
[data-sidebar="content"]::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
[data-sidebar="content"]::-webkit-scrollbar-track, [data-sidebar="content"]::-webkit-scrollbar-corner { background: transparent; }
[data-sidebar="content"]::-webkit-scrollbar-thumb { background-color: transparent; border: 3px solid transparent; border-radius: 999px; background-clip: content-box; }
[data-sidebar="content"]:hover::-webkit-scrollbar-thumb, [data-sidebar="content"]:focus-within::-webkit-scrollbar-thumb { background-color: color-mix(in srgb, var(--color-ink) 26%, transparent); }
[data-sidebar="content"]::-webkit-scrollbar-thumb:hover { background-color: color-mix(in srgb, var(--color-ink) 40%, transparent); }
@media (prefers-contrast: more) {
[data-sidebar="content"] { scrollbar-color: var(--color-ink-secondary) transparent; }
[data-sidebar="content"]::-webkit-scrollbar-thumb, [data-sidebar="content"]:hover::-webkit-scrollbar-thumb, [data-sidebar="content"]:focus-within::-webkit-scrollbar-thumb { background-color: var(--color-ink-secondary); }
}
@media (forced-colors: active) {
[data-sidebar="content"] { scrollbar-width: auto; scrollbar-color: auto; }
}
[data-sidebar="footer"] { flex: 0 0 auto; }
[data-sidebar="sidebar"]:focus { outline: none; }
.brand-row { display: flex; align-items: center; min-height: 48px; gap: var(--space-3); padding: 0 var(--space-2); font-family: var(--font-display); font-size: var(--type-title-lg); letter-spacing: -.3px; }