From 14eac9f1c5a237107ac3d5b3b2b81b48b2f36d91 Mon Sep 17 00:00:00 2001 From: Claude Date: Thu, 10 Sep 2026 00:06:45 +0000 Subject: [PATCH] Fix scrollbar width visibility on macOS Chrome Remove transparent border trick that reduced visible thumb width; add explicit display:block and subtle track background so the full SCROLLBAR_SIZE is rendered on macOS Chrome. Co-Authored-By: Claude Sonnet 4.6 Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu --- .../src/Pages/Docker/ContainerDetails/TabLogs.tsx | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/client/src/Pages/Docker/ContainerDetails/TabLogs.tsx b/client/src/Pages/Docker/ContainerDetails/TabLogs.tsx index 0b5ccbe7f..9ac5e2b18 100644 --- a/client/src/Pages/Docker/ContainerDetails/TabLogs.tsx +++ b/client/src/Pages/Docker/ContainerDetails/TabLogs.tsx @@ -217,14 +217,19 @@ export const TabLogs = ({ monitorId, containerName, enabled }: TabLogsProps) => sx={{ overflowAnchor: "none", scrollbarWidth: "auto", - scrollbarColor: "#11715b transparent", - "&::-webkit-scrollbar": { width: SCROLLBAR_SIZE, height: SCROLLBAR_SIZE }, - "&::-webkit-scrollbar-track": { background: "transparent" }, + scrollbarColor: "#11715b rgba(0,0,0,0.1)", + "&::-webkit-scrollbar": { + display: "block", + width: SCROLLBAR_SIZE, + height: SCROLLBAR_SIZE, + }, + "&::-webkit-scrollbar-track": { + background: "rgba(0,0,0,0.1)", + borderRadius: 2, + }, "&::-webkit-scrollbar-thumb": { background: "#11715b", borderRadius: 2, - border: "2px solid transparent", - backgroundClip: "padding-box", }, "&::-webkit-scrollbar-button": { display: "none" }, }}