summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorLapo Calamandrei <calamandrei@gmail.com>2014-07-07 17:21:52 +0200
committerLapo Calamandrei <calamandrei@gmail.com>2014-07-07 17:27:57 +0200
commit607bac7c69d430ea45c0a35760e98ca8bad2a821 (patch)
treee94067ffd04b25bb370913f9d5436544cf8474a3
parent7c1f43f124c4cbf433dcc9a677d0ce1769b17a0c (diff)
downloadgtk+-607bac7c69d430ea45c0a35760e98ca8bad2a821.tar.gz
Adwaita: entry shadows work.
For the transition to work the box-shadows types in the shadow list needs to be matched in various states so I'm using transparent shadows istead of resetting them when not needed.
-rw-r--r--gtk/resources/theme/Adwaita/_drawing.scss17
-rw-r--r--gtk/resources/theme/Adwaita/gtk-contained-dark.css14
-rw-r--r--gtk/resources/theme/Adwaita/gtk-contained.css14
3 files changed, 28 insertions, 17 deletions
diff --git a/gtk/resources/theme/Adwaita/_drawing.scss b/gtk/resources/theme/Adwaita/_drawing.scss
index 1b7562e029..3d386ef13d 100644
--- a/gtk/resources/theme/Adwaita/_drawing.scss
+++ b/gtk/resources/theme/Adwaita/_drawing.scss
@@ -34,13 +34,23 @@ $widget_edge: 0 1px $borders_edge; //outer hilight "used" on
background-image: linear-gradient(to bottom,
darken($base_color,3%),
$base_color 90%);
+ // we need to match the same shadow types (inset/outset) in various states
+ // hence transparent shadows istead of resetting them when not needed
+ $_blank_inner_shadows: inset 0 2px 2px -2px transparentize(
+ mix(black, $base_color, 50%),1),
+ inset 0 0 2px 1px transparentize(
+ mix($fc,$base_color),1);
+ $_blank_edge: if($noedge, none, 0 1px transparentize(white,1));
+
$_entry_edge: $widget_edge;
@if $noedge { $_entry_edge: none; }
@if $t==normal {
border-color: $borders_color;
@include _shadows(inset 0 2px 2px -2px mix(black, $base_color, 50%),
+ inset 0 0 2px 1px transparentize(mix($fc,$base_color),1),
$_entry_edge);
+ // the second transparent shadow is needed for the transition to work
}
@if $t==focus {
@if $variant == 'light' {
@@ -62,17 +72,18 @@ $widget_edge: 0 1px $borders_edge; //outer hilight "used" on
color: $insensitive_fg_color;
border-color: $borders_color;
background-image: linear-gradient(to bottom, $insensitive_bg_color);
- @include _shadows($_entry_edge);
+ @include _shadows($_blank_inner_shadows, $_entry_edge);
+
}
@if $t==backdrop {
color: $backdrop_fg_color;
background-image: linear-gradient(to bottom, $backdrop_base_color);
- box-shadow: 0 1px transparentize(white,1);
+ @include _shadows($_blank_inner_shadows, $_blank_edge);
}
@if $t==backdrop-insensitive {
color: $backdrop_insensitive_color;
background-image: linear-gradient(to bottom, $backdrop_bg_color);
- box-shadow: 0 1px transparentize(white,1);
+ @include _shadows($_blank_inner_shadows, $_blank_edge);
}
}
diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index b3682d6e54..08a1955ab7 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -142,7 +142,7 @@
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
- box-shadow: inset 0 2px 2px -2px #141414, 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 2px 2px -2px #141414, inset 0 0 2px 1px rgba(37, 67, 98, 0), 0 1px rgba(238, 238, 236, 0.1); }
.entry.flat, .entry.flat:focus {
padding: 2px;
background-color: transparent;
@@ -150,7 +150,7 @@
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
- box-shadow: inset 0 2px 2px -2px #141414;
+ box-shadow: inset 0 2px 2px -2px #141414, inset 0 0 2px 1px rgba(37, 67, 98, 0);
border: none;
border-radius: 0; }
.entry:focus {
@@ -168,7 +168,7 @@
color: #939695;
border-color: #1c1f1f;
background-image: linear-gradient(to bottom, #323636);
- box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(37, 67, 98, 0), 0 1px rgba(238, 238, 236, 0.1); }
.entry:backdrop {
background-color: transparent;
border-style: solid;
@@ -176,7 +176,7 @@
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #c9cbc9;
background-image: linear-gradient(to bottom, #2c2c2c);
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(37, 67, 98, 0), 0 1px rgba(255, 255, 255, 0); }
.entry:backdrop:insensitive {
background-color: transparent;
border-style: solid;
@@ -184,7 +184,7 @@
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #454c4c;
background-image: linear-gradient(to bottom, #393f3f);
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(37, 67, 98, 0), 0 1px rgba(255, 255, 255, 0); }
.entry:selected, .entry:backdrop:selected {
background-color: #215d9c;
color: white; }
@@ -2244,7 +2244,7 @@ GtkLevelBar.vertical {
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
- box-shadow: inset 0 2px 2px -2px #141414, 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 2px 2px -2px #141414, inset 0 0 2px 1px rgba(37, 67, 98, 0), 0 1px rgba(238, 238, 236, 0.1); }
.level-bar.trough:backdrop {
background-color: transparent;
border-style: solid;
@@ -2252,7 +2252,7 @@ GtkLevelBar.vertical {
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #c9cbc9;
background-image: linear-gradient(to bottom, #2c2c2c);
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(37, 67, 98, 0), 0 1px rgba(255, 255, 255, 0); }
.level-bar.fill-block {
border-width: 1px;
border-style: solid;
diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css
index 2c513654d6..cad9be7cf5 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -142,7 +142,7 @@
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
border-color: #a1a1a1;
- box-shadow: inset 0 2px 2px -2px #7f7f7f, 0 1px white; }
+ box-shadow: inset 0 2px 2px -2px #7f7f7f, inset 0 0 2px 1px rgba(164, 199, 236, 0), 0 1px white; }
.entry.flat, .entry.flat:focus {
padding: 2px;
background-color: transparent;
@@ -150,7 +150,7 @@
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
border-color: #a1a1a1;
- box-shadow: inset 0 2px 2px -2px #7f7f7f;
+ box-shadow: inset 0 2px 2px -2px #7f7f7f, inset 0 0 2px 1px rgba(164, 199, 236, 0);
border: none;
border-radius: 0; }
.entry:focus {
@@ -168,7 +168,7 @@
color: #8d9091;
border-color: #a1a1a1;
background-image: linear-gradient(to bottom, #f4f4f4);
- box-shadow: 0 1px white; }
+ box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(164, 199, 236, 0), 0 1px white; }
.entry:backdrop {
background-color: transparent;
border-style: solid;
@@ -176,7 +176,7 @@
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
color: #54595a;
background-image: linear-gradient(to bottom, #fcfcfc);
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(164, 199, 236, 0), 0 1px rgba(255, 255, 255, 0); }
.entry:backdrop:insensitive {
background-color: transparent;
border-style: solid;
@@ -184,7 +184,7 @@
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
color: #c7c7c7;
background-image: linear-gradient(to bottom, #ededed);
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(164, 199, 236, 0), 0 1px rgba(255, 255, 255, 0); }
.entry:selected, .entry:backdrop:selected {
background-color: #4a90d9;
color: white; }
@@ -2235,7 +2235,7 @@ GtkLevelBar.vertical {
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
border-color: #a1a1a1;
- box-shadow: inset 0 2px 2px -2px #7f7f7f, 0 1px white; }
+ box-shadow: inset 0 2px 2px -2px #7f7f7f, inset 0 0 2px 1px rgba(164, 199, 236, 0), 0 1px white; }
.level-bar.trough:backdrop {
background-color: transparent;
border-style: solid;
@@ -2243,7 +2243,7 @@ GtkLevelBar.vertical {
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
color: #54595a;
background-image: linear-gradient(to bottom, #fcfcfc);
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(164, 199, 236, 0), 0 1px rgba(255, 255, 255, 0); }
.level-bar.fill-block {
border-width: 1px;
border-style: solid;