[gtk+] Revert "Adwaita: only needed properties on entry transition"
- From: Lapo Calamandrei <lapo src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] Revert "Adwaita: only needed properties on entry transition"
- Date: Fri, 19 Feb 2016 13:40:29 +0000 (UTC)
commit 826913135bc3698a014ea53f213206b4c6c34257
Author: Lapo Calamandrei <calamandrei gmail com>
Date: Fri Feb 19 14:38:22 2016 +0100
Revert "Adwaita: only needed properties on entry transition"
Shouldn't be needed with recent Benjamin work.
This reverts commit d57f4a781cbcab7eb0912edf0ccbf811090067ce.
gtk/theme/Adwaita/_common.scss | 35 +++++++++++------------------
gtk/theme/Adwaita/gtk-contained-dark.css | 8 +++---
gtk/theme/Adwaita/gtk-contained.css | 8 +++---
3 files changed, 21 insertions(+), 30 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index f8d646a..6e771d4 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -1,20 +1,9 @@
-$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
-$asset_suffix: if($variant=='dark', '-dark', '');
-
- function transite($properties, $duration, $timing_function) {
- $transition: none;
-
- @each $property in $properties {
- @if $transition == none { $transition: $property $duration $timing_function; }
- @else { $transition: $transition, $property, $duration, $timing_function; }
- }
-
- @return $transition;
+ function gtkalpha($c,$a) {
+ @return unquote("alpha(#{$c},#{$a})");
}
-// this is for using gtk alpha function directly, the function name
-// clashes with the sass function, so we need this trick
- function gtkalpha($c, $a) { @return unquote("alpha(#{$c},#{$a})"); }
+$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
+$asset_suffix: if($variant=='dark', '-dark', '');
* {
padding: 0;
@@ -253,11 +242,7 @@ entry {
}
border-radius: 3px;
-
- // animate just what's needed
- $_entry_transition_properties: color border-color background-color background-image box-shadow;
- transition: transite($_entry_transition_properties, 200ms, $ease-out-quad);
-
+ transition: all 200ms $ease-out-quad;
@include entry(normal);
&.flat,
@@ -408,8 +393,14 @@ button {
@at-root %button_basic, & {
// animating "all" is not needed and also triggers some weird gtk sizing issue so, the transition is
restricted
// to just the needed properties (see $_button_transition_properties).
- $_button_transition_properties: color background-color background-image border-color box-shadow
text-shadow -gtk-icon-shadow;
- $_button_transition: transite($_button_transition_properties, 200ms, $ease-out-quad);
+
+ $_button_transition_details: 200ms $ease-out-quad;
+ $_button_transition_properties: background-color, background-image, border-color, box-shadow,
text-shadow, -gtk-icon-shadow;
+ $_button_transition: color $_button_transition_details;
+
+ @each $single_transition in $_button_transition_properties {
+ $_button_transition: $_button_transition, $single_transition $_button_transition_details;
+ }
min-height: 24px;
min-width: 16px;
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 47fa41b..567813c 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -162,7 +162,7 @@ entry, spinbutton:not(.vertical) {
padding-left: 8px;
padding-right: 8px;
border-radius: 3px;
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94), background-color, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
background-color: #292929;
background-image: linear-gradient(to bottom, #1d2020, #242525 3px, #292929 90%);
color: white;
@@ -349,7 +349,7 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
padding: 4px 8px;
border: 1px solid;
border-radius: 3px;
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94), background-image, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), text-shadow,
200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), -gtk-icon-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 200ms cubic-bezier(0.25,
0.46, 0.45, 0.94), background-image 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color 200ms
cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
border-color: #1c1f1f;
@@ -372,13 +372,13 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
.titlebar notebook > header > tabs > arrow.titlebutton:hover,
.titlebar button.titlebutton:hover, button.flat:hover, notebook > header > tabs > arrow:hover,
button.sidebar-button:hover, headerbar button.titlebutton:hover,
.titlebar button.titlebutton:hover {
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45,
0.94), text-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), -gtk-icon-shadow, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94);
+ transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 200ms
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45,
0.94);
transition-duration: 500ms; }
notebook > header > tabs > arrow.flat:hover:active, headerbar notebook > header > tabs >
arrow.titlebutton:hover:active, headerbar button.titlebutton:hover:active,
.titlebar notebook > header > tabs > arrow.titlebutton:hover:active,
.titlebar button.titlebutton:hover:active, button.flat:hover:active, notebook > header > tabs >
arrow:hover:active, button.sidebar-button:hover:active, headerbar button.titlebutton:hover:active,
.titlebar button.titlebutton:hover:active {
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45,
0.94), text-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), -gtk-icon-shadow, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94); }
+ transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 200ms
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45,
0.94); }
notebook > header > tabs > arrow:hover, headerbar button.titlebutton:hover,
.titlebar button.titlebutton:hover, button:hover {
color: #eeeeec;
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 9e0b2c8..6f7dea9 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -162,7 +162,7 @@ entry, spinbutton:not(.vertical) {
padding-left: 8px;
padding-right: 8px;
border-radius: 3px;
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94), background-color, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
background-color: #ffffff;
background-image: linear-gradient(to bottom, #d3d3d1, #fcfcfc 2px, #ffffff 90%);
color: black;
@@ -349,7 +349,7 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
padding: 4px 8px;
border: 1px solid;
border-radius: 3px;
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94), background-image, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), text-shadow,
200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), -gtk-icon-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 200ms cubic-bezier(0.25,
0.46, 0.45, 0.94), background-image 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color 200ms
cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
color: #2e3436;
outline-color: rgba(46, 52, 54, 0.3);
border-color: #9d9d99;
@@ -372,13 +372,13 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
.titlebar notebook > header > tabs > arrow.titlebutton:hover,
.titlebar button.titlebutton:hover, button.flat:hover, notebook > header > tabs > arrow:hover,
button.sidebar-button:hover, headerbar button.titlebutton:hover,
.titlebar button.titlebutton:hover {
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45,
0.94), text-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), -gtk-icon-shadow, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94);
+ transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 200ms
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45,
0.94);
transition-duration: 500ms; }
notebook > header > tabs > arrow.flat:hover:active, headerbar notebook > header > tabs >
arrow.titlebutton:hover:active, headerbar button.titlebutton:hover:active,
.titlebar notebook > header > tabs > arrow.titlebutton:hover:active,
.titlebar button.titlebutton:hover:active, button.flat:hover:active, notebook > header > tabs >
arrow:hover:active, button.sidebar-button:hover:active, headerbar button.titlebutton:hover:active,
.titlebar button.titlebutton:hover:active {
- transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color, 200ms,
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45,
0.94), text-shadow, 200ms, cubic-bezier(0.25, 0.46, 0.45, 0.94), -gtk-icon-shadow, 200ms, cubic-bezier(0.25,
0.46, 0.45, 0.94); }
+ transition: color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 200ms
cubic-bezier(0.25, 0.46, 0.45, 0.94), background-image 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
border-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45,
0.94); }
notebook > header > tabs > arrow:hover, headerbar button.titlebutton:hover,
.titlebar button.titlebutton:hover, button:hover {
color: #2e3436;
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]