feat(chat): thicker, grabbable scrollbar for the message thread
The chat message thread used the global 6px scrollbar with a ~6% grab, which is thin and hard to grab. Push a 12px scrollbar with a clearly-visible, theme-adaptive grab (OnSurface at 55/95/135 alpha for idle/hover/active) for the ##ChatMessages child only, popped after EndChild. No change to the global scrollbar or other scroll regions. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -1487,6 +1487,13 @@ void RenderChatTab(App* app)
|
||||
const float origSpacingX = ImGui::GetStyle().ItemSpacing.x;
|
||||
ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(4.0f * dp, 8.0f * dp));
|
||||
ImGui::PushStyleVar(ImGuiStyleVar_ItemSpacing, ImVec2(origSpacingX, 0.0f));
|
||||
// Thicker, clearly-visible scrollbar for the message thread: the global one is a thin 6px with a
|
||||
// ~6% grab that's hard to see and grab. Pushed for this child only (popped after EndChild below).
|
||||
ImGui::PushStyleVar(ImGuiStyleVar_ScrollbarSize, 12.0f * dp);
|
||||
ImGui::PushStyleVar(ImGuiStyleVar_ScrollbarRounding, 6.0f * dp);
|
||||
ImGui::PushStyleColor(ImGuiCol_ScrollbarGrab, material::WithAlpha(material::OnSurface(), 55));
|
||||
ImGui::PushStyleColor(ImGuiCol_ScrollbarGrabHovered, material::WithAlpha(material::OnSurface(), 95));
|
||||
ImGui::PushStyleColor(ImGuiCol_ScrollbarGrabActive, material::WithAlpha(material::OnSurface(), 135));
|
||||
ImGui::BeginChild("##ChatMessages", ImVec2(0, ImGui::GetContentRegionAvail().y),
|
||||
ImGuiChildFlags_AlwaysUseWindowPadding, ImGuiWindowFlags_NoScrollWithMouse);
|
||||
material::ApplySmoothScroll(); // smooth wheel scroll; syncs with the auto-scroll-to-bottom below
|
||||
@@ -1951,7 +1958,8 @@ void RenderChatTab(App* app)
|
||||
}
|
||||
}
|
||||
ImGui::EndChild();
|
||||
ImGui::PopStyleVar(2); // ##ChatMessages WindowPadding + zeroed vertical ItemSpacing
|
||||
ImGui::PopStyleColor(3); // ScrollbarGrab + Hovered + Active
|
||||
ImGui::PopStyleVar(4); // WindowPadding + ItemSpacing + ScrollbarSize + ScrollbarRounding
|
||||
// Larger-messages tier 3: while a big incoming message is still arriving across transactions,
|
||||
// show a subtle centred progress line (it surfaces as an ordinary bubble once every part lands).
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user