[gtk+] Adwaita: fix selected colorswatch white border
- From: Lapo Calamandrei <lapo src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] Adwaita: fix selected colorswatch white border
- Date: Wed, 29 Oct 2014 18:51:31 +0000 (UTC)
commit 43a2676c3ffd8647c8fed1b499c453d41500bf6f
Author: Lapo Calamandrei <calamandrei gmail com>
Date: Wed Oct 29 19:50:58 2014 +0100
Adwaita: fix selected colorswatch white border
gtk/resources/theme/Adwaita/_common.scss | 30 ++++++++++++--------
gtk/resources/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 e7b4d56..2216e28 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 a264511..892b18d 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 5ed69f3..e9ee1d2 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 *
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]