[gnome-taquin] Improve transitions.

[Arnaud B. <arnaudb src gnome org>]

commit 89473e903bfe729d82f6299bcfd11f78a61472ba
Author: Arnaud Bonatti <arnaud bonatti gmail com>
Date:   Thu Jan 24 09:13:33 2019 +0100

    Improve transitions.

 data/taquin.css | 41 ++++++++++++++++++++++++++++++-----------
 1 file changed, 30 insertions(+), 11 deletions(-)
---
diff --git a/data/taquin.css b/data/taquin.css
index d15e271..6e5c62e 100644
--- a/data/taquin.css
+++ b/data/taquin.css
@@ -47,11 +47,11 @@ button.radio-like-toggle#radio-sixteen { background-image: url("resource://org/g
 
   background-repeat:no-repeat;
   background-color:transparent;
+  min-width:10rem;
 
   background-size:12rem;
   background-position:center bottom;
   min-height:13rem;
-  min-width:10rem;
   padding:0.5rem 1rem 1rem 1rem;
 }
 
@@ -63,8 +63,10 @@ button.radio-like-toggle#radio-sixteen { background-image: url("resource://org/g
 }
 
                   .flat-window:not(.extra-thin-window) button.radio-like-toggle {
-  background-size:8rem;
-  min-height:9rem;
+  background-size:8rem;              /*
+  background-position:center bottom; */
+  min-height:9rem;                   /*
+  padding:0.5rem 1rem 1rem 1rem;     */
 }
 
 .extra-flat-window.flat-window                         button.radio-like-toggle {
@@ -79,14 +81,29 @@ button.radio-like-toggle#radio-sixteen { background-image: url("resource://org/g
                   .flat-window:not(.extra-thin-window) button.radio-like-toggle label { padding-bottom: 
6rem; }
 .extra-flat-window.flat-window                         button.radio-like-toggle label { padding-bottom: 
0rem; }
 
-/* hack: help fixing the race between CSS and box orientation changes */
-                                                       button.radio-like-toggle,  /* for all, because there 
are others */
-                 .extra-flat-window.extra-thin-window  button.radio-like-toggle,  /* switch from phone_hztl 
window to phone_both window */
-                        window:not(.extra-thin-window) button.radio-like-toggle { /* switch from phone_vert 
window to usual size window */
-  transition:background-size     0s ease 0.01s,
-             background-position 0s ease 0.01s,
-             min-height          0s ease 0.01s,
-             padding             0s ease 0.01s;
+/* transitions */
+
+                                   .extra-thin-window  button.radio-like-toggle,
+                       .flat-window.extra-thin-window  button.radio-like-toggle,
+     .extra-flat-window.flat-window.extra-thin-window  button.radio-like-toggle,
+                 .flat-window                          button.radio-like-toggle,
+      window:not(.flat-window):not(.extra-thin-window) button.radio-like-toggle {
+  transition:background-size     0.3s,
+             min-height          0.3s,
+             padding             0.3s;
+}
+                                   .extra-thin-window  button.radio-like-toggle label,
+                       .flat-window.extra-thin-window  button.radio-like-toggle label,
+     .extra-flat-window.flat-window.extra-thin-window  button.radio-like-toggle label,
+                 .flat-window                          button.radio-like-toggle label,
+      window:not(.flat-window):not(.extra-thin-window) button.radio-like-toggle label {
+  transition:padding-bottom      0.3s ease 0.01s;
+}
+
+/* hack: 0.01s delay helps fixing the race between CSS and box orientation changes (warning if a label gets 
out of view) */
+                                                       button.radio-like-toggle {
+  transition-delay:                        0.01s;
+  transition-timing-function:         ease;
 }
 
 /*\
@@ -101,6 +118,8 @@ button.radio-like-toggle#radio-sixteen { background-image: url("resource://org/g
                    button.menubutton-like-combo {
   min-height:3rem;
   min-width:11rem;
+
+  transition:min-height          0.3s ease 0.01s;
 }
 
 /* styling */