fix(ui): set background color for UI components according to theme (#3658)

This commit is contained in:
Aram Drevekenin 2024-10-10 14:27:09 +02:00 committed by GitHub
parent ee23e96dca
commit 825ee60692
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 51 additions and 27 deletions

View file

@ -27,22 +27,32 @@ pub fn nested_list(
break;
}
let mut reset_styles_for_item = RESET_STYLES;
if line_item.text.selected {
reset_styles_for_item.background = None;
};
reset_styles_for_item.foreground = None;
let padding = line_item.indentation_level * 2 + 1;
let bulletin = if line_item.indentation_level % 2 == 0 {
"> "
} else {
"- "
};
let text_style = reset_styles_for_item.bold(Some(AnsiCode::On));
let text_style = if line_item.text.selected {
reset_styles_for_item
.bold(Some(AnsiCode::On))
.foreground(Some(style.colors.white.into()))
.background(Some(style.colors.bg.into()))
} else {
reset_styles_for_item
.bold(Some(AnsiCode::On))
.foreground(Some(style.colors.white.into()))
.background(Some(style.colors.black.into()))
};
let (mut text, text_width) = stringify_text(
&line_item.text,
Some(padding + bulletin.len()),
&coordinates,
style,
text_style,
line_item.text.selected,
);
text = pad_line(text, max_width, padding, text_width);
let go_to_row_instruction = coordinates
@ -55,23 +65,19 @@ pub fn nested_list(
"".to_owned()
}
});
if line_item.text.selected {
let selected_background = RESET_STYLES.background(Some(style.colors.bg.into()));
let line_style = if line_item.text.selected {
RESET_STYLES
.foreground(Some(style.colors.white.into()))
.background(Some(style.colors.bg.into()))
} else {
RESET_STYLES
.foreground(Some(style.colors.white.into()))
.background(Some(style.colors.black.into()))
};
stringified.push_str(&format!(
"{}{}{}{:padding$}{bulletin}{}{text}{}",
go_to_row_instruction,
selected_background,
reset_styles_for_item,
" ",
text_style,
RESET_STYLES
go_to_row_instruction, line_style, reset_styles_for_item, " ", text_style, RESET_STYLES
));
} else {
stringified.push_str(&format!(
"{}{}{:padding$}{bulletin}{}{text}{}",
go_to_row_instruction, reset_styles_for_item, " ", text_style, RESET_STYLES
));
}
}
stringified.as_bytes().to_vec()
}

View file

@ -40,7 +40,8 @@ pub fn table(
}
// here we intentionally don't pass our coordinates even if we have them, because
// these cells have already been padded and truncated
let (text, _text_width) = stringify_text(&cell, None, &None, style, text_style);
let (text, _text_width) =
stringify_text(&cell, None, &None, style, text_style, cell.selected);
stringified.push_str(&format!("{}{}{} ", text_style, text, reset_styles_for_item));
}
let next_row_instruction = coordinates

View file

@ -12,12 +12,21 @@ use unicode_width::UnicodeWidthChar;
use zellij_utils::errors::prelude::*;
pub fn text(content: Text, style: &Style, component_coordinates: Option<Coordinates>) -> Vec<u8> {
let mut text_style = RESET_STYLES.bold(Some(AnsiCode::On));
let mut text_style = RESET_STYLES
.bold(Some(AnsiCode::On))
.foreground(Some(style.colors.white.into()))
.background(Some(style.colors.black.into()));
if content.selected {
text_style = text_style.background(Some(style.colors.bg.into()));
}
let (text, _text_width) =
stringify_text(&content, None, &component_coordinates, style, text_style);
let (text, _text_width) = stringify_text(
&content,
None,
&component_coordinates,
style,
text_style,
content.selected,
);
match component_coordinates {
Some(component_coordinates) => format!("{}{}{}", component_coordinates, text_style, text)
.as_bytes()
@ -32,6 +41,7 @@ pub fn stringify_text(
coordinates: &Option<Coordinates>,
style: &Style,
text_style: CharacterStyles,
is_selected: bool,
) -> (String, usize) {
let mut text_width = 0;
let mut stringified = String::new();
@ -47,7 +57,7 @@ pub fn stringify_text(
text_width += character_width;
if !text.indices.is_empty() {
let character_with_styling =
color_index_character(character, i, &text, style, text_style);
color_index_character(character, i, &text, style, text_style, is_selected);
stringified.push_str(&character_with_styling);
} else {
stringified.push(character);
@ -62,10 +72,17 @@ pub fn color_index_character(
text: &Text,
style: &Style,
base_text_style: CharacterStyles,
is_selected: bool,
) -> String {
let character_style = text
.style_of_index(index, style)
.map(|foreground_style| base_text_style.foreground(Some(foreground_style.into())))
.map(|foreground_style| {
let mut character_style = base_text_style.foreground(Some(foreground_style.into()));
if is_selected {
character_style = character_style.background(Some(style.colors.bg.into()));
};
character_style
})
.unwrap_or(base_text_style);
format!("{}{}{}", character_style, character, base_text_style)
}

View file

@ -4,7 +4,7 @@
themes {
catppuccin-latte {
bg "#acb0be" // Surface2
fg "#acb0be" // Surface2
fg "#5c5f77" // Subtext1
red "#d20f39"
green "#40a02b"
blue "#1e66f5"