Looks better now
This commit is contained in:
@@ -9,6 +9,9 @@ use crate::app::App;
|
||||
use crate::state::{DeviceKind, EngineSection, SettingKind};
|
||||
use crate::widgets::{Orientation, Scope, Spectrum};
|
||||
|
||||
const HEADER_COLOR: Color = Color::Rgb(100, 160, 180);
|
||||
const DIVIDER_COLOR: Color = Color::Rgb(60, 65, 70);
|
||||
|
||||
pub fn render(frame: &mut Frame, app: &App, area: Rect) {
|
||||
let [left_col, _, right_col] = Layout::horizontal([
|
||||
Constraint::Percentage(55),
|
||||
@@ -42,9 +45,9 @@ fn render_settings_section(frame: &mut Frame, app: &App, area: Rect) {
|
||||
let [devices_area, _, settings_area, _, samples_area] = Layout::vertical([
|
||||
Constraint::Length(devices_height),
|
||||
Constraint::Length(1),
|
||||
Constraint::Length(6),
|
||||
Constraint::Length(7),
|
||||
Constraint::Length(1),
|
||||
Constraint::Min(5),
|
||||
Constraint::Min(6),
|
||||
])
|
||||
.areas(padded);
|
||||
|
||||
@@ -109,23 +112,39 @@ fn list_height(item_count: usize) -> u16 {
|
||||
fn devices_section_height(app: &App) -> u16 {
|
||||
let output_h = list_height(app.audio.output_devices.len());
|
||||
let input_h = list_height(app.audio.input_devices.len());
|
||||
2 + output_h.max(input_h)
|
||||
3 + output_h.max(input_h)
|
||||
}
|
||||
|
||||
fn render_section_header(frame: &mut Frame, title: &str, focused: bool, area: Rect) {
|
||||
let [header_area, divider_area] = Layout::vertical([
|
||||
Constraint::Length(1),
|
||||
Constraint::Length(1),
|
||||
]).areas(area);
|
||||
|
||||
let header_style = if focused {
|
||||
Style::new().fg(Color::Yellow).add_modifier(Modifier::BOLD)
|
||||
} else {
|
||||
Style::new().fg(HEADER_COLOR).add_modifier(Modifier::BOLD)
|
||||
};
|
||||
|
||||
frame.render_widget(Paragraph::new(title).style(header_style), header_area);
|
||||
|
||||
let divider = "─".repeat(area.width as usize);
|
||||
frame.render_widget(
|
||||
Paragraph::new(divider).style(Style::new().fg(DIVIDER_COLOR)),
|
||||
divider_area,
|
||||
);
|
||||
}
|
||||
|
||||
fn render_devices(frame: &mut Frame, app: &App, area: Rect) {
|
||||
let section_focused = app.audio.section == EngineSection::Devices;
|
||||
let header_style = if section_focused {
|
||||
Style::new().fg(Color::Yellow).add_modifier(Modifier::BOLD)
|
||||
} else {
|
||||
Style::new().fg(Color::Rgb(100, 160, 180)).add_modifier(Modifier::BOLD)
|
||||
};
|
||||
|
||||
let [header_area, content_area] = Layout::vertical([
|
||||
Constraint::Length(1),
|
||||
Constraint::Length(2),
|
||||
Constraint::Min(1),
|
||||
]).areas(area);
|
||||
|
||||
frame.render_widget(Paragraph::new("Devices").style(header_style), header_area);
|
||||
render_section_header(frame, "DEVICES", section_focused, header_area);
|
||||
|
||||
let [output_col, separator, input_col] = Layout::horizontal([
|
||||
Constraint::Percentage(48),
|
||||
@@ -206,16 +225,11 @@ fn render_device_column(
|
||||
|
||||
fn render_settings(frame: &mut Frame, app: &App, area: Rect) {
|
||||
let section_focused = app.audio.section == EngineSection::Settings;
|
||||
let header_style = if section_focused {
|
||||
Style::new().fg(Color::Yellow).add_modifier(Modifier::BOLD)
|
||||
} else {
|
||||
Style::new().fg(Color::Rgb(100, 160, 180)).add_modifier(Modifier::BOLD)
|
||||
};
|
||||
|
||||
let [header_area, content_area] =
|
||||
Layout::vertical([Constraint::Length(1), Constraint::Min(1)]).areas(area);
|
||||
Layout::vertical([Constraint::Length(2), Constraint::Min(1)]).areas(area);
|
||||
|
||||
frame.render_widget(Paragraph::new("Settings").style(header_style), header_area);
|
||||
render_section_header(frame, "SETTINGS", section_focused, header_area);
|
||||
|
||||
let highlight = Style::new().fg(Color::Yellow).add_modifier(Modifier::BOLD);
|
||||
let normal = Style::new().fg(Color::White);
|
||||
@@ -269,14 +283,9 @@ fn render_settings(frame: &mut Frame, app: &App, area: Rect) {
|
||||
|
||||
fn render_samples(frame: &mut Frame, app: &App, area: Rect) {
|
||||
let section_focused = app.audio.section == EngineSection::Samples;
|
||||
let header_style = if section_focused {
|
||||
Style::new().fg(Color::Yellow).add_modifier(Modifier::BOLD)
|
||||
} else {
|
||||
Style::new().fg(Color::Rgb(100, 160, 180)).add_modifier(Modifier::BOLD)
|
||||
};
|
||||
|
||||
let [header_area, content_area, _, hint_area] = Layout::vertical([
|
||||
Constraint::Length(1),
|
||||
Constraint::Length(2),
|
||||
Constraint::Min(1),
|
||||
Constraint::Length(1),
|
||||
Constraint::Length(1),
|
||||
@@ -285,8 +294,8 @@ fn render_samples(frame: &mut Frame, app: &App, area: Rect) {
|
||||
|
||||
let path_count = app.audio.config.sample_paths.len();
|
||||
let sample_count = app.audio.config.sample_count;
|
||||
let header_text = format!("Samples {path_count} paths · {sample_count} indexed");
|
||||
frame.render_widget(Paragraph::new(header_text).style(header_style), header_area);
|
||||
let header_text = format!("SAMPLES {path_count} paths · {sample_count} indexed");
|
||||
render_section_header(frame, &header_text, section_focused, header_area);
|
||||
|
||||
let dim = Style::new().fg(Color::Rgb(80, 85, 95));
|
||||
let path_style = Style::new().fg(Color::Rgb(120, 125, 135));
|
||||
|
||||
Reference in New Issue
Block a user