HC: selectable list items (sync with Adwaita)

2 files changed, 42 insertions, 3 deletions

diff --git a/themes/HighContrast/gtk-3.0/_common.scss b/themes/HighContrast/gtk-3.0/_common.scss
index 058dab0b..a97e2e78 100644
--- a/themes/HighContrast/gtk-3.0/_common.scss
+++ b/themes/HighContrast/gtk-3.0/_common.scss
@@ -1578,10 +1578,34 @@ GtkScrolledWindow {
   }
 }
 
-.list-row {
+.list-row,
+.grid-child {
   padding: 2px;
 }
 
+.list-row.button {
+  @extend %undecorated_button;
+  background-color: transparentize($base_color,1); // for the transition
+  border-style: none; // I need no borders here
+  border-radius: 0;   // and no rounded corners
+  box-shadow: none;   // and no box-shadow
+  &:hover {
+    background-color: mix(black, $base_color, 5%);
+  }
+  &:active {
+    box-shadow: inset 0 2px 2px -2px transparentize(black,0.8);
+  }
+  &:selected {
+    &:active { box-shadow: inset 0 2px 3px -1px transparentize(black,0.5); }
+    &:hover {
+      background-color: mix(black, $selected_bg_color, 10%);
+    }
+  }
+  &:backdrop:hover {
+    @extend %undecorated_button;
+  }
+}
+
 .list-row:selected {
   background-color: $selected_bg_color;
   color: $selected_fg_color;
diff --git a/themes/HighContrast/gtk-3.0/gtk.css b/themes/HighContrast/gtk-3.0/gtk.css
index 0cc8733c..138fbfa1 100644
--- a/themes/HighContrast/gtk-3.0/gtk.css
+++ b/themes/HighContrast/gtk-3.0/gtk.css
@@ -509,7 +509,7 @@
     border-radius: 3px;
     border-style: solid; }
 
-.button.flat, .button.flat:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, .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, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
+.button.flat, .button.flat:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, .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:hover, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
   border-color: transparent;
   background-color: transparent;
   background-image: none;
@@ -1669,9 +1669,24 @@ GtkScrolledWindow GtkViewport.frame {
     background-color: white;
     border-color: #8b8b8b; }
 
-.list-row {
+.list-row,
+.grid-child {
   padding: 2px; }
 
+.list-row.button {
+  background-color: rgba(255, 255, 255, 0);
+  border-style: none;
+  border-radius: 0;
+  box-shadow: none; }
+  .list-row.button:hover {
+    background-color: #f2f2f2; }
+  .list-row.button:active {
+    box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); }
+  .list-row.button:selected:active {
+    box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
+  .list-row.button:selected:hover {
+    background-color: black; }
+
 .list-row:selected {
   background-color: black;
   color: white; }