From 43a2676c3ffd8647c8fed1b499c453d41500bf6f Mon Sep 17 00:00:00 2001 From: Lapo Calamandrei Date: Wed, 29 Oct 2014 19:50:58 +0100 Subject: [PATCH] Adwaita: fix selected colorswatch white border --- gtk/resources/theme/Adwaita/_common.scss | 30 +++++++++++-------- .../theme/Adwaita/gtk-contained-dark.css | 16 +++++----- gtk/resources/theme/Adwaita/gtk-contained.css | 16 +++++----- 3 files changed, 36 insertions(+), 26 deletions(-) diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss index e7b4d56e56..2216e28372 100644 --- a/gtk/resources/theme/Adwaita/_common.scss +++ b/gtk/resources/theme/Adwaita/_common.scss @@ -2924,7 +2924,20 @@ GtkColorSwatch { // is GtkColorSwatch .overlay {}, GtkColorSwatch has the programmatically set background, so most of the style // is applied to the overlay box. - box-shadow: inset 0 1px transparentize(black, 0.9), _widget_edge(); + $_colorswatch_shadow: inset 0 1px transparentize(black, 0.9), _widget_edge(); + + box-shadow: $_colorswatch_shadow; + + // take care of colorswatches on selected elements + :selected & { + box-shadow: none; + &.overlay, &.overlay:hover { + border-color: $selected_fg_color; + } + } + + // we need to re-set the shadow here since it get axed by the previous bit + &:selected { box-shadow: $_colorswatch_shadow; } // border rounding &.top { @@ -2949,7 +2962,8 @@ GtkColorSwatch { // nth-child works just on the custom colors row // hover effect - &:hover { + &:hover, + &:hover:selected { background-image: linear-gradient(135deg, transparentize(white, 0.3), transparentize(white, 1) 50%); box-shadow: inset 0 1px transparentize(white, 0.6), @@ -2983,7 +2997,8 @@ GtkColorSwatch { } // border color - &.overlay { + &.overlay, + &.overlay:selected { border: 1px solid if($variant == 'light', transparentize(black, 0.7), $borders_color); &:hover { border-color: if($variant == 'light', transparentize(black, 0.5), black); } } @@ -2997,15 +3012,6 @@ GtkColorSwatch { &:backdrop { @include button(backdrop); } .overlay { @include button(undecorated); } // reset the overlay to not cover the button style underneat } - - // take care of colorswatches on selected elements - :selected & { - box-shadow: none; - &.overlay { - border-color: $selected_fg_color; - } - } - } diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css b/gtk/resources/theme/Adwaita/gtk-contained-dark.css index a2645114b6..892b18d2ef 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css @@ -4354,6 +4354,12 @@ GtkInfoBar { *****************/ GtkColorSwatch { box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); } + :selected GtkColorSwatch { + box-shadow: none; } + :selected GtkColorSwatch.overlay, :selected GtkColorSwatch.overlay:hover { + border-color: #ffffff; } + GtkColorSwatch:selected { + box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); } GtkColorSwatch.top { border-top-left-radius: 5px; border-top-right-radius: 5px; } @@ -4368,7 +4374,7 @@ GtkColorSwatch { border-bottom-right-radius: 5px; } GtkColorSwatch:only-child, GtkColorSwatch:only-child .overlay { border-radius: 5px; } - GtkColorSwatch:hover { + GtkColorSwatch:hover, GtkColorSwatch:hover:selected { background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0) 50%); box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), inset 0 -1px rgba(0, 0, 0, 0.4); } GtkColorSwatch:backdrop { @@ -4391,9 +4397,9 @@ GtkColorSwatch { outline-color: rgba(255, 255, 255, 0.5); } GtkColorSwatch.color-light:backdrop { color: rgba(0, 0, 0, 0.3); } - GtkColorSwatch.overlay { + GtkColorSwatch.overlay, GtkColorSwatch.overlay:selected { border: 1px solid #1c1f1f; } - GtkColorSwatch.overlay:hover { + GtkColorSwatch.overlay:hover, GtkColorSwatch.overlay:selected:hover { border-color: black; } GtkColorSwatch#add-color-button { border-style: solid; @@ -4427,10 +4433,6 @@ GtkColorSwatch { box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0); text-shadow: none; icon-shadow: none; } - :selected GtkColorSwatch { - box-shadow: none; } - :selected GtkColorSwatch.overlay { - border-color: #ffffff; } /******** * Misc * diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css index 5ed69f378f..e9ee1d29b1 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained.css +++ b/gtk/resources/theme/Adwaita/gtk-contained.css @@ -4515,6 +4515,12 @@ GtkInfoBar { *****************/ GtkColorSwatch { box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px white; } + :selected GtkColorSwatch { + box-shadow: none; } + :selected GtkColorSwatch.overlay, :selected GtkColorSwatch.overlay:hover { + border-color: #ffffff; } + GtkColorSwatch:selected { + box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px white; } GtkColorSwatch.top { border-top-left-radius: 5px; border-top-right-radius: 5px; } @@ -4529,7 +4535,7 @@ GtkColorSwatch { border-bottom-right-radius: 5px; } GtkColorSwatch:only-child, GtkColorSwatch:only-child .overlay { border-radius: 5px; } - GtkColorSwatch:hover { + GtkColorSwatch:hover, GtkColorSwatch:hover:selected { background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0) 50%); box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), inset 0 -1px rgba(0, 0, 0, 0.1); } GtkColorSwatch:backdrop { @@ -4552,9 +4558,9 @@ GtkColorSwatch { outline-color: rgba(255, 255, 255, 0.5); } GtkColorSwatch.color-light:backdrop { color: rgba(0, 0, 0, 0.3); } - GtkColorSwatch.overlay { + GtkColorSwatch.overlay, GtkColorSwatch.overlay:selected { border: 1px solid rgba(0, 0, 0, 0.3); } - GtkColorSwatch.overlay:hover { + GtkColorSwatch.overlay:hover, GtkColorSwatch.overlay:selected:hover { border-color: rgba(0, 0, 0, 0.5); } GtkColorSwatch#add-color-button { border-style: solid; @@ -4588,10 +4594,6 @@ GtkColorSwatch { box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; icon-shadow: none; } - :selected GtkColorSwatch { - box-shadow: none; } - :selected GtkColorSwatch.overlay { - border-color: #ffffff; } /******** * Misc *