diff --git a/gtk/gtkcolumnview.c b/gtk/gtkcolumnview.c index e7ef11d797..707336c262 100644 --- a/gtk/gtkcolumnview.c +++ b/gtk/gtkcolumnview.c @@ -55,6 +55,31 @@ * must be attached to a sort model for the data that the view is showing, and the * columns must have sorters attached to them by calling gtk_column_view_column_set_sorter(). * The initial sort order can be set with gtk_column_view_sort_by_column(). + * + * # CSS nodes + * + * |[ + * columnview[.column-separators] + * ├── header + * │ ├── + * ┊ ┊ + * │ ╰── + * │ + * ├── listview + * │ + * ┊ + * ╰── [rubberband] + + * ]| + * + * GtkColumnView uses a single CSS node named columnview. It may carry the + * .column-separators style class, when #GtkColumnView:show-column-separators + * property is set. Header widets appear below a node with name header. + * The rows are contained in a GtkListView widget, so there is a listview + * node with the same structure as for a standalone GtkListView widget. If + * #GtkColumnView:show-row-separators is set, it will be passed on to the + * list view, causing its CSS node to carry the .separators style class. + * For rubberband selection, a node with name rubberband is used. */ struct _GtkColumnView @@ -653,7 +678,7 @@ gtk_column_view_class_init (GtkColumnViewClass *klass) G_TYPE_FROM_CLASS (gobject_class), g_cclosure_marshal_VOID__UINTv); - gtk_widget_class_set_css_name (widget_class, I_("treeview")); + gtk_widget_class_set_css_name (widget_class, I_("columnview")); } static void update_column_resize (GtkColumnView *self, @@ -1136,7 +1161,7 @@ gtk_column_view_get_columns (GtkColumnView *self) /** * gtk_column_view_set_show_row_separators: * @self: a #GtkColumnView - * @show_separators: %TRUE to show row separators + * @show_row_separators: %TRUE to show row separators * * Sets whether the list should show separators * between rows. diff --git a/gtk/gtkgridview.c b/gtk/gtkgridview.c index f6b93b3dec..855ee7a0fa 100644 --- a/gtk/gtkgridview.c +++ b/gtk/gtkgridview.c @@ -48,6 +48,22 @@ * @see_also: #GListModel * * GtkGridView is a widget to present a view into a large dynamic grid of items. + * + * # CSS nodes + * + * |[ + * gridview + * ├── child + * │ + * ├── child + * │ + * ┊ + * ╰── [rubberband] + * ]| + * + * GtkGridView uses a single CSS node with name gridview. Each child + * uses a single CSS node with name child. For rubberband selection, + * a subnode with name rubberband is used. */ typedef struct _Cell Cell; @@ -992,7 +1008,7 @@ gtk_grid_view_class_init (GtkGridViewClass *klass) GtkWidgetClass *widget_class = GTK_WIDGET_CLASS (klass); GObjectClass *gobject_class = G_OBJECT_CLASS (klass); - list_base_class->list_item_name = "flowboxchild"; + list_base_class->list_item_name = "child"; list_base_class->list_item_size = sizeof (Cell); list_base_class->list_item_augment_size = sizeof (CellAugment); list_base_class->list_item_augment_func = cell_augment; @@ -1123,7 +1139,7 @@ gtk_grid_view_class_init (GtkGridViewClass *klass) "u", gtk_grid_view_activate_item); - gtk_widget_class_set_css_name (widget_class, I_("flowbox")); + gtk_widget_class_set_css_name (widget_class, I_("gridview")); } static void diff --git a/gtk/gtklistview.c b/gtk/gtklistview.c index 90b594da30..5f043e591a 100644 --- a/gtk/gtklistview.c +++ b/gtk/gtklistview.c @@ -46,6 +46,24 @@ * @see_also: #GListModel * * GtkListView is a widget to present a view into a large dynamic list of items. + * + * # CSS nodes + * + * |[ + * listview[.separators] + * ├── row + * │ + * ├── row + * │ + * ┊ + * ╰── [rubberband] + + * ]| + * + * GtkListView uses a single CSS node named listview. It may carry the + * .separators style class, when #GtkListView:show-separators property + * is set. Each child widget uses a single CSS node named row. For + * rubberband selection, a node with name rubberband is used. */ typedef struct _ListRow ListRow; @@ -832,7 +850,7 @@ gtk_list_view_class_init (GtkListViewClass *klass) "u", gtk_list_view_activate_item); - gtk_widget_class_set_css_name (widget_class, I_("list")); + gtk_widget_class_set_css_name (widget_class, I_("listview")); } static void diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss index 7314efa8d2..6ca74d3c7e 100644 --- a/gtk/theme/Adwaita/_common.scss +++ b/gtk/theme/Adwaita/_common.scss @@ -123,6 +123,23 @@ flowbox { } } +gridview { + > rubberband { @extend rubberband; } + + > child { + padding: 3px; + transition: $focus_transition; + + @include focus-ring(); + + &:selected { + outline-color: $alt_focus_border_color; + + @extend %selected_items; + } + } +} + coverflow cover { color: $text_color; background-color: $base_color; @@ -1512,6 +1529,7 @@ pathbar > button { $_treeview_borders_color: if($variant=='light',mix($borders_color, $base_color,80%),mix($fg_color, $base_color, 20%)); $_treeview_backdrop_borders_color: if($variant=='light',mix($backdrop_borders_color, $base_color, 80%),mix($backdrop_fg_color, $base_color, 20%)); +columnview.view, treeview.view { border-left-color: $_treeview_borders_color; // this is actually the tree lines color, border-top-color: $_treeview_borders_color; // while this is the grid lines color, better then nothing @@ -2977,6 +2995,7 @@ separator { /********* * Lists * *********/ +listview, list { color: $text_color; background-color: $base_color;