From 8eb7c3cff463a6b4383cb5107063d35b44369f70 Mon Sep 17 00:00:00 2001 From: Wez Furlong Date: Fri, 24 Dec 2021 16:23:01 -0700 Subject: [PATCH] gui: fancy tab bars are now the default Adjust the rendering and coloring a bit to make the defaults look pretty reasonable. refs: #1180 --- config/src/color.rs | 36 +++++++++++---- config/src/lib.rs | 9 +++- docs/changelog.md | 1 + wezterm-gui/src/termwindow/mod.rs | 2 +- wezterm-gui/src/termwindow/mouseevent.rs | 4 +- wezterm-gui/src/termwindow/render.rs | 58 +++++++++++++----------- 6 files changed, 70 insertions(+), 40 deletions(-) diff --git a/config/src/color.rs b/config/src/color.rs index 96567fa64..4c51eb793 100644 --- a/config/src/color.rs +++ b/config/src/color.rs @@ -179,23 +179,37 @@ pub struct TabBarColors { /// Styling for the new tab button with a mouse hovering #[serde(default = "default_inactive_tab_hover")] pub new_tab_hover: TabBarColor, + + #[serde(default = "default_inactive_tab_edge")] + pub inactive_tab_edge: RgbColor, + + #[serde(default = "default_inactive_tab_edge_hover")] + pub inactive_tab_edge_hover: RgbColor, } impl_lua_conversion!(TabBarColors); fn default_background() -> RgbColor { - RgbColor::new_8bpc(0x0b, 0x00, 0x22) + RgbColor::new_8bpc(0x33, 0x33, 0x33) +} + +fn default_inactive_tab_edge() -> RgbColor { + RgbColor::new_8bpc(0x57, 0x57, 0x57) +} + +fn default_inactive_tab_edge_hover() -> RgbColor { + RgbColor::new_8bpc(0x36, 0x36, 0x36) } fn default_inactive_tab() -> TabBarColor { TabBarColor { - bg_color: RgbColor::new_8bpc(0x1b, 0x10, 0x32), + bg_color: RgbColor::new_8bpc(0x33, 0x33, 0x33), fg_color: RgbColor::new_8bpc(0x80, 0x80, 0x80), ..TabBarColor::default() } } fn default_inactive_tab_hover() -> TabBarColor { TabBarColor { - bg_color: RgbColor::new_8bpc(0x3b, 0x30, 0x52), + bg_color: RgbColor::new_8bpc(0x1f, 0x1f, 0x1f), fg_color: RgbColor::new_8bpc(0x90, 0x90, 0x90), italic: true, ..TabBarColor::default() @@ -203,7 +217,7 @@ fn default_inactive_tab_hover() -> TabBarColor { } fn default_active_tab() -> TabBarColor { TabBarColor { - bg_color: RgbColor::new_8bpc(0x2b, 0x20, 0x42), + bg_color: RgbColor::new_8bpc(0x00, 0x00, 0x00), fg_color: RgbColor::new_8bpc(0xc0, 0xc0, 0xc0), ..TabBarColor::default() } @@ -218,6 +232,8 @@ impl Default for TabBarColors { active_tab: default_active_tab(), new_tab: default_inactive_tab(), new_tab_hover: default_inactive_tab_hover(), + inactive_tab_edge: default_inactive_tab_edge(), + inactive_tab_edge_hover: default_inactive_tab_edge_hover(), } } } @@ -273,7 +289,7 @@ pub struct WindowFrameConfig { } fn default_title_font_size() -> f64 { - 12. + 9. } fn default_title_font() -> TextStyle { @@ -295,7 +311,7 @@ fn default_title_font() -> TextStyle { // It's close enough for me! bold("Galvji") } else if cfg!(windows) { - bold("Segoe UI") + FontAttributes::new("Segoe UI") } else { bold("Cantarell") }]; @@ -330,11 +346,11 @@ impl Default for WindowFrameConfig { } fn default_inactive_titlebar_bg() -> RgbColor { - RgbColor::new_8bpc(0x35, 0x35, 0x35) + RgbColor::new_8bpc(0x33, 0x33, 0x33) } fn default_active_titlebar_bg() -> RgbColor { - RgbColor::new_8bpc(0x29, 0x29, 0x29) + RgbColor::new_8bpc(0x33, 0x33, 0x33) } fn default_inactive_titlebar_fg() -> RgbColor { @@ -362,11 +378,11 @@ fn default_button_fg() -> RgbColor { } fn default_button_hover_bg() -> RgbColor { - RgbColor::new_8bpc(0x3b, 0x30, 0x52) + RgbColor::new_8bpc(0x1f, 0x1f, 0x1f) } fn default_button_bg() -> RgbColor { - RgbColor::new_8bpc(0x2b, 0x20, 0x42) + RgbColor::new_8bpc(0x33, 0x33, 0x33) } #[derive(Debug, Deserialize, Serialize, Clone)] diff --git a/config/src/lib.rs b/config/src/lib.rs index 20ca93c14..513f2f4a6 100644 --- a/config/src/lib.rs +++ b/config/src/lib.rs @@ -988,7 +988,7 @@ pub struct Config { /// active tab. Clicking on a tab activates it. #[serde(default = "default_true")] pub enable_tab_bar: bool, - #[serde(default)] + #[serde(default = "default_true")] pub use_fancy_tab_bar: bool, #[serde(default)] @@ -1598,6 +1598,13 @@ impl Config { Self::default().compute_extra_defaults(None) } + /// Compute effective value of tab_bar_at_bottom. + /// If use_fancy_tab_bar is enabled, we cannot put the tab bar at + /// the bottom. + pub fn tab_bar_at_bottom(&self) -> bool { + self.tab_bar_at_bottom && !self.use_fancy_tab_bar + } + pub fn key_bindings(&self) -> HashMap<(KeyCode, Modifiers), KeyAssignment> { let mut map = HashMap::new(); diff --git a/docs/changelog.md b/docs/changelog.md index 6adfd1437..cbabd592c 100644 --- a/docs/changelog.md +++ b/docs/changelog.md @@ -13,6 +13,7 @@ As features stabilize some brief notes about them will accumulate here. #### New +* Fancy Tab Bars are now the default. The default tab bar colors have changed to accommodate the new more native look. They are not compatible with `tab_bar_at_bottom`. You can turn them off by setting `use_fancy_tab_bar = false`. * Support for the [Kitty Image Protocol](https://sw.kovidgoyal.net/kitty/graphics-protocol/) is now enabled by default. Most of the protocol is supported; animation support is not yet implemented. Try the amazing [notcurses](https://notcurses.com/) if you want to see what modern terminal graphics can do! [#986](https://github.com/wez/wezterm/issues/986) * unix domains now support an optional `proxy_command` to use in place of a direct unix socket connection. [Read more about multiplexing unix domains](multiplexing.html#unix-domains) * [ScrollToTop](config/lua/keyassignment/ScrollToTop.md) and [ScrollToBottom](config/lua/keyassignment/ScrollToBottom.md) key assignments [#1360](https://github.com/wez/wezterm/issues/1360) diff --git a/wezterm-gui/src/termwindow/mod.rs b/wezterm-gui/src/termwindow/mod.rs index 580445446..88797ff8c 100644 --- a/wezterm-gui/src/termwindow/mod.rs +++ b/wezterm-gui/src/termwindow/mod.rs @@ -1371,7 +1371,7 @@ impl TermWindow { .bottom .evaluate_as_pixels(v_context) as u16; - let tab_bar_y = if self.config.tab_bar_at_bottom { + let tab_bar_y = if self.config.tab_bar_at_bottom() { let avail_height = self .dimensions .pixel_height diff --git a/wezterm-gui/src/termwindow/mouseevent.rs b/wezterm-gui/src/termwindow/mouseevent.rs index 0bbe423ed..eced81e7a 100644 --- a/wezterm-gui/src/termwindow/mouseevent.rs +++ b/wezterm-gui/src/termwindow/mouseevent.rs @@ -57,7 +57,7 @@ impl super::TermWindow { self.current_mouse_event.replace(event.clone()); - let first_line_offset = if self.show_tab_bar && !self.config.tab_bar_at_bottom { + let first_line_offset = if self.show_tab_bar && !self.config.tab_bar_at_bottom() { self.tab_bar_pixel_height().unwrap_or(0.) as isize } else { 0 @@ -235,7 +235,7 @@ impl super::TermWindow { current_viewport, &self.dimensions, self.tab_bar_pixel_height().unwrap_or(0.), - self.config.tab_bar_at_bottom, + self.config.tab_bar_at_bottom(), ); self.set_viewport(pane.pane_id(), Some(row), dims); context.invalidate(); diff --git a/wezterm-gui/src/termwindow/render.rs b/wezterm-gui/src/termwindow/render.rs index 0abe783ae..59be8ec14 100644 --- a/wezterm-gui/src/termwindow/render.rs +++ b/wezterm-gui/src/termwindow/render.rs @@ -536,7 +536,15 @@ impl super::TermWindow { metrics.cell_width.get() as isize / 2, metrics.cell_height.get() as isize / 4, ); - // log::info!("shaped tab bounds {:?}, text bounds {:?}", tab_bounding_rect, text_bounding_rect); + let tab_bounding_rect = euclid::rect( + tab_bounding_rect.min_x(), + tab_bounding_rect.min_y(), + tab_bounding_rect.width(), + tab_bounding_rect + .max_y() + .min(metrics.cell_height.get() as isize * 2) + - tab_bounding_rect.min_y(), + ); match item.item { TabBarItem::Tab { active, .. } => { @@ -598,14 +606,28 @@ impl super::TermWindow { 1, (metrics.cell_height.get() * 0.75) as isize, ), - rgbcolor_to_window_color(if self.focused.is_some() { - self.config.window_frame.active_titlebar_bg + rgbcolor_to_window_color(if hover { + colors.inactive_tab_edge_hover } else { - self.config.window_frame.inactive_titlebar_bg + colors.inactive_tab_edge }), )?; } + if hover || active { + // Overwrite any prior dividing line with the hover color + self.filled_rectangle( + &mut layers[1], + euclid::rect( + tab_bounding_rect.min_x().saturating_sub(1), + text_bounding_rect.min_y() + metrics.cell_height.get() as isize / 3, + 1, + (metrics.cell_height.get() * 0.75) as isize, + ), + rgbcolor_to_window_color(colors.inactive_tab_edge_hover), + )?; + } + Ok(( tab_bounding_rect.max_x() as f32, UIItem { @@ -622,7 +644,7 @@ impl super::TermWindow { text_bounding_rect.min_x(), text_bounding_rect.min_y(), width, - metrics.cell_height.get() as isize, + tab_bounding_rect.max_y() - text_bounding_rect.min_y(), ); let tab_bounding_rect = text_bounding_rect; @@ -839,7 +861,7 @@ impl super::TermWindow { ui_items.push(item); } - let mut x = 0.; + let mut x = metrics.cell_width.get() as f32 * 0.25; for item in items.iter() { if matches!(item.item, TabBarItem::None) { // Already handled this one @@ -859,22 +881,6 @@ impl super::TermWindow { ui_items.push(item); } - // Dividing line that is logically part of the active tab - self.filled_rectangle( - &mut layers[1], - Rect::new( - Point::new( - 0, - (metrics.cell_height.get() as f32 * 1.75).floor() as isize, - ), - Size::new( - self.dimensions.pixel_width as isize, - (metrics.cell_height.get() as f32 * 0.25) as isize, - ), - ), - rgbcolor_to_window_color(colors.active_tab.bg_color), - )?; - Ok(ui_items) } @@ -887,7 +893,7 @@ impl super::TermWindow { } let tab_bar_height = self.tab_bar_pixel_height()?; - let tab_bar_y = if self.config.tab_bar_at_bottom { + let tab_bar_y = if self.config.tab_bar_at_bottom() { ((self.dimensions.pixel_height as f32) - tab_bar_height).max(0.) } else { 0. @@ -994,7 +1000,7 @@ impl super::TermWindow { let (padding_left, padding_top) = self.padding_left_top(); - let tab_bar_height = if self.show_tab_bar && !self.config.tab_bar_at_bottom { + let tab_bar_height = if self.show_tab_bar && !self.config.tab_bar_at_bottom() { self.tab_bar_pixel_height()? } else { 0. @@ -1264,7 +1270,7 @@ impl super::TermWindow { current_viewport, &self.dimensions, tab_bar_height, - config.tab_bar_at_bottom, + config.tab_bar_at_bottom(), ); let thumb_top = info.top as f32; let thumb_size = info.height as f32; @@ -1510,7 +1516,7 @@ impl super::TermWindow { let cell_width = self.render_metrics.cell_size.width as f32; let cell_height = self.render_metrics.cell_size.height as f32; - let first_row_offset = if self.show_tab_bar && !self.config.tab_bar_at_bottom { + let first_row_offset = if self.show_tab_bar && !self.config.tab_bar_at_bottom() { self.tab_bar_pixel_height()? } else { 0.