HC: Avoid same BG/FG colors in flat treeview entry
authorDaniel Boles <dboles.src@gmail.com>
Wed, 20 Jun 2018 17:32:49 +0000 (18:32 +0100)
committerDaniel Boles <dboles.src@gmail.com>
Wed, 20 Jun 2018 18:13:26 +0000 (19:13 +0100)
Selected rows in tree views in HighContrast have a background colour the
same or nearly as the normal text colour, so we cannot let entries in
such rows have transparent backgrounds, or the text inside the entry
becomes nearly or totally impossible to see.

Dodge this by giving entry.flat inside treeview and with :focus the
$base_color, which is different from the text & so lets that be seen.

https://gitlab.gnome.org/GNOME/gtk/merge_requests/125

gtk/theme/HighContrast/_common.scss
gtk/theme/HighContrast/gtk-contained-inverse.css
gtk/theme/HighContrast/gtk-contained.css

index afa5f5ab54b69dba0f009b60710831d0b7241e45..c546592d42bdb55f425742ae6d8c7f31e3056d78 100644 (file)
@@ -214,6 +214,9 @@ entry {
         border-color: transparent;
         border-radius: 0;
         box-shadow: none;
+
+        // Dodge transparency in selected treeview row, else bg & fg end up same
+        treeview &:focus { background-color: $base_color; }
       }
     }
 
@@ -898,7 +901,6 @@ button:link, button:visited {
  * GtkSpinButton *
  *****************/
 spinbutton {
-   
   &:not(.vertical) {
     // in this horizontal configuration, the whole spinbutton
     // behaves as the entry, so we extend the entry styling
@@ -908,7 +910,6 @@ spinbutton {
     border-color: $borders_color;
     box-shadow: none;
     padding: 0;
-    
  
     entry {
       min-width: 28px;
index fb18a18f79d3ce44e063ee7606485570fb232680..1b87cfda484fcbd7037c471222c83fff287c91e9 100644 (file)
@@ -98,6 +98,8 @@ spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-
 
 spinbutton.flat:focus:not(.vertical), spinbutton.flat:backdrop:not(.vertical), spinbutton.flat:disabled:not(.vertical), spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-image: none; border-color: transparent; border-radius: 0; box-shadow: none; }
 
+treeview spinbutton.flat:focus:focus:not(.vertical), treeview spinbutton.flat:backdrop:focus:not(.vertical), treeview spinbutton.flat:disabled:focus:not(.vertical), treeview spinbutton.flat:focus:not(.vertical), treeview entry.flat:focus:focus, treeview entry.flat:backdrop:focus, treeview entry.flat:disabled:focus, treeview entry.flat:focus { background-color: #111; }
+
 spinbutton:focus:not(.vertical), entry:focus { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #090909, #111 90%); border-color: #ddd; box-shadow: inset 0 2px 2px -2px #090909, inset 0 0 0 1px #ddd; }
 
 spinbutton:disabled:not(.vertical), entry:disabled { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #090909, #111 90%); color: gray; border-color: gray; background-image: linear-gradient(to bottom, #070707, #070707); box-shadow: none; }
index 7d5febbd867e0e232ee624b977ef70e658158ece..310e412e39ca8e465facbc2aa12c685f0bbc5505 100644 (file)
@@ -98,6 +98,8 @@ spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-
 
 spinbutton.flat:focus:not(.vertical), spinbutton.flat:backdrop:not(.vertical), spinbutton.flat:disabled:not(.vertical), spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-image: none; border-color: transparent; border-radius: 0; box-shadow: none; }
 
+treeview spinbutton.flat:focus:focus:not(.vertical), treeview spinbutton.flat:backdrop:focus:not(.vertical), treeview spinbutton.flat:disabled:focus:not(.vertical), treeview spinbutton.flat:focus:not(.vertical), treeview entry.flat:focus:focus, treeview entry.flat:backdrop:focus, treeview entry.flat:disabled:focus, treeview entry.flat:focus { background-color: #fff; }
+
 spinbutton:focus:not(.vertical), entry:focus { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #f7f7f7, #fff 90%); border-color: #000; box-shadow: inset 0 2px 2px -2px gray, inset 0 0 0 1px #000; }
 
 spinbutton:disabled:not(.vertical), entry:disabled { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #f7f7f7, #fff 90%); color: gray; border-color: gray; background-image: linear-gradient(to bottom, white, white); box-shadow: none; }