Fixing action transitions on the overview page.

zettajs · Nov 11, 2014 · 7927e2a · 7927e2a
1 parent c143637
commit 7927e2a
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 0 deletions.
diff --git a/src/styles/overview.less b/src/styles/overview.less
@@ -119,6 +119,7 @@ h1 {
   .row {
     border-top: 1px solid @gray_5;
     overflow-x: hidden;
+    .expand();
     line-height: 1rem;
     .switches, .name, .value {
         padding: 1rem 0;

diff --git a/src/styles/styles.css b/src/styles/styles.css
@@ -1123,6 +1123,22 @@ h1 .back:hover {
   overflow-x: hidden;
   line-height: 1rem;
 }
+.devices .row.animate-size {
+  transition: 400ms cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
+  /*
+    height: auto;
+    max-height: 0;
+    */
+  overflow: hidden;
+}
+.devices .row.animate-size.closed {
+  height: auto;
+  max-height: 0;
+}
+.devices .row.animate-size.open {
+  height: auto;
+  max-height: 100rem;
+}
 .devices .row .switches,
 .devices .row .name,
 .devices .row .value {