From 0ea6749dbc923a6e796b1de4bbd301d931739b9d Mon Sep 17 00:00:00 2001
From: Dan Finlay <dan@danfinlay.com>
Date: Tue, 25 Jul 2017 18:22:31 -0700
Subject: Lots of flex rearrangement on account detail view

Includes removal of ReactCssTransitionGroup for a simpler UI refactor.
---
 ui/app/css/index.css | 46 +++++++++++++++++++++++++++++++++++++++-------
 1 file changed, 39 insertions(+), 7 deletions(-)

(limited to 'ui/app/css/index.css')

diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index 2ae92bbd6..00d4bea93 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -25,19 +25,48 @@ html, body {
   padding: 0;
 }
 
-.css-transition-group {
-  flex: 1;
-  height: 100%;
+html {
+  min-height: 400px;
+}
+
+.app-root {
+  overflow: hidden;
+  position: relative
+}
+
+.app-primary {
+  display: flex;
 }
 
 input:focus, textarea:focus {
   outline: none;
 }
 
+.full-size {
+  height: 100%;
+  width: 100%;
+}
+
+.full-width {
+  width: 100%;
+}
+
+.full-height {
+  height: 100%;
+}
+
+.full-flex-height {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+}
+
 #app-content {
   overflow-x: hidden;
   min-width: 357px;
   height: 100%;
+  display: flex;
+  flex-direction: column;
 }
 
 button, input[type="submit"] {
@@ -138,10 +167,6 @@ h2.page-subtitle {
   margin: 12px;
 }
 
-.app-primary {
-
-}
-
 .app-footer {
   padding-bottom: 10px;
   align-items: center;
@@ -413,7 +438,14 @@ input.large-input {
 .account-detail-section {
   display: flex;
   flex-wrap: wrap;
+  overflow-y: auto;
+  flex-direction: inherit;
 }
+
+.grow-tenx {
+  flex-grow: 10;
+}
+
 .name-label{
 
 }
-- 
cgit v1.2.3