Adwaita: better colorswatches for the dark theme

...which reveals a "nice" border/fill border radius issue.
This commit is contained in:
Lapo Calamandrei
2014-07-18 23:48:33 +02:00
parent e2cf8d2125
commit 663a50dd4e
3 changed files with 47 additions and 11 deletions

View File

@@ -525,8 +525,15 @@ GtkLabel {
}
}
GtkColorButton.button { padding: 4px; } // Uniform padding on the
// GtkColorButton.button
GtkColorButton.button {
padding: 4px; // Uniform padding on the GtkColorButton
GtkColorSwatch {
border-radius: 1.5px;
box-shadow: inset 0 1px 1px transparentize(black, 0.8),
$widget_edge;
&:backdrop { box-shadow: none; }
}
}
/*********
* Links *
@@ -2295,8 +2302,16 @@ GtkInfoBar {
GtkColorSwatch {
border: 1px solid transparentize(black,0.7);
box-shadow: inset 0 1px 1px transparentize(black, 0.8);
border-width: 1px;
border-style: solid;
@if $variant == light {
border-color: transparentize(black,0.7);
box-shadow: inset 0 1px 1px transparentize(black, 0.8);
}
@else {
border-color: $borders_color;
box-shadow: inset 0 1px 1px transparentize(black, 0.6);
}
&.color-light {
&:hover {
@@ -2315,9 +2330,16 @@ GtkColorSwatch {
}
}
&:hover { border-color: transparentize(black, 0.5); }
&:hover {
border-color: if($variant=='light', transparentize(black, 0.5),
$backdrop_borders_color);
}
&:backdrop { border-color: transparentize(black,0.8); box-shadow: none; }
&:backdrop {
border-color: if($variant=='light', transparentize(black,0.8),
$backdrop_borders_color);
box-shadow: none;
}
&.top {
border-top-left-radius: 5px;

View File

@@ -634,6 +634,11 @@
GtkColorButton.button {
padding: 4px; }
GtkColorButton.button GtkColorSwatch {
border-radius: 1.5px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px rgba(238, 238, 236, 0.1); }
GtkColorButton.button GtkColorSwatch:backdrop {
box-shadow: none; }
/*********
* Links *
@@ -2860,8 +2865,10 @@ GtkInfoBar {
* Color Chooser *
*****************/
GtkColorSwatch {
border: 1px solid rgba(0, 0, 0, 0.3);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2); }
border-width: 1px;
border-style: solid;
border-color: #1c1f1f;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.4); }
GtkColorSwatch.color-light:hover {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.4)); }
GtkColorSwatch.color-light:hover:backdrop {
@@ -2871,9 +2878,9 @@ GtkColorSwatch {
GtkColorSwatch.color-dark:hover:backdrop {
background-image: none; }
GtkColorSwatch:hover {
border-color: rgba(0, 0, 0, 0.5); }
border-color: #1e2222; }
GtkColorSwatch:backdrop {
border-color: rgba(0, 0, 0, 0.2);
border-color: #1e2222;
box-shadow: none; }
GtkColorSwatch.top {
border-top-left-radius: 5px;

View File

@@ -626,6 +626,11 @@
GtkColorButton.button {
padding: 4px; }
GtkColorButton.button GtkColorSwatch {
border-radius: 1.5px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px white; }
GtkColorButton.button GtkColorSwatch:backdrop {
box-shadow: none; }
/*********
* Links *
@@ -2852,7 +2857,9 @@ GtkInfoBar {
* Color Chooser *
*****************/
GtkColorSwatch {
border: 1px solid rgba(0, 0, 0, 0.3);
border-width: 1px;
border-style: solid;
border-color: rgba(0, 0, 0, 0.3);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2); }
GtkColorSwatch.color-light:hover {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.4)); }