Commit 207e5930 authored by Benjamin Otte's avatar Benjamin Otte

listbox: Mark activatable rows with a .activatable style class

Do not use .button anymore.

This is for 2 reasons:
1. The styling is seperate in our themes, so it doesn't make sense to
   share the style class.
2. Due to the shared styling of .buton, listbox rows inherit all the
   special case styles that exist for buttons - such as linked buttons,
   header buttons, entry buttons, spinbutton buttons, etc. This means
   that the code has to check all these special cases all the time and
   for listbox rows, this is very slow.
parent 0897a7a4
......@@ -3017,7 +3017,7 @@ gtk_list_box_row_init (GtkListBoxRow *row)
context = gtk_widget_get_style_context (GTK_WIDGET (row));
gtk_style_context_add_class (context, GTK_STYLE_CLASS_LIST_ROW);
gtk_style_context_add_class (context, GTK_STYLE_CLASS_BUTTON);
gtk_style_context_add_class (context, "activatable");
}
static void
......@@ -3426,9 +3426,9 @@ gtk_list_box_update_row_style (GtkListBox *box,
context = gtk_widget_get_style_context (GTK_WIDGET (row));
if (ROW_PRIV (row)->activatable ||
(ROW_PRIV (row)->selectable && can_select))
gtk_style_context_add_class (context, GTK_STYLE_CLASS_BUTTON);
gtk_style_context_add_class (context, "activatable");
else
gtk_style_context_remove_class (context, GTK_STYLE_CLASS_BUTTON);
gtk_style_context_remove_class (context, "activatable");
}
static void
......
......@@ -2568,15 +2568,15 @@ GtkScrolledWindow {
padding: 2px;
}
.list-row.button,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked {
.list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked {
// reset button inherited stuff
@extend %undecorated_button;
background-color: transparentize($base_color,1); // for the transition
......@@ -2586,7 +2586,7 @@ GtkScrolledWindow {
}
.list-row.button {
.list-row.activatable {
// let's take care of background colors
&:hover {
background-color: mix($fg_color, $base_color, 5%);
......
......@@ -1134,16 +1134,15 @@ GtkTextView {
.titlebar .button.titlebutton:visited, .button:link:hover, .button:link:active, .button:link:checked, .button:visited:hover, .button:visited:active, .button:visited:checked, .button:link:backdrop, .button:visited:backdrop, .menu.button, .header-bar .menu.button.titlebutton,
.titlebar .menu.button.titlebutton, .notebook tab .button, .notebook tab .header-bar .button.titlebutton, .header-bar .notebook tab .button.titlebutton,
.notebook tab .titlebar .button.titlebutton,
.titlebar .notebook tab .button.titlebutton, .list-row.button, .header-bar .list-row.button.titlebutton,
.titlebar .list-row.button.titlebutton,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked, .app-notification .button.flat, .app-notification .sidebar-button.button, .app-notification .header-bar .titlebutton.button, .header-bar .app-notification .titlebutton.button,
.titlebar .notebook tab .button.titlebutton, .list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked, .app-notification .button.flat, .app-notification .sidebar-button.button, .app-notification .header-bar .titlebutton.button, .header-bar .app-notification .titlebutton.button,
.app-notification .titlebar .titlebutton.button,
.titlebar .app-notification .titlebutton.button,
.app-notification.frame .button.flat,
......@@ -3432,32 +3431,31 @@ GtkScrolledWindow GtkViewport.frame {
.grid-child {
padding: 2px; }
.list-row.button, .header-bar .list-row.button.titlebutton,
.titlebar .list-row.button.titlebutton,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked {
.list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked {
background-color: rgba(41, 41, 41, 0);
border-style: none;
border-radius: 0;
box-shadow: none; }
.list-row.button:hover {
.list-row.activatable:hover {
background-color: #323232; }
.list-row.button:active {
.list-row.activatable:active {
box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); }
.list-row.button:backdrop:hover {
.list-row.activatable:backdrop:hover {
background-color: transparent; }
.list-row.button:selected:active {
.list-row.activatable:selected:active {
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
.list-row.button:selected:hover {
.list-row.activatable:selected:hover {
background-color: #356ba4; }
.list-row.button:selected:backdrop {
.list-row.activatable:selected:backdrop {
background-color: #215d9c; }
.list-row:selected .button {
......
......@@ -1134,16 +1134,15 @@ GtkTextView {
.titlebar .button.titlebutton:visited, .button:link:hover, .button:link:active, .button:link:checked, .button:visited:hover, .button:visited:active, .button:visited:checked, .button:link:backdrop, .button:visited:backdrop, .menu.button, .header-bar .menu.button.titlebutton,
.titlebar .menu.button.titlebutton, .notebook tab .button, .notebook tab .header-bar .button.titlebutton, .header-bar .notebook tab .button.titlebutton,
.notebook tab .titlebar .button.titlebutton,
.titlebar .notebook tab .button.titlebutton, .list-row.button, .header-bar .list-row.button.titlebutton,
.titlebar .list-row.button.titlebutton,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked, .app-notification .button.flat, .app-notification .sidebar-button.button, .app-notification .header-bar .titlebutton.button, .header-bar .app-notification .titlebutton.button,
.titlebar .notebook tab .button.titlebutton, .list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked, .app-notification .button.flat, .app-notification .sidebar-button.button, .app-notification .header-bar .titlebutton.button, .header-bar .app-notification .titlebutton.button,
.app-notification .titlebar .titlebutton.button,
.titlebar .app-notification .titlebutton.button,
.app-notification.frame .button.flat,
......@@ -3594,32 +3593,31 @@ GtkScrolledWindow GtkViewport.frame {
.grid-child {
padding: 2px; }
.list-row.button, .header-bar .list-row.button.titlebutton,
.titlebar .list-row.button.titlebutton,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked {
.list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked {
background-color: rgba(255, 255, 255, 0);
border-style: none;
border-radius: 0;
box-shadow: none; }
.list-row.button:hover {
.list-row.activatable:hover {
background-color: #f4f4f4; }
.list-row.button:active {
.list-row.activatable:active {
box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); }
.list-row.button:backdrop:hover {
.list-row.activatable:backdrop:hover {
background-color: transparent; }
.list-row.button:selected:active {
.list-row.activatable:selected:active {
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
.list-row.button:selected:hover {
.list-row.activatable:selected:hover {
background-color: #4786c8; }
.list-row.button:selected:backdrop {
.list-row.activatable:selected:backdrop {
background-color: #4a90d9; }
.list-row:selected .button {
......
......@@ -1927,15 +1927,15 @@ GtkScrolledWindow {
padding: 2px;
}
.list-row.button,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked {
.list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked {
// reset button inherited stuff
@extend %undecorated_button;
background-color: transparentize($base_color,1); // for the transition
......@@ -1945,7 +1945,7 @@ GtkScrolledWindow {
}
.list-row.button {
.list-row.activatable {
@extend %undecorated_button;
background-color: transparentize($base_color,1); // for the transition
border-style: none; // I need no borders here
......@@ -2013,7 +2013,7 @@ GtkScrolledWindow {
}
// transition
.list-row, list-row.button {
.list-row, .list-row.activatable {
transition: all 300ms $ease-out-quad;
&:hover { transition: none; }
}
......
......@@ -765,15 +765,15 @@
border-radius: 3px;
border-style: solid; }
.button.flat, .button.flat:backdrop, .button.flat:insensitive:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .button:link, .button:visited, .button:link:hover, .button:link:active, .button:visited:hover, .button:visited:active, .button:link:backdrop, .button:visited:backdrop, .notebook tab .button, .list-row.button,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
.button.flat, .button.flat:backdrop, .button.flat:insensitive:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .button:link, .button:visited, .button:link:hover, .button:link:active, .button:visited:hover, .button:visited:active, .button:link:backdrop, .button:visited:backdrop, .notebook tab .button, .list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
border-color: transparent;
background-color: transparent;
background-image: none;
......@@ -2113,36 +2113,36 @@ GtkPlacesSidebar.sidebar .view .separator:backdrop {
.grid-child {
padding: 2px; }
.list-row.button,
.list-row.button:backdrop,
.list-row.button:backdrop:active,
.list-row.button:backdrop:checked,
.list-row.button:backdrop:insensitive,
.list-row.button:backdrop:insensitive:active,
.list-row.button:backdrop:insensitive:checked,
.list-row.button:insensitive:active,
.list-row.button:insensitive:checked {
.list-row.activatable,
.list-row.activatable:backdrop,
.list-row.activatable:backdrop:active,
.list-row.activatable:backdrop:checked,
.list-row.activatable:backdrop:insensitive,
.list-row.activatable:backdrop:insensitive:active,
.list-row.activatable:backdrop:insensitive:checked,
.list-row.activatable:insensitive:active,
.list-row.activatable:insensitive:checked {
background-color: rgba(255, 255, 255, 0);
border-style: none;
border-radius: 0;
box-shadow: none; }
.list-row.button {
.list-row.activatable {
background-color: rgba(255, 255, 255, 0);
border-style: none;
border-radius: 0;
box-shadow: none; }
.list-row.button:hover {
.list-row.activatable:hover {
background-color: #f2f2f2; }
.list-row.button:active {
.list-row.activatable:active {
box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); }
.list-row.button:selected {
.list-row.activatable:selected {
background-color: #000; }
.list-row.button:selected:active {
.list-row.activatable:selected:active {
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
.list-row.button:selected:hover {
.list-row.activatable:selected:hover {
background-color: black; }
.list-row.button:selected:backdrop {
.list-row.activatable:selected:backdrop {
background-color: #7f7f7f; }
.list-row:selected .button {
......@@ -2229,9 +2229,9 @@ GtkPlacesSidebar.sidebar .view .separator:backdrop {
background-image: none;
background-color: white; }
.list-row, list-row.button {
.list-row, .list-row.activatable {
transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.list-row:hover, list-row.button:hover {
.list-row:hover, .list-row.activatable:hover {
transition: none; }
/*********************
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment