# HG changeset patch # User IBBoard # Date 1546030928 0 # Node ID e98478e5fe6d1823ea36c12def95f065e6bc3af1 # Parent cbe49d307b859aaf1bf2dba3ec10cd2608a9a8f8 Darken the background for lists This was most obvious in Shotwell's "Search" dialog Now it looks more like a panel and less like a bright white styling problem! diff -r cbe49d307b85 -r e98478e5fe6d gtk-3.20/gtk.css --- a/gtk-3.20/gtk.css Mon Oct 29 12:06:05 2018 +0000 +++ b/gtk-3.20/gtk.css Fri Dec 28 21:02:08 2018 +0000 @@ -2150,21 +2150,37 @@ spinbutton:not(.vertical) button:hover { background-color: rgba(198, 198, 198, 0.4); border-top-color: transparent; border-top-style: solid; border-top-width: 1px; border-bottom-color: transparent; border-bottom-style: solid; border-bottom-width: 1px; background-clip: padding-box; } -.view, iconview, .view text, iconview text, iconview, iconview text, textview, textview text, list, list-row, list-row.button { color: black; background-color: #F0F0F0; } - -.view:backdrop, iconview:backdrop, .view:backdrop:hover, iconview:backdrop:hover, .view text:backdrop, iconview text:backdrop, .view text:backdrop:hover, iconview text:backdrop:hover, iconview:backdrop, iconview:backdrop:hover, iconview text:backdrop, iconview text:backdrop:hover, textview:backdrop, textview:backdrop:hover, textview text:backdrop, textview text:backdrop:hover, list:backdrop, list:backdrop:hover, list-row:backdrop, list-row:backdrop:hover, list-row.button:backdrop, list-row.button:backdrop:hover { color: #272727; background-color: #ededed; } - -.view:selected, iconview:selected, .view text:selected, iconview text:selected, iconview:selected, iconview text:selected, textview:selected, textview text:selected, list:selected, list-row:selected, list-row.button:selected { color: #ffffff; background-color: #5E7F3E; } - -.view:hover, iconview:hover, .view text:hover, iconview text:hover, iconview:hover, iconview text:hover, textview:hover, textview text:hover, list:hover, list-row:hover, list-row.button:hover { background-color: #e5e5e5; } - -.view:active, iconview:active, .view text:active, iconview text:active, iconview:active, iconview text:active, textview:active, textview text:active, list:active, list-row:active, list-row.button:active { box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); } - -.view:selected:active, iconview:selected:active, .view text:selected:active, iconview text:selected:active, iconview:selected:active, iconview text:selected:active, textview:selected:active, textview text:selected:active, list:selected:active, list-row:selected:active, list-row.button:selected:active { box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); } - -.view:selected:hover, iconview:selected:hover, .view text:selected:hover, iconview text:selected:hover, iconview:selected:hover, iconview text:selected:hover, textview:selected:hover, textview text:selected:hover, list:selected:hover, list-row:selected:hover, list-row.button:selected:hover { background-color: #57753a; } - -.view:selected:backdrop, iconview:selected:backdrop, .view text:selected:backdrop, iconview text:selected:backdrop, iconview:selected:backdrop, iconview text:selected:backdrop, textview:selected:backdrop, textview text:selected:backdrop, list:selected:backdrop, list-row:selected:backdrop, list-row.button:selected:backdrop { background-color: #5E7F3E; } +.view, iconview, .view text, iconview text, iconview, iconview text, textview, textview text { color: black; background-color: #F0F0F0; } + +.view:backdrop, iconview:backdrop, .view:backdrop:hover, iconview:backdrop:hover, .view text:backdrop, iconview text:backdrop, .view text:backdrop:hover, iconview text:backdrop:hover, iconview:backdrop, iconview:backdrop:hover, iconview text:backdrop, iconview text:backdrop:hover, textview:backdrop, textview:backdrop:hover, textview text:backdrop, textview text:backdrop:hover { color: #272727; background-color: #ededed; } + +.view:selected, iconview:selected, .view text:selected, iconview text:selected, iconview:selected, iconview text:selected, textview:selected, textview text:selected { color: #ffffff; background-color: #5E7F3E; } + +.view:hover, iconview:hover, .view text:hover, iconview text:hover, iconview:hover, iconview text:hover, textview:hover, textview text:hover { background-color: #e5e5e5; } + +.view:active, iconview:active, .view text:active, iconview text:active, iconview:active, iconview text:active, textview:active, textview text:active { box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); } + +.view:selected:active, iconview:selected:active, .view text:selected:active, iconview text:selected:active, iconview:selected:active, iconview text:selected:active, textview:selected:active, textview text:selected:active { box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); } + +.view:selected:hover, iconview:selected:hover, .view text:selected:hover, iconview text:selected:hover, iconview:selected:hover, iconview text:selected:hover, textview:selected:hover, textview text:selected:hover { background-color: #57753a; } + +.view:selected:backdrop, iconview:selected:backdrop, .view text:selected:backdrop, iconview text:selected:backdrop, iconview:selected:backdrop, iconview text:selected:backdrop, textview:selected:backdrop, textview text:selected:backdrop { background-color: #5E7F3E; } + +list, list-row, list-row.button { background-color: #e1e1e1; } + +list:backdrop, list:backdrop:hover, list-row:backdrop, list-row:backdrop:hover, list-row.button:backdrop, list-row.button:backdrop:hover { color: #272727; background-color: #dedede; } + +list:selected, list-row:selected, list-row.button:selected { color: #ffffff; background-color: #5E7F3E; } + +list:hover, list-row:hover, list-row.button:hover { background-color: #d7d7d7; } + +list:active, list-row:active, list-row.button:active { box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); } + +list:selected:active, list-row:selected:active, list-row.button:selected:active { box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); } + +list:selected:hover, list-row:selected:hover, list-row.button:selected:hover { background-color: #57753a; } + +list:selected:backdrop, list-row:selected:backdrop, list-row.button:selected:backdrop { background-color: #5E7F3E; } .sidebar list { background: transparent; } diff -r cbe49d307b85 -r e98478e5fe6d gtk-3.20/gtk.scss --- a/gtk-3.20/gtk.scss Mon Oct 29 12:06:05 2018 +0000 +++ b/gtk-3.20/gtk.scss Fri Dec 28 21:02:08 2018 +0000 @@ -409,7 +409,7 @@ background-clip: padding-box; } -.view, .view text, iconview, iconview text, textview, textview text, list, list-row, list-row.button, { +.view, .view text, iconview, iconview text, textview, textview text { color: $text_color; background-color: $text_input_color; &:backdrop, &:backdrop:hover { @@ -435,6 +435,31 @@ } } +list, list-row, list-row.button { + background-color: darken($text_input_color, 6%); + &:backdrop, &:backdrop:hover { + color: $backdrop_text_color; + background-color: darken($backdrop_text_input_color, 6%); + } + &:selected { + color: $selected_fg_color; + background-color: $selected_bg_color; + } + &:hover { + background-color: mix($fg_color, darken($text_input_color, 6%), 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($fg_color, $selected_bg_color, 10%); + } + &:backdrop { background-color: $selected_bg_color; } + } +} + .sidebar list { background: transparent; }