diff --git a/desktop/src/features/sidebar/ui/SidebarSection.tsx b/desktop/src/features/sidebar/ui/SidebarSection.tsx
index bb147384075..10b854239ee 100644
--- a/desktop/src/features/sidebar/ui/SidebarSection.tsx
+++ b/desktop/src/features/sidebar/ui/SidebarSection.tsx
@@ -297,7 +297,6 @@ export function ChannelMenuButton({
data-testid={`channel-${channel.name}`}
isActive={isActive}
onClick={() => onSelectChannel(channel.id)}
- tooltip={resolvedLabel}
type="button"
>
);
}
+ if (isPending) return null;
}
// Native glyph, or an unknown shortcode we can't resolve — render as text.
diff --git a/desktop/src/shared/styles/globals/scrollbars.css b/desktop/src/shared/styles/globals/scrollbars.css
index 3d6fa154022..897270c9d8e 100644
--- a/desktop/src/shared/styles/globals/scrollbars.css
+++ b/desktop/src/shared/styles/globals/scrollbars.css
@@ -3,16 +3,12 @@
}
.buzz-sidebar-scrollbar:hover {
- scrollbar-color: var(
- --buzz-sidebar-scrollbar-thumb,
- hsl(var(--sidebar-border) / 0.8)
- )
- transparent;
+ scrollbar-color: hsl(var(--foreground) / 0.2) transparent;
}
.buzz-sidebar-scrollbar::-webkit-scrollbar {
- height: 10px;
- width: 10px;
+ height: 8px;
+ width: 8px;
}
.buzz-sidebar-scrollbar::-webkit-scrollbar-track {
@@ -20,17 +16,35 @@
}
.buzz-sidebar-scrollbar::-webkit-scrollbar-thumb {
- background-clip: content-box;
+ background-clip: padding-box;
background-color: transparent;
- border: 3px solid transparent;
+ border: 2px solid transparent;
border-radius: 999px;
}
.buzz-sidebar-scrollbar:hover::-webkit-scrollbar-thumb {
- background-color: var(
- --buzz-sidebar-scrollbar-thumb,
- hsl(var(--sidebar-border) / 0.8)
- );
+ background-color: hsl(var(--foreground) / 0.2);
+}
+
+[data-buzz-conversation-scroll] {
+ scrollbar-color: hsl(var(--foreground) / 0.2) transparent;
+ scrollbar-width: thin;
+}
+
+[data-buzz-conversation-scroll]::-webkit-scrollbar {
+ height: 8px;
+ width: 8px;
+}
+
+[data-buzz-conversation-scroll]::-webkit-scrollbar-track {
+ background: transparent;
+}
+
+[data-buzz-conversation-scroll]::-webkit-scrollbar-thumb {
+ background-clip: padding-box;
+ background-color: hsl(var(--foreground) / 0.2);
+ border: 2px solid transparent;
+ border-radius: 999px;
}
/* Channel activity keeps its chrome outside the scrolling surface. The slim,
diff --git a/desktop/src/shared/styles/globals/theme.css b/desktop/src/shared/styles/globals/theme.css
index 644181a3881..d31eb419955 100644
--- a/desktop/src/shared/styles/globals/theme.css
+++ b/desktop/src/shared/styles/globals/theme.css
@@ -141,6 +141,12 @@
overscroll-behavior: none;
}
+ html[data-sidebar-resizing="true"],
+ html[data-sidebar-resizing="true"] * {
+ /* biome-ignore lint/complexity/noImportantStyles: an active drag must override descendant cursor utilities */
+ cursor: col-resize !important;
+ }
+
mark {
background-color: transparent;
color: inherit;
diff --git a/desktop/src/shared/ui/sidebar.tsx b/desktop/src/shared/ui/sidebar.tsx
index d382bb07bf7..c69081a9e01 100644
--- a/desktop/src/shared/ui/sidebar.tsx
+++ b/desktop/src/shared/ui/sidebar.tsx
@@ -218,6 +218,15 @@ const SidebarProvider = React.forwardRef<
return () => window.removeEventListener("keydown", handleKeyDown);
}, [toggleSidebar]);
+ React.useEffect(() => {
+ if (!isResizing) return;
+
+ document.documentElement.dataset.sidebarResizing = "true";
+ return () => {
+ delete document.documentElement.dataset.sidebarResizing;
+ };
+ }, [isResizing]);
+
// Expose semantic state so Tailwind descendants can style both modes.
const state = open ? "expanded" : "collapsed";
const contextValue = React.useMemo(
@@ -425,6 +434,7 @@ const SidebarRail = React.forwardRef<
(
{
className,
+ onDoubleClick,
onPointerCancel,
onPointerDown,
onPointerMove,
@@ -471,92 +481,106 @@ const SidebarRail = React.forwardRef<
);
return (
-