Merge branch 'develop' into fix/scroll-style

Use explicit px strings for webkit scrollbar dimensions
MUI may not convert bare numbers to px inside pseudo-element selectors; switching to template literals ensures the correct CSS value. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu
2026-09-12 16:32:10 -06:00 · 2026-09-10 00:10:26 +00:00 · 2026-09-10 00:06:45 +00:00 · 2026-09-10 00:04:44 +00:00 · 2026-09-09 23:59:24 +00:00 · 2026-09-09 23:58:23 +00:00
1 changed files with 20 additions and 1 deletions
@@ -38,6 +38,7 @@ interface TabLogsProps {

 const SCROLL_PIN_THRESHOLD_PX = 8;
 const TAIL_POLL_MS = 10_000;
+const SCROLLBAR_SIZE = 14;

 const isScrolledToBottom = (el: HTMLElement) =>
 	el.scrollHeight - el.scrollTop - el.clientHeight <= SCROLL_PIN_THRESHOLD_PX;
@@ -213,7 +214,25 @@ export const TabLogs = ({ monitorId, containerName, enabled }: TabLogsProps) =>
 				maxHeight="50vh"
 				overflow="auto"
 				padding={LAYOUT.MD}
-				sx={{ overflowAnchor: "none" }}
+				sx={{
+					overflowAnchor: "none",
+					scrollbarWidth: "auto",
+					scrollbarColor: "#11715b rgba(0,0,0,0.15)",
+					"&::-webkit-scrollbar": {
+						display: "block",
+						width: `${SCROLLBAR_SIZE}px`,
+						height: `${SCROLLBAR_SIZE}px`,
+					},
+					"&::-webkit-scrollbar-track": {
+						background: "rgba(0,0,0,0.15)",
+						borderRadius: "2px",
+					},
+					"&::-webkit-scrollbar-thumb": {
+						background: "#11715b",
+						borderRadius: "2px",
+					},
+					"&::-webkit-scrollbar-button": { display: "none" },
+				}}
 			>
 				{rows.length > 0 && (
 					<Stack
Author	SHA1	Message	Date
Malena Aguiar	21913ba053	Merge branch 'develop' into fix/scroll-style	2026-09-12 16:32:10 -06:00
Claude	eeed7dfa5e	Use explicit px strings for webkit scrollbar dimensions MUI may not convert bare numbers to px inside pseudo-element selectors; switching to template literals ensures the correct CSS value. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu	2026-09-10 00:10:26 +00:00
Claude	14eac9f1c5	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	2026-09-10 00:06:45 +00:00
Claude	84f7a6e512	Style scrollbar like VS Code: no arrows, clean thumb with padding Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu	2026-09-10 00:04:44 +00:00
Claude	c1b830e2da	Increase SCROLLBAR_SIZE to 16px Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu	2026-09-09 23:59:24 +00:00
Claude	734ebd3dfd	Extract SCROLLBAR_SIZE constant and increase to 10px Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu	2026-09-09 23:58:23 +00:00
Claude	ff79c41195	Apply scrollbar style: #11715b color, 8px thickness, visible arrows Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FGiX1wXCY5UtSrmoKBhDQu	2026-09-09 23:53:40 +00:00
Malena Aguiar	7ed0b3dc92	(fix): scroll style	2026-09-08 17:41:32 -06:00