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 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu
This commit is contained in:
1 file changed
+10
-5
@@ -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" },
|
||||
}}
|
||||
|
||||
Reference in new issue
Block a user