inspector: Add a dark background to the recorder

Add a button to toggle the background in the node
view between dark and light. This helps to discern
the borders of some nodes.
This commit is contained in:
Matthias Clasen 2020-08-30 08:59:13 -04:00
parent c69ac09afb
commit 071763c844
3 changed files with 36 additions and 0 deletions

View File

@ -51,3 +51,11 @@
stacksidebar.object-details {
border-top: 1px solid lightgray;
}
picture.dark {
background: gray;
}
picture.light {
background: white;
}

View File

@ -1021,6 +1021,25 @@ render_node_save (GtkButton *button,
gtk_widget_show (dialog);
}
static void
toggle_dark_mode (GtkToggleButton *button,
GParamSpec *pspec,
gpointer data)
{
GtkWidget *picture = data;
if (gtk_toggle_button_get_active (button))
{
gtk_widget_add_css_class (picture, "dark");
gtk_widget_remove_css_class (picture, "light");
}
else
{
gtk_widget_remove_css_class (picture, "dark");
gtk_widget_add_css_class (picture, "light");
}
}
static GtkWidget *
gtk_inspector_recorder_recordings_list_create_widget (gpointer item,
gpointer user_data)
@ -1216,6 +1235,7 @@ gtk_inspector_recorder_class_init (GtkInspectorRecorderClass *klass)
gtk_widget_class_bind_template_callback (widget_class, recordings_list_row_selected);
gtk_widget_class_bind_template_callback (widget_class, render_node_save);
gtk_widget_class_bind_template_callback (widget_class, node_property_activated);
gtk_widget_class_bind_template_callback (widget_class, toggle_dark_mode);
gtk_widget_class_set_layout_manager_type (widget_class, GTK_TYPE_BIN_LAYOUT);
}

View File

@ -37,6 +37,14 @@
<property name="hexpand">1</property>
</object>
</child>
<child>
<object class="GtkToggleButton" id="dark_mode_button">
<property name="has-frame">0</property>
<property name="icon-name">display-brightness-symbolic</property>
<property name="tooltip-text" translatable="yes">Use a dark background</property>
<signal name="notify::active" handler="toggle_dark_mode" swapped="0" object="render_node_view"/>
</object>
</child>
<child>
<object class="GtkButton" id="render_node_save_button">
<property name="has-frame">0</property>