[gnome-sound-recorder] row: add a css transition when you expand it

[Bilal Elmoussaoui <bilelmoussaoui src gnome org>]

commit 816191c4e8f5011c1647b38fcf9abaf500bf4801
Author: Bilal Elmoussaoui <bil elmoussaoui gmail com>
Date:   Sun Aug 16 19:49:50 2020 +0200

    row: add a css transition when you expand it

 data/application.css | 21 ++++++++++++++++++++-
 data/ui/row.ui       |  2 ++
 2 files changed, 22 insertions(+), 1 deletion(-)
---
diff --git a/data/application.css b/data/application.css
index 9261475..500b81b 100644
--- a/data/application.css
+++ b/data/application.css
@@ -15,22 +15,41 @@ list row label.subtitle {
   font-size: smaller;
 }
 
+list row {
+  margin-top: 0;
+  margin-bottom: 0;
+  border-radius: 0;
+}
+
+list row:first-child {
+  border-top-left-radius: 8px;
+  border-top-right-radius: 8px;
+}
+
+list row:last-child {
+  border-bottom-left-radius: 8px;
+  border-bottom-right-radius: 8px;
+}
+
 list row.expanded {
   margin-top: 10px;
   margin-bottom: 10px;
   border-radius: 8px;
   border-bottom-width: 1px;
+  transition: 250ms all linear;
 }
 
 list row.expanded-before {
   border-bottom-width: 1px;
   border-bottom-right-radius: 8px;
   border-bottom-left-radius: 8px;
+  transition: 250ms all linear;
 }
 
 list row.expanded-after {
   border-top-right-radius: 8px;
   border-top-left-radius: 8px;
+  transition: 250ms all linear;
 }
 
 list row:first-child.expanded {
@@ -39,4 +58,4 @@ list row:first-child.expanded {
 
 list row:last-child.expanded {
   margin-bottom: 0;
-}
\ No newline at end of file
+}
diff --git a/data/ui/row.ui b/data/ui/row.ui
index 9763d1f..8d842d3 100644
--- a/data/ui/row.ui
+++ b/data/ui/row.ui
@@ -103,6 +103,8 @@
           <object class="GtkRevealer" id="revealer">
             <property name="visible">True</property>
             <property name="can_focus">False</property>
+            <property name="transition_duration">250</property>
+            <property name="transition_type">GTK_REVEALER_TRANSITION_TYPE_SLIDE_DOWN</property>
             <child>
               <object class="GtkBox">
                 <property name="visible">True</property>