Implement infinite scrolls (no lazy loading) for wallet view

2 files changed, 21 insertions, 8 deletions

diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss
index edf5d0966..afda29cd5 100644
--- a/ui/app/css/itcss/components/newui-sections.scss
+++ b/ui/app/css/itcss/components/newui-sections.scss
@@ -24,19 +24,25 @@ $wallet-view-bg: $wild-sand;
   background: $tx-view-bg;
 }
 
-// wallet view
+// wallet view and sidebar
 
 .wallet-view {
+  display: flex;
+  flex-direction: column;
   flex: 33.5 0 33.5%;
   background: $wallet-view-bg;
 
   @media screen and (min-width: 576px) {
     overflow-y: scroll;
   }
+
+  .wallet-view-account-details {
+    flex: 0 0 150px;
+  }
 }
 
 .wallet-view-title-wrapper {
-  height: 25px;
+  flex: 0 0 25px;
 }
 
 .wallet-view-title {
@@ -49,12 +55,6 @@ $wallet-view-bg: $wild-sand;
   }
 }
 
-.account-options-menu {
-  align-items: center;
-  justify-content: flex-start;
-  margin: 5% 7%;
-}
-
 .wallet-view.sidebar {
   flex: 1 0 230px;
   background: rgb(250, 250, 250);
@@ -85,6 +85,8 @@ $wallet-view-bg: $wild-sand;
   background-color: rgba(0, 0, 0, 0.3);
 }
 
+// main-container media queries
+
 @media screen and (min-width: 576px) {
   .lap-visible {
     display: flex;
@@ -154,3 +156,10 @@ $wallet-view-bg: $wild-sand;
     text-align: center;
   }
 }
+
+// account options dropdown
+.account-options-menu {
+  align-items: center;
+  justify-content: flex-start;
+  margin: 5% 7%;
+}
\ No newline at end of file
diff --git a/ui/app/css/itcss/components/wallet-balance.scss b/ui/app/css/itcss/components/wallet-balance.scss
index 03cc38a03..e1b37cb1f 100644
--- a/ui/app/css/itcss/components/wallet-balance.scss
+++ b/ui/app/css/itcss/components/wallet-balance.scss
@@ -3,6 +3,10 @@ $wallet-balance-breakpoint: 890px;
 $wallet-balance-breakpoint-range:
   "screen and (min-width: #{$break-large}) and (max-width: #{$wallet-balance-breakpoint})";
 
+.wallet-balance-wrapper {
+  flex: 0 0 80px
+}
+
 .wallet-balance {
   background: inherit;
   display: flex;