[gtk+] Adwaita: more sass functions remixing
- From: Lapo Calamandrei <lapo src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] Adwaita: more sass functions remixing
- Date: Wed, 3 Sep 2014 18:42:13 +0000 (UTC)
commit 356e02fc78385680887ba7d1a971e3836985b362
Author: Lapo Calamandrei <calamandrei gmail com>
Date: Wed Sep 3 20:40:43 2014 +0200
Adwaita: more sass functions remixing
gtk/resources/theme/Adwaita/_colors.scss | 8 +++---
gtk/resources/theme/Adwaita/_drawing.scss | 20 +++++++++++++---
gtk/resources/theme/Adwaita/gtk-contained-dark.css | 8 +++---
gtk/resources/theme/Adwaita/gtk-contained.css | 24 ++++++++++----------
4 files changed, 36 insertions(+), 24 deletions(-)
---
diff --git a/gtk/resources/theme/Adwaita/_colors.scss b/gtk/resources/theme/Adwaita/_colors.scss
index eafc182..c79f523 100644
--- a/gtk/resources/theme/Adwaita/_colors.scss
+++ b/gtk/resources/theme/Adwaita/_colors.scss
@@ -7,13 +7,13 @@ $bg_color: if($variant =='light', #ededed, #393f3f);
$fg_color: if($variant =='light', #2e3436, #eeeeec);
$selected_fg_color: #ffffff;
-$selected_bg_color: if($variant =='light', #4a90d9, darken(#4a90d9,20%));
-$selected_borders_color: if($variant == 'light', darken($selected_bg_color, 30%),
darken($selected_bg_color,20%));
- // FIXME dark variant color
+$selected_bg_color: if($variant == 'light', #4a90d9, darken(#4a90d9,20%));
+$selected_borders_color: if($variant=='light', darken($selected_bg_color, 30%),
+ darken($selected_bg_color, 20%));
$borders_color: if($variant =='light', darken($bg_color,30%), darken($bg_color,12%));
$borders_edge: if($variant =='light', white, transparentize($fg_color, 0.9));
$link_color: darken($selected_bg_color,10%);
-$top_hilight: if($variant =='light', white, transparentize($fg_color, 0.9));
+$top_hilight: $borders_edge;
$warning_color: #f57900;
$error_color: #cc0000;
diff --git a/gtk/resources/theme/Adwaita/_drawing.scss b/gtk/resources/theme/Adwaita/_drawing.scss
index 371af4a..571d0e1 100644
--- a/gtk/resources/theme/Adwaita/_drawing.scss
+++ b/gtk/resources/theme/Adwaita/_drawing.scss
@@ -110,6 +110,19 @@
@else { @return transparentize(black,$_lbg*0.8); }
}
+ function _button_hilight_color($c) {
+//
+// calculate the right top hilight color for buttons
+//
+// $c: base color;
+//
+ @if lightness($c)>90% { @return white; }
+ @else if lightness($c)>80% { @return transparentize(white, 0.3); }
+ @else if lightness($c)>50% { @return transparentize(white, 0.5); }
+ @else if lightness($c)>40% { @return transparentize(white, 0.7); }
+ @else { @return transparentize(white, 0.9); }
+}
+
@mixin _button_text_shadow ($tc:$fg_color, $bg:$bg_color) {
//
// helper function for the text emboss effect
@@ -147,8 +160,7 @@
// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
//
- $_top_hilight: if(lightness($c)> 70%, white, transparentize(white,0.9)); //not just dark/light but colored
buttons
-
+ $_hilight_color: _button_hilight_color($c);
$_button_edge: if($edge == none, none, _widget_edge($edge));
$_blank_edge: if($edge == none, none, _widget_edge(transparentize($edge,1)));
@@ -167,7 +179,7 @@
@else { border-color: $borders_color; }
@include _button_text_shadow($tc,$c);
- @include _shadows(inset 0 1px $_top_hilight, $_button_edge);
+ @include _shadows(inset 0 1px $_hilight_color, $_button_edge);
}
@else if $t==hover {
@@ -183,7 +195,7 @@
$c);
@include _button_text_shadow($tc,lighten($c,4%));
- @include _shadows(inset 0 1px $_top_hilight, $_button_edge);
+ @include _shadows(inset 0 1px $_hilight_color, $_button_edge);
}
@else if $t==active {
diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index 29cf305..2b03675 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -551,7 +551,7 @@ GtkFlowBox .grid-child {
border-color: #5e0707;
text-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px rgba(238, 238, 236, 0.1);
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px rgba(238, 238, 236, 0.1);
outline-color: rgba(255, 255, 255, 0.3); }
.button.destructive-action:hover {
color: white;
@@ -559,7 +559,7 @@ GtkFlowBox .grid-child {
background-image: linear-gradient(to bottom, #f03c3c, #e81111 40%, #d51010);
text-shadow: 0 -1px rgba(0, 0, 0, 0.60878);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.60878);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px rgba(238, 238, 236, 0.1); }
.button.destructive-action:active, .button.destructive-action:checked {
color: white;
border-color: #5e0707;
@@ -3254,14 +3254,14 @@ GtkCalendar {
border-color: #5e0707;
text-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.3); }
.message-dialog.csd .dialog-action-area .button.destructive-action:hover {
color: white;
border-color: #5e0707;
background-image: linear-gradient(to bottom, #f03c3c, #e81111 40%, #d51010);
text-shadow: 0 -1px rgba(0, 0, 0, 0.60878);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.60878);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.3); }
.message-dialog.csd .dialog-action-area .button.destructive-action:active {
color: white;
border-color: #5e0707;
diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css
index 0f46d95..d9c2ffa 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -461,7 +461,7 @@ GtkFlowBox .grid-child {
border-color: #1c5187;
text-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px white;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px white;
outline-color: rgba(255, 255, 255, 0.3); }
.button.suggested-action:hover {
color: white;
@@ -469,7 +469,7 @@ GtkFlowBox .grid-child {
background-image: linear-gradient(to bottom, #85b4e5, #5b9add 40%, #4a90d9);
text-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px white; }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px white; }
.button.suggested-action:active, .button.suggested-action:checked {
color: white;
border-color: #1c5187;
@@ -543,7 +543,7 @@ GtkFlowBox .grid-child {
border-color: #8e0b0b;
text-shadow: 0 -1px rgba(0, 0, 0, 0.56078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.56078);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px white;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px white;
outline-color: rgba(255, 255, 255, 0.3); }
.button.destructive-action:hover {
color: white;
@@ -551,7 +551,7 @@ GtkFlowBox .grid-child {
background-image: linear-gradient(to bottom, #f46b6b, #f03c3c 40%, #ef2929);
text-shadow: 0 -1px rgba(0, 0, 0, 0.52878);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.52878);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px white; }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px white; }
.button.destructive-action:active, .button.destructive-action:checked {
color: white;
border-color: #8e0b0b;
@@ -1218,7 +1218,7 @@ GtkComboBox {
border-color: #1c5187;
text-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.titlebar.selection-mode .button:hover, GtkCalendar.selection-mode.header .button:hover,
.header-bar.selection-mode .button:hover {
color: #ffffff;
@@ -1226,7 +1226,7 @@ GtkComboBox {
background-image: linear-gradient(to bottom, #85b4e5, #5b9add 40%, #4a90d9);
text-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.titlebar.selection-mode .button:active, GtkCalendar.selection-mode.header .button:active,
.titlebar.selection-mode .button:checked, GtkCalendar.selection-mode.header .button:checked,
.header-bar.selection-mode .button:active,
.header-bar.selection-mode .button:checked {
@@ -3355,14 +3355,14 @@ GtkCalendar {
border-color: #1c5187;
text-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.message-dialog.csd .dialog-action-area .button.suggested-action:hover {
color: white;
border-color: #1c5187;
background-image: linear-gradient(to bottom, #85b4e5, #5b9add 40%, #4a90d9);
text-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.message-dialog.csd .dialog-action-area .button.suggested-action:active {
color: white;
border-color: #1c5187;
@@ -3401,14 +3401,14 @@ GtkCalendar {
border-color: #8e0b0b;
text-shadow: 0 -1px rgba(0, 0, 0, 0.56078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.56078);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.message-dialog.csd .dialog-action-area .button.destructive-action:hover {
color: white;
border-color: #8e0b0b;
background-image: linear-gradient(to bottom, #f46b6b, #f03c3c 40%, #ef2929);
text-shadow: 0 -1px rgba(0, 0, 0, 0.52878);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.52878);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.message-dialog.csd .dialog-action-area .button.destructive-action:active {
color: white;
border-color: #8e0b0b;
@@ -3523,7 +3523,7 @@ GtkInfoBar {
border-color: #1c5187;
text-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.info .button:hover,
.question .button:hover,
.warning .button:hover,
@@ -3533,7 +3533,7 @@ GtkInfoBar {
background-image: linear-gradient(to bottom, #85b4e5, #5b9add 40%, #4a90d9);
text-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.5); }
.info .button:active,
.question .button:active,
.warning .button:active,
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]