From 6fe08cd4b3a0db0695db13a1b95cab7834de3ba6 Mon Sep 17 00:00:00 2001
From: Maxime Quandalle <maxime@quandalle.com>
Date: Fri, 22 May 2015 19:40:12 +0200
Subject: Animate popup screens transition

---
 client/components/main/popup.styl | 29 ++++++++++++++++++++++++-----
 1 file changed, 24 insertions(+), 5 deletions(-)

(limited to 'client/components/main/popup.styl')

diff --git a/client/components/main/popup.styl b/client/components/main/popup.styl
index 8c9993af..151b4fcb 100644
--- a/client/components/main/popup.styl
+++ b/client/components/main/popup.styl
@@ -73,8 +73,17 @@
         color: darken(white, 80%)
 
     .back-btn
-      padding: 10px
       float: left
+      overflow: hidden
+      width: 30px
+      transition: width 0.2s
+
+      i.fa
+        margin: 10px
+        margin-top: 12px
+
+      &.is-hidden
+        width: 0
 
     .close-btn
       padding: 10px 10px 10px 4px
@@ -82,11 +91,21 @@
       top: 0
       right: 0
 
-  .content
-    overflow-x: hidden
-    overflow-y: auto
-    padding: 0 10px 10px
+  .content-wrapper
+    width: 100%
+
+  .content-container
+    width: 1000px
     max-height: 550px
+    transition: transform 0.2s
+
+    .content
+      width: 300 - 20px
+      padding: 0 10px 10px
+      float: left
+
+      &.is-hidden
+        height: 0
 
   .quiet
     padding: 6px 6px 4px
-- 
cgit v1.2.3-1-g7c22