[gtk+] Adwaita: try to be nicer on performances with entry shadows
- From: Lapo Calamandrei <lapo src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] Adwaita: try to be nicer on performances with entry shadows
- Date: Thu, 21 Aug 2014 13:39:18 +0000 (UTC)
commit 09286cf96876a61f42dcef98385aeb277b2db7d2
Author: Lapo Calamandrei <calamandrei gmail com>
Date: Thu Aug 21 14:41:29 2014 +0200
Adwaita: try to be nicer on performances with entry shadows
gtk/resources/theme/Adwaita/_drawing.scss | 41 ++++++++++----------
gtk/resources/theme/Adwaita/gtk-contained-dark.css | 26 ++++++------
gtk/resources/theme/Adwaita/gtk-contained.css | 26 ++++++------
3 files changed, 47 insertions(+), 46 deletions(-)
---
diff --git a/gtk/resources/theme/Adwaita/_drawing.scss b/gtk/resources/theme/Adwaita/_drawing.scss
index e3ced72..1ed62cc 100644
--- a/gtk/resources/theme/Adwaita/_drawing.scss
+++ b/gtk/resources/theme/Adwaita/_drawing.scss
@@ -34,38 +34,38 @@ $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,20%),1);
-
$_blank_edge: if($noedge, none, 0 1px transparentize(white,1));
$_entry_edge: if($noedge, none, $widget_edge);
+ $_inner_shadows: inset 0 3px mix(black, $base_color, 3%),
+ inset 0 1px mix(black, $base_color, 18%);
+ @if $variant == 'dark' {
+ $_inner_shadows: inset 0 3px mix(black, $base_color, 20%),
+ inset 0 1px mix(black, $base_color, 35%);
+ }
+
+ // 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 transparentize(mix(black, $base_color, 5%),1),
+ inset 0 1px transparentize(mix(black, $base_color, 18%),1);
+ $_focus_glow_color: if($variant=='light', transparentize($fc,0.85),
+ transparentize($fc,0.3));
@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, 20%),1),
+ @include _shadows($_inner_shadows,
+ inset 0 0 0 1px transparentize($fc,1),
$_entry_edge);
// the second transparent shadow is needed for the transition to work
}
@if $t==focus {
- @if $variant == 'light' {
- border-color: $fc;
- @include _shadows(inset 0 2px 2px -2px mix(black, $base_color, 50%),
- inset 0 0 2px 1px mix($fc,$base_color, 20%),
- $_entry_edge);
- }
+ @include _shadows($_inner_shadows,
+ inset 0 0 0 1px $_focus_glow_color,
+ $_entry_edge);
+ @if $variant == 'light' { border-color: $fc; }
@else {
border-color: if($fc==$selected_bg_color,
$selected_borders_color,
darken($fc,35%));
- @include _shadows(inset 0 2px 2px -2px mix(black, $base_color, 50%),
- inset 0 0 1px 1px $fc,
- $_entry_edge);
}
}
@if $t==insensitive {
@@ -91,7 +91,8 @@ $widget_edge: 0 1px $borders_edge; //outer hilight "used" on
// buttons
- function _border_color ($c) { @return darken($c,25%); } // colored buttons want the border form the base
color
+ function _border_color ($c) { @return darken($c,25%); } // colored buttons want the
+ // border form the base color
@function _text_shadow_color ($tc:$fg_color, $bg:$bg_color) {
//
diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index f175c17..4a81df2 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -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, inset 0 0 2px 1px rgba(39, 51, 64, 0), 0 1px rgba(238, 238, 236,
0.1); }
+ box-shadow: inset 0 3px #202020, inset 0 1px #1a1a1a, inset 0 0 0 1px rgba(33, 93, 156, 0), 0 1px
rgba(238, 238, 236, 0.1); }
.entry.image.left {
padding-left: 0; }
.entry.image.right {
@@ -162,7 +162,7 @@
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
- box-shadow: inset 0 2px 2px -2px #141414, inset 0 0 2px 1px rgba(39, 51, 64, 0);
+ box-shadow: inset 0 3px #202020, inset 0 1px #1a1a1a, inset 0 0 0 1px rgba(33, 93, 156, 0);
border: none;
border-radius: 0; }
.entry:focus {
@@ -170,8 +170,8 @@
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
- border-color: #0f2b48;
- box-shadow: inset 0 2px 2px -2px #141414, inset 0 0 1px 1px #215d9c, 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 3px #202020, inset 0 1px #1a1a1a, inset 0 0 0 1px rgba(33, 93, 156, 0.7), 0 1px
rgba(238, 238, 236, 0.1);
+ border-color: #0f2b48; }
.entry:insensitive {
background-color: transparent;
border-style: solid;
@@ -180,7 +180,7 @@
color: #939695;
border-color: #1c1f1f;
background-image: linear-gradient(to bottom, #323636);
- box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(39, 51, 64, 0), 0 1px
rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 2px rgba(38, 38, 38, 0), inset 0 1px rgba(33, 33, 33, 0), 0 1px rgba(238, 238, 236,
0.1); }
.entry:backdrop {
background-color: transparent;
border-style: solid;
@@ -189,7 +189,7 @@
color: #c9cbc9;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #2c2c2c);
- box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(39, 51, 64, 0), 0 1px
rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px rgba(38, 38, 38, 0), inset 0 1px rgba(33, 33, 33, 0), 0 1px rgba(255, 255, 255,
0); }
.entry:backdrop:insensitive {
background-color: transparent;
border-style: solid;
@@ -198,7 +198,7 @@
color: #5d6767;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #323636);
- box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(39, 51, 64, 0), 0 1px
rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px rgba(38, 38, 38, 0), inset 0 1px rgba(33, 33, 33, 0), 0 1px rgba(255, 255, 255,
0); }
.entry:selected, .entry:backdrop:selected {
background-color: #215d9c;
color: white; }
@@ -232,8 +232,8 @@
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
- border-color: #1a0000;
- box-shadow: inset 0 2px 2px -2px #141414, inset 0 0 1px 1px #cc0000, 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 3px #202020, inset 0 1px #1a1a1a, inset 0 0 0 1px rgba(204, 0, 0, 0.7), 0 1px
rgba(238, 238, 236, 0.1);
+ border-color: #1a0000; }
.entry.error:selected, .entry.error:selected:focus {
background-color: #cc0000; }
.entry.error:selected:focus {
@@ -248,8 +248,8 @@
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
- border-color: #432100;
- box-shadow: inset 0 2px 2px -2px #141414, inset 0 0 1px 1px #f57900, 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 3px #202020, inset 0 1px #1a1a1a, inset 0 0 0 1px rgba(245, 121, 0, 0.7), 0 1px
rgba(238, 238, 236, 0.1);
+ border-color: #432100; }
.entry.warning:selected, .entry.warning:selected:focus {
background-color: #f57900; }
.entry.warning:selected:focus {
@@ -2459,7 +2459,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, inset 0 0 2px 1px rgba(39, 51, 64, 0), 0 1px rgba(238, 238, 236,
0.1); }
+ box-shadow: inset 0 3px #202020, inset 0 1px #1a1a1a, inset 0 0 0 1px rgba(33, 93, 156, 0), 0 1px
rgba(238, 238, 236, 0.1); }
.level-bar.trough:backdrop {
background-color: transparent;
border-style: solid;
@@ -2468,7 +2468,7 @@ GtkLevelBar.vertical {
color: #c9cbc9;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #2c2c2c);
- box-shadow: inset 0 2px 2px -2px rgba(20, 20, 20, 0), inset 0 0 2px 1px rgba(39, 51, 64, 0), 0 1px
rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px rgba(38, 38, 38, 0), inset 0 1px rgba(33, 33, 33, 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 4203fcb..35f1ccb 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -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, inset 0 0 2px 1px rgba(218, 232, 247, 0), 0 1px white; }
+ box-shadow: inset 0 3px #f7f7f7, inset 0 1px #d1d1d1, inset 0 0 0 1px rgba(74, 144, 217, 0), 0 1px white; }
.entry.image.left {
padding-left: 0; }
.entry.image.right {
@@ -162,7 +162,7 @@
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
border-color: #a1a1a1;
- box-shadow: inset 0 2px 2px -2px #7f7f7f, inset 0 0 2px 1px rgba(218, 232, 247, 0);
+ box-shadow: inset 0 3px #f7f7f7, inset 0 1px #d1d1d1, inset 0 0 0 1px rgba(74, 144, 217, 0);
border: none;
border-radius: 0; }
.entry:focus {
@@ -170,8 +170,8 @@
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
- border-color: #4a90d9;
- box-shadow: inset 0 2px 2px -2px #7f7f7f, inset 0 0 2px 1px #dae8f7, 0 1px white; }
+ box-shadow: inset 0 3px #f7f7f7, inset 0 1px #d1d1d1, inset 0 0 0 1px rgba(74, 144, 217, 0.15), 0 1px
white;
+ border-color: #4a90d9; }
.entry:insensitive {
background-color: transparent;
border-style: solid;
@@ -180,7 +180,7 @@
color: #8d9091;
border-color: #a1a1a1;
background-image: linear-gradient(to bottom, #f4f4f4);
- box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(218, 232, 247, 0), 0 1px
white; }
+ box-shadow: inset 0 2px rgba(242, 242, 242, 0), inset 0 1px rgba(209, 209, 209, 0), 0 1px white; }
.entry:backdrop {
background-color: transparent;
border-style: solid;
@@ -189,7 +189,7 @@
color: #54595a;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #fcfcfc);
- box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(218, 232, 247, 0), 0 1px
rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px rgba(242, 242, 242, 0), inset 0 1px rgba(209, 209, 209, 0), 0 1px rgba(255, 255,
255, 0); }
.entry:backdrop:insensitive {
background-color: transparent;
border-style: solid;
@@ -198,7 +198,7 @@
color: #c7c7c7;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #f4f4f4);
- box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(218, 232, 247, 0), 0 1px
rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px rgba(242, 242, 242, 0), inset 0 1px rgba(209, 209, 209, 0), 0 1px rgba(255, 255,
255, 0); }
.entry:selected, .entry:backdrop:selected {
background-color: #4a90d9;
color: white; }
@@ -232,8 +232,8 @@
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
- border-color: #cc0000;
- box-shadow: inset 0 2px 2px -2px #7f7f7f, inset 0 0 2px 1px #f4cccc, 0 1px white; }
+ box-shadow: inset 0 3px #f7f7f7, inset 0 1px #d1d1d1, inset 0 0 0 1px rgba(204, 0, 0, 0.15), 0 1px
white;
+ border-color: #cc0000; }
.entry.error:selected, .entry.error:selected:focus {
background-color: #cc0000; }
.entry.warning {
@@ -244,8 +244,8 @@
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
- border-color: #f57900;
- box-shadow: inset 0 2px 2px -2px #7f7f7f, inset 0 0 2px 1px #fde4cc, 0 1px white; }
+ box-shadow: inset 0 3px #f7f7f7, inset 0 1px #d1d1d1, inset 0 0 0 1px rgba(245, 121, 0, 0.15), 0 1px
white;
+ border-color: #f57900; }
.entry.warning:selected, .entry.warning:selected:focus {
background-color: #f57900; }
.entry.image {
@@ -2454,7 +2454,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, inset 0 0 2px 1px rgba(218, 232, 247, 0), 0 1px white; }
+ box-shadow: inset 0 3px #f7f7f7, inset 0 1px #d1d1d1, inset 0 0 0 1px rgba(74, 144, 217, 0), 0 1px white; }
.level-bar.trough:backdrop {
background-color: transparent;
border-style: solid;
@@ -2463,7 +2463,7 @@ GtkLevelBar.vertical {
color: #54595a;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #fcfcfc);
- box-shadow: inset 0 2px 2px -2px rgba(127, 127, 127, 0), inset 0 0 2px 1px rgba(218, 232, 247, 0), 0 1px
rgba(255, 255, 255, 0); }
+ box-shadow: inset 0 2px rgba(242, 242, 242, 0), inset 0 1px rgba(209, 209, 209, 0), 0 1px rgba(255, 255,
255, 0); }
.level-bar.fill-block {
border-width: 1px;
border-style: solid;
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]