From f1428fea4ebfe4da1479153a01291486b41a4861 Mon Sep 17 00:00:00 2001 From: Andrew Lygin Date: Mon, 8 Apr 2024 20:32:09 +0300 Subject: [PATCH] Make scrollbar a bit wider (#10248) At the moment, the editor scrollbar is 12px wide. One pixel is allocated for the left border, so we have 11 pixels to display markers. It's not enough to make three even marker columns (git, highlights, diagnostics) that fully fill the scrollbar, so the current implementation allocates 3 pixels to each column. As the result, we have 2 spare pixels on the right (before #10080 they were occupied by the diagnostics column). Making the scrollbar just one pixel wider allows us to give one additional pixel to each marker column and make markers more pronounced ("as is" on the left, "to be" on the right): zed-scrollbar-markers-1px Other options: - Remove scrollbar thumb border. That'll give us one missing pixel to make markers wide and even. I, personally, prefer this option, but themes now have `scrollbar.thumb.border` colors that differ from `scrollbar.thumb.background` for some reason. This theme setting becomes deprecated in this case. For the reference: VS Code doesn't have scrollbar slider borders, IntelliJ IDEA does have them. - Don't try to make markers evenly wide. For instance, IntelliJ uses very narrow git-diff markers that are separated from other markers. But it requires much wider scrollbar (it's 20px in IDEA). - Use the spare two pixels to make diagnostic markers wider (it's the pre #10080 approach), or split them between the highlight and diagnostic markers (have 3px+4px+4px marker columns). - Do nothing. It leaves us with two unused pixels :( Release Notes: - N/A Related Issues: - The previous discussion: https://github.com/zed-industries/zed/pull/9080#issuecomment-1997979968 --- crates/editor/src/editor.rs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/crates/editor/src/editor.rs b/crates/editor/src/editor.rs index 0005a8fc02803926a6aa15e239ef23e46e5df791..3aee72778c3ea9d5b55dd073f28e2f2e2f396771 100644 --- a/crates/editor/src/editor.rs +++ b/crates/editor/src/editor.rs @@ -10200,7 +10200,7 @@ impl Render for Editor { background, local_player: cx.theme().players().local(), text: text_style, - scrollbar_width: px(12.), + scrollbar_width: px(13.), syntax: cx.theme().syntax().clone(), status: cx.theme().status().clone(), inlay_hints_style: HighlightStyle {