fix(frontend): remove scrollbar-gutter and restore padding for scroll containers
Drop `scrollbar-gutter: stable both-edges` / `stable` from `.scrollbar-thin` and `.scrollbar-thin-edge` so scrollbars overlay content without reserving space, fixing layout inconsistencies between overlay and classic scrollbar environments. Restore padding that was previously reduced to compensate for the gutter: `px-1` to `px-3` in git-log-tab, `px-2` to `px-4` in virtualized-message-thread, and add `px-2` to sidebar-conversation-list and session-files-tab. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -903,7 +903,7 @@ export function GitLogTab() {
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="flex flex-col h-full overflow-y-auto scrollbar-thin px-1 py-3">
|
||||
<div className="flex flex-col h-full overflow-y-auto scrollbar-thin px-3 py-3">
|
||||
{hasBranches && (
|
||||
<BranchSelector
|
||||
branchList={branchList}
|
||||
@@ -929,7 +929,7 @@ export function GitLogTab() {
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div className="flex flex-col h-full overflow-y-auto scrollbar-thin px-1 py-3">
|
||||
<div className="flex flex-col h-full overflow-y-auto scrollbar-thin px-3 py-3">
|
||||
{hasBranches && (
|
||||
<BranchSelector
|
||||
branchList={branchList}
|
||||
@@ -959,7 +959,7 @@ export function GitLogTab() {
|
||||
|
||||
if (entries.length === 0) {
|
||||
return (
|
||||
<div className="flex flex-col h-full overflow-y-auto scrollbar-thin px-1 py-3">
|
||||
<div className="flex flex-col h-full overflow-y-auto scrollbar-thin px-3 py-3">
|
||||
{hasBranches && (
|
||||
<BranchSelector
|
||||
branchList={branchList}
|
||||
@@ -985,7 +985,7 @@ export function GitLogTab() {
|
||||
<ContextMenuTrigger asChild>
|
||||
<div
|
||||
onScroll={handleScroll}
|
||||
className="flex-1 min-h-0 overflow-y-auto scrollbar-thin px-1 py-3 space-y-3"
|
||||
className="flex-1 min-h-0 overflow-y-auto scrollbar-thin px-3 py-3 space-y-3"
|
||||
>
|
||||
{hasBranches && (
|
||||
<div
|
||||
|
||||
@@ -290,7 +290,7 @@ export function SessionFilesTab() {
|
||||
|
||||
return (
|
||||
<div className="flex flex-col h-full">
|
||||
<div className="flex-1 min-h-0 overflow-y-auto scrollbar-thin">
|
||||
<div className="flex-1 min-h-0 overflow-y-auto scrollbar-thin px-2">
|
||||
<SessionFilesContent conversationId={conversationId} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user