From 793523b0a75ffa07c126e26f91d4b5ea06c07c5b Mon Sep 17 00:00:00 2001 From: "Geoffrey D. Bennett" Date: Sun, 21 Jan 2024 17:27:20 +1030 Subject: [PATCH] Add some red and grey --- src/alsa-scarlett-gui.css | 68 +++++++++++++++++++++++++++------- src/iface-mixer.c | 77 ++++++++++++++++++++++++--------------- src/iface-no-mixer.c | 42 +++++++++++++-------- src/widget-gain.c | 2 + src/window-levels.c | 7 +++- src/window-mixer.c | 7 +++- src/window-routing.c | 10 +++-- src/window-startup.c | 16 +++++++- 8 files changed, 163 insertions(+), 66 deletions(-) diff --git a/src/alsa-scarlett-gui.css b/src/alsa-scarlett-gui.css index 5d1d8e7..7d847c8 100644 --- a/src/alsa-scarlett-gui.css +++ b/src/alsa-scarlett-gui.css @@ -1,52 +1,84 @@ -.window-content { +/* Top-level window frame */ +.window-frame { background: black; color: white; padding: 15px; + border-radius: 0px; + border: none; } -.routing-group { - background: #181818; - padding: 5px; - border: 1px solid #303030; +/* Top-level window content */ +.window-content { + padding: 15px; + border: 2px solid #800000; + border-radius: 20px; +} + +/* Label above controls-content */ +.controls-label { + font-size: smaller; + margin-top: -4px; +} + +/* controls-content boxes */ +.controls-content { + background: #141414; + padding: 10px; + border: 1px solid #a00000; border-radius: 5px; color: #d0d0d0; } +/* Tighten up routing groups and make the background a little lighter */ +.window-routing .controls-content { + background: #181818; + padding: 5px; +} + +/* Used when the controls content is at the top level */ +.top-level-content { + background: #141414; +} + .route-label { font-size: smaller; border-radius: 3px; } .route-label:hover { - background: @theme_selected_bg_color; - outline: 2px solid @theme_selected_bg_color; + background: #801010; + outline: 2px solid #801010; } .route-label:drop(active) { box-shadow: none; - background: @theme_selected_bg_color; + background: #801010; } button { padding: 0px 5px 0px 5px; - border: 1px solid #181818; - background: linear-gradient(175deg, #101010, #181818); + border: 1px solid #303030; + background: linear-gradient(175deg, #202020, #282828); box-shadow: none; font-weight: bold; color: #808080; } +button:focus:focus-visible { + outline-color: #801010; +} + button:checked { color: #ffffff; - border: 1px solid #202020; + border: 1px solid #404040; } button:hover { - background: #202020; + background: #303030; } button:disabled { - background: #000000; + background: #202020; color: #505050; } @@ -142,3 +174,13 @@ button.direct-monitor.selected-stereo > label { color: #ffffff; text-shadow: 0 0 5px #00c000, 0 0 15px #00c000; } + +/* Bigger buttons in the startup window */ +.window-startup button { + padding: 5px; +} + +/* Separators */ +.window-frame separator { + background: #800000; +} diff --git a/src/iface-mixer.c b/src/iface-mixer.c index 44012e2..119023a 100644 --- a/src/iface-mixer.c +++ b/src/iface-mixer.c @@ -172,14 +172,20 @@ static void add_talkback_controls( } static GtkWidget *create_global_box(GtkWidget *grid, int *x, int orient) { - GtkWidget *label = gtk_label_new("Global"); - GtkWidget *sep = gtk_separator_new(GTK_ORIENTATION_HORIZONTAL); - GtkWidget *controls = gtk_box_new(orient, 15); - gtk_widget_set_margin(controls, 10); + GtkWidget *box = gtk_box_new(GTK_ORIENTATION_VERTICAL, 5); + gtk_widget_set_vexpand(box, TRUE); - gtk_grid_attach(GTK_GRID(grid), label, *x, 0, 1, 1); - gtk_grid_attach(GTK_GRID(grid), sep, *x, 1, 1, 1); - gtk_grid_attach(GTK_GRID(grid), controls, *x, 2, 1, 1); + GtkWidget *label = gtk_label_new("Global"); + gtk_widget_add_css_class(label, "controls-label"); + gtk_widget_set_halign(label, GTK_ALIGN_START); + GtkWidget *controls = gtk_box_new(orient, 15); + gtk_widget_add_css_class(controls, "controls-content"); + gtk_widget_set_vexpand(controls, TRUE); + + gtk_box_append(GTK_BOX(box), label); + gtk_box_append(GTK_BOX(box), controls); + + gtk_grid_attach(GTK_GRID(grid), box, *x, 0, 1, 1); (*x)++; @@ -194,6 +200,7 @@ static void create_input_link_control( ) { GtkWidget *w = make_boolean_alsa_elem(elem, "Link", NULL); gtk_widget_add_css_class(w, "input-link"); + gtk_widget_set_hexpand(w, TRUE); int from, to; get_two_num_from_string(elem->name, &from, &to); @@ -222,6 +229,7 @@ static void create_input_autogain_control( ) { GtkWidget *w = make_boolean_alsa_elem(elem, "Autogain", NULL); gtk_widget_add_css_class(w, "autogain"); + gtk_widget_set_hexpand(w, TRUE); gtk_widget_set_tooltip_text( w, "Autogain will listen to the input signal for 10 seconds and " @@ -251,6 +259,7 @@ static void create_input_safe_control( ) { GtkWidget *w = make_boolean_alsa_elem(elem, "Safe", NULL); gtk_widget_add_css_class(w, "safe"); + gtk_widget_set_hexpand(w, TRUE); gtk_widget_set_tooltip_text( w, "Enabling Safe Mode prevents the input from clipping by " @@ -268,6 +277,7 @@ static void create_input_level_control( ) { GtkWidget *w = make_boolean_alsa_elem(elem, "Inst", NULL); gtk_widget_add_css_class(w, "inst"); + gtk_widget_set_hexpand(w, TRUE); gtk_widget_set_tooltip_text(w, level_descr); gtk_grid_attach(GTK_GRID(grid), w, column_num, current_row, 1, 1); @@ -281,6 +291,7 @@ static void create_input_air_switch_control( ) { GtkWidget *w = make_boolean_alsa_elem(elem, "Air", NULL); gtk_widget_add_css_class(w, "air"); + gtk_widget_set_hexpand(w, TRUE); gtk_widget_set_tooltip_text(w, air_descr); gtk_grid_attach(GTK_GRID(grid), w, column_num, current_row, 1, 1); @@ -294,6 +305,7 @@ static void create_input_air_enum_control( ) { GtkWidget *w = make_drop_down_alsa_elem(elem, "Air"); gtk_widget_add_css_class(w, "air"); + gtk_widget_set_hexpand(w, TRUE); gtk_widget_set_tooltip_text(w, air_descr); gtk_grid_attach(GTK_GRID(grid), w, column_num, current_row, 1, 1); @@ -307,6 +319,7 @@ static void create_input_pad_control( ) { GtkWidget *w = make_boolean_alsa_elem(elem, "Pad", NULL); gtk_widget_add_css_class(w, "pad"); + gtk_widget_set_hexpand(w, TRUE); gtk_widget_set_tooltip_text( w, "Enabling Pad engages a 10dB attenuator in the channel, giving " @@ -324,6 +337,7 @@ static void create_input_phantom_control( ) { GtkWidget *w = make_boolean_alsa_elem(elem, "48V", NULL); gtk_widget_add_css_class(w, "phantom"); + gtk_widget_set_hexpand(w, TRUE); gtk_widget_set_tooltip_text(w, phantom_descr); int from, to; @@ -385,19 +399,22 @@ static void create_input_controls( struct alsa_elem *input_select_elem = get_elem_by_name(elems, "Input Select Capture Enum"); - GtkWidget *sep = gtk_separator_new(GTK_ORIENTATION_VERTICAL); - gtk_widget_set_halign(sep, GTK_ALIGN_CENTER); - gtk_grid_attach(GTK_GRID(top), sep, (*x)++, 0, 1, 3); + GtkWidget *box = gtk_box_new(GTK_ORIENTATION_VERTICAL, 5); GtkWidget *label_ic = gtk_label_new("Analogue Inputs"); - gtk_grid_attach(GTK_GRID(top), label_ic, *x, 0, 1, 1); - - GtkWidget *horiz_input_sep = gtk_separator_new(GTK_ORIENTATION_HORIZONTAL); - gtk_grid_attach(GTK_GRID(top), horiz_input_sep, *x, 1, 1, 1); + gtk_widget_add_css_class(label_ic, "controls-label"); + gtk_widget_set_halign(label_ic, GTK_ALIGN_START); + gtk_box_append(GTK_BOX(box), label_ic); GtkWidget *input_grid = gtk_grid_new(); + gtk_widget_add_css_class(input_grid, "controls-content"); gtk_grid_set_spacing(GTK_GRID(input_grid), 10); - gtk_grid_attach(GTK_GRID(top), input_grid, *x, 2, 1, 1); + gtk_widget_set_hexpand(input_grid, TRUE); + gtk_widget_set_halign(input_grid, GTK_ALIGN_FILL); + gtk_widget_set_vexpand(input_grid, TRUE); + gtk_box_append(GTK_BOX(box), input_grid); + + gtk_grid_attach(GTK_GRID(top), box, *x, 0, 1, 1); for (int i = 1; i <= input_count; i++) { GtkWidget *label; @@ -466,21 +483,21 @@ static void create_output_controls( ) { GArray *elems = card->elems; - if (*x) { - GtkWidget *sep = gtk_separator_new(GTK_ORIENTATION_VERTICAL); - gtk_grid_attach(GTK_GRID(top), sep, (*x)++, y, x_span, 3); - } + GtkWidget *box = gtk_box_new(GTK_ORIENTATION_VERTICAL, 5); GtkWidget *label_oc = gtk_label_new("Analogue Outputs"); - gtk_grid_attach(GTK_GRID(top), label_oc, *x, y, x_span, 1); - - GtkWidget *horiz_output_sep = gtk_separator_new(GTK_ORIENTATION_VERTICAL); - gtk_grid_attach(GTK_GRID(top), horiz_output_sep, *x, y + 1, x_span, 1); + gtk_widget_add_css_class(label_oc, "controls-label"); + gtk_widget_set_halign(label_oc, GTK_ALIGN_START); + gtk_box_append(GTK_BOX(box), label_oc); GtkWidget *output_grid = gtk_grid_new(); + gtk_widget_add_css_class(output_grid, "controls-content"); gtk_grid_set_spacing(GTK_GRID(output_grid), 10); - gtk_grid_attach(GTK_GRID(top), output_grid, *x, y + 2, x_span, 1); gtk_widget_set_hexpand(output_grid, TRUE); + gtk_widget_set_vexpand(output_grid, TRUE); + gtk_box_append(GTK_BOX(box), output_grid); + + gtk_grid_attach(GTK_GRID(top), box, *x, y, x_span, 1); int output_count = get_max_elem_by_name(elems, "Line", "Playback Volume"); @@ -675,7 +692,7 @@ static GtkWidget *create_main_window_controls(struct alsa_card *card) { gtk_widget_add_css_class(top, "clarett"); } - gtk_grid_set_spacing(GTK_GRID(top), 10); + gtk_grid_set_spacing(GTK_GRID(top), 15); int input_count = get_max_elem_by_name( card->elems, "Line", "Capture Switch" @@ -689,10 +706,7 @@ static GtkWidget *create_main_window_controls(struct alsa_card *card) { if (input_count + output_count >= 12) { x = 0; - GtkWidget *sep = gtk_separator_new(GTK_ORIENTATION_HORIZONTAL); - gtk_grid_attach(GTK_GRID(top), sep, 0, 3, 3, 1); - - create_output_controls(card, top, &x, 4, 3); + create_output_controls(card, top, &x, 1, 2); } else { create_output_controls(card, top, &x, 0, 1); } @@ -755,7 +769,10 @@ GtkWidget *create_iface_mixer_main(struct alsa_card *card) { card->has_talkback = !!get_elem_by_name(card->elems, "Talkback Playback Enum"); - GtkWidget *top = create_main_window_controls(card); + GtkWidget *top = gtk_frame_new(NULL); + gtk_widget_add_css_class(top, "window-frame"); + GtkWidget *contents = create_main_window_controls(card); + gtk_frame_set_child(GTK_FRAME(top), contents); GtkWidget *routing_top = create_routing_controls(card); if (!routing_top) diff --git a/src/iface-no-mixer.c b/src/iface-no-mixer.c index 290c06b..a6fdbd1 100644 --- a/src/iface-no-mixer.c +++ b/src/iface-no-mixer.c @@ -13,32 +13,42 @@ GtkWidget *create_iface_no_mixer_main(struct alsa_card *card) { GArray *elems = card->elems; - GtkWidget *grid = gtk_grid_new(); - gtk_widget_add_css_class(grid, "window-content"); - gtk_widget_add_css_class(grid, "iface-no-mixer"); - gtk_grid_set_spacing(GTK_GRID(grid), 10); + GtkWidget *top = gtk_frame_new(NULL); + gtk_widget_add_css_class(top, "window-frame"); + + GtkWidget *content = gtk_box_new(GTK_ORIENTATION_HORIZONTAL, 15); + gtk_widget_add_css_class(content, "window-content"); + gtk_widget_add_css_class(content, "iface-no-mixer"); + gtk_frame_set_child(GTK_FRAME(top), content); + + GtkWidget *input_box = gtk_box_new(GTK_ORIENTATION_VERTICAL, 5); + GtkWidget *output_box = gtk_box_new(GTK_ORIENTATION_VERTICAL, 5); + gtk_box_append(GTK_BOX(content), input_box); + gtk_box_append(GTK_BOX(content), output_box); GtkWidget *label_ic = gtk_label_new("Input Controls"); - GtkWidget *vert_sep = gtk_separator_new(GTK_ORIENTATION_VERTICAL); GtkWidget *label_oc = gtk_label_new("Output Controls"); - gtk_grid_attach(GTK_GRID(grid), label_ic, 0, 0, 1, 1); - gtk_grid_attach(GTK_GRID(grid), vert_sep, 1, 0, 1, 3); - gtk_grid_attach(GTK_GRID(grid), label_oc, 2, 0, 1, 1); + gtk_widget_add_css_class(label_ic, "controls-label"); + gtk_widget_add_css_class(label_oc, "controls-label"); - GtkWidget *horiz_input_sep = gtk_separator_new(GTK_ORIENTATION_HORIZONTAL); - gtk_grid_attach(GTK_GRID(grid), horiz_input_sep, 0, 1, 1, 1); + gtk_widget_set_halign(label_ic, GTK_ALIGN_START); + gtk_widget_set_halign(label_oc, GTK_ALIGN_START); + + gtk_box_append(GTK_BOX(input_box), label_ic); + gtk_box_append(GTK_BOX(output_box), label_oc); GtkWidget *input_grid = gtk_grid_new(); gtk_grid_set_spacing(GTK_GRID(input_grid), 10); - gtk_grid_attach(GTK_GRID(grid), input_grid, 0, 2, 1, 1); - - GtkWidget *horiz_output_sep = gtk_separator_new(GTK_ORIENTATION_VERTICAL); - gtk_grid_attach(GTK_GRID(grid), horiz_output_sep, 2, 1, 1, 1); + gtk_widget_add_css_class(input_grid, "controls-content"); + gtk_widget_set_vexpand(input_grid, TRUE); + gtk_box_append(GTK_BOX(input_box), input_grid); GtkWidget *output_grid = gtk_grid_new(); gtk_grid_set_spacing(GTK_GRID(output_grid), 10); - gtk_grid_attach(GTK_GRID(grid), output_grid, 2, 2, 1, 1); + gtk_widget_add_css_class(output_grid, "controls-content"); + gtk_widget_set_vexpand(output_grid, TRUE); + gtk_box_append(GTK_BOX(output_box), output_grid); // Solo or 2i2? // Solo Phantom Power is Line 1 only @@ -114,5 +124,5 @@ GtkWidget *create_iface_no_mixer_main(struct alsa_card *card) { GtkWidget *startup = create_startup_controls(card); gtk_window_set_child(GTK_WINDOW(card->window_startup), startup); - return grid; + return top; } diff --git a/src/widget-gain.c b/src/widget-gain.c index 0a410e4..e987d67 100644 --- a/src/widget-gain.c +++ b/src/widget-gain.c @@ -66,6 +66,8 @@ GtkWidget *make_gain_alsa_elem( data->elem = elem; data->vbox = gtk_box_new(GTK_ORIENTATION_VERTICAL, 0); gtk_widget_set_hexpand(data->vbox, TRUE); + gtk_widget_set_valign(data->vbox, GTK_ALIGN_START); + gtk_widget_set_vexpand(data->vbox, TRUE); data->scale = (float)(elem->max_dB - elem->min_dB) / (elem->max_val - elem->min_val); diff --git a/src/window-levels.c b/src/window-levels.c index def1508..66d9cc8 100644 --- a/src/window-levels.c +++ b/src/window-levels.c @@ -64,9 +64,14 @@ static struct alsa_elem *get_level_meter_elem(struct alsa_card *card) { } GtkWidget *create_levels_controls(struct alsa_card *card) { + GtkWidget *top = gtk_frame_new(NULL); + gtk_widget_add_css_class(top, "window-frame"); + GtkWidget *levels_top = gtk_grid_new(); gtk_widget_add_css_class(levels_top, "window-content"); + gtk_widget_add_css_class(levels_top, "top-level-content"); gtk_widget_add_css_class(levels_top, "window-levels"); + gtk_frame_set_child(GTK_FRAME(top), levels_top); GtkGrid *grid = GTK_GRID(levels_top); @@ -113,5 +118,5 @@ GtkWidget *create_levels_controls(struct alsa_card *card) { card->meter_gsource_timer = g_timeout_add(50, update_levels_controls, card); - return levels_top; + return top; } diff --git a/src/window-mixer.c b/src/window-mixer.c index 8028591..6446cd7 100644 --- a/src/window-mixer.c +++ b/src/window-mixer.c @@ -25,9 +25,14 @@ static struct routing_snk *get_mixer_r_snk( } GtkWidget *create_mixer_controls(struct alsa_card *card) { + GtkWidget *top = gtk_frame_new(NULL); + gtk_widget_add_css_class(top, "window-frame"); + GtkWidget *mixer_top = gtk_grid_new(); gtk_widget_add_css_class(mixer_top, "window-content"); + gtk_widget_add_css_class(mixer_top, "top-level-content"); gtk_widget_add_css_class(mixer_top, "window-mixer"); + gtk_frame_set_child(GTK_FRAME(top), mixer_top); gtk_widget_set_halign(mixer_top, GTK_ALIGN_CENTER); gtk_widget_set_valign(mixer_top, GTK_ALIGN_CENTER); @@ -109,7 +114,7 @@ GtkWidget *create_mixer_controls(struct alsa_card *card) { update_mixer_labels(card); - return mixer_top; + return top; } void update_mixer_labels(struct alsa_card *card) { diff --git a/src/window-routing.c b/src/window-routing.c index 55e3ca5..f6b461e 100644 --- a/src/window-routing.c +++ b/src/window-routing.c @@ -262,7 +262,7 @@ static GtkWidget *create_routing_group_grid( ) { GtkWidget *grid = gtk_grid_new(); gtk_widget_set_name(grid, name); - gtk_widget_add_css_class(grid, "routing-group"); + gtk_widget_add_css_class(grid, "controls-content"); gtk_grid_set_spacing(GTK_GRID(grid), 2); @@ -368,7 +368,6 @@ static void create_routing_grid(struct alsa_card *card) { gtk_grid_attach( routing_grid, card->routing_mixer_out_grid, mix_col_num, 3, 1, 1 ); - gtk_widget_set_margin(card->routing_grid, 10); gtk_grid_set_spacing(routing_grid, 10); GtkWidget *src_label = gtk_label_new("↑\nSources →"); @@ -973,9 +972,14 @@ GtkWidget *create_routing_controls(struct alsa_card *card) { create_routing_grid(card); + GtkWidget *top = gtk_frame_new(NULL); + gtk_widget_add_css_class(top, "window-frame"); + gtk_widget_add_css_class(top, "window-routing"); + GtkWidget *routing_overlay = gtk_overlay_new(); gtk_widget_add_css_class(routing_overlay, "window-content"); gtk_widget_add_css_class(routing_overlay, "window-routing"); + gtk_frame_set_child(GTK_FRAME(top), routing_overlay); gtk_overlay_set_child(GTK_OVERLAY(routing_overlay), card->routing_grid); @@ -983,5 +987,5 @@ GtkWidget *create_routing_controls(struct alsa_card *card) { add_drop_controller_motion(card, routing_overlay); - return routing_overlay; + return top; } diff --git a/src/window-startup.c b/src/window-startup.c index 2277027..fbcce90 100644 --- a/src/window-startup.c +++ b/src/window-startup.c @@ -33,7 +33,10 @@ static void add_sep(GtkWidget *grid, int *grid_y) { return; GtkWidget *sep = gtk_separator_new(GTK_ORIENTATION_HORIZONTAL); - gtk_widget_set_margin(sep, 20); + gtk_widget_set_margin_top(sep, 10); + gtk_widget_set_margin_bottom(sep, 10); + gtk_widget_set_margin_start(sep, 20); + gtk_widget_set_margin_end(sep, 20); gtk_grid_attach(GTK_GRID(grid), sep, 0, (*grid_y)++, 3, 1); } @@ -55,6 +58,7 @@ static void add_standalone_control( gtk_grid_attach(GTK_GRID(grid), w, 0, *grid_y, 1, 1); w = make_boolean_alsa_elem(standalone, "Disabled", "Enabled"); + gtk_widget_set_valign(w, GTK_ALIGN_START); gtk_grid_attach(GTK_GRID(grid), w, 0, *grid_y + 1, 1, 1); w = big_label( @@ -90,6 +94,7 @@ static void add_phantom_persistence_control( gtk_grid_attach(GTK_GRID(grid), w, 0, *grid_y, 1, 1); w = make_boolean_alsa_elem(phantom, "Disabled", "Enabled"); + gtk_widget_set_valign(w, GTK_ALIGN_START); gtk_grid_attach(GTK_GRID(grid), w, 0, *grid_y + 1, 1, 1); w = big_label( @@ -124,6 +129,7 @@ static void add_msd_control( gtk_grid_attach(GTK_GRID(grid), w, 0, *grid_y, 1, 1); w = make_boolean_alsa_elem(msd, "Disabled", "Enabled"); + gtk_widget_set_valign(w, GTK_ALIGN_START); gtk_grid_attach(GTK_GRID(grid), w, 0, *grid_y + 1, 1, 1); w = big_label( @@ -151,12 +157,18 @@ static void add_no_startup_controls_msg(GtkWidget *grid) { GtkWidget *create_startup_controls(struct alsa_card *card) { GArray *elems = card->elems; + GtkWidget *top = gtk_frame_new(NULL); + gtk_widget_add_css_class(top, "window-frame"); + int grid_y = 0; GtkWidget *grid = gtk_grid_new(); gtk_widget_add_css_class(grid, "window-content"); + gtk_widget_add_css_class(grid, "top-level-content"); gtk_widget_add_css_class(grid, "window-startup"); gtk_grid_set_column_spacing(GTK_GRID(grid), 20); + gtk_grid_set_row_spacing(GTK_GRID(grid), 10); + gtk_frame_set_child(GTK_FRAME(top), grid); add_standalone_control(elems, grid, &grid_y); add_phantom_persistence_control(elems, grid, &grid_y); @@ -165,5 +177,5 @@ GtkWidget *create_startup_controls(struct alsa_card *card) { if (!grid_y) add_no_startup_controls_msg(grid); - return grid; + return top; }