vue 0.1.4: flex layouts

suenot · Apr 7, 2019 · f52f4e8 · f52f4e8
1 parent 5b75337
commit f52f4e8
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/vue-client/src/views/Balance/Balance.vue b/vue-client/src/views/Balance/Balance.vue
@@ -33,12 +33,18 @@ export default {
 <style lang="sass" scoped>
 .main-container
   display: flex
+  min-width: 100%
+  max-width: 100%
+  width: 100%
+  height: 100%
   // display: grid
   // grid-template-columns: [fist-column] 470px [second-column] auto [third-column]
   // grid-template-rows: [first-row] 440px [second-row] calc(100vh - 440px)
 
 .left-column
   flex: 0 0 400px
+  max-width: 400px
+  min-width: 400px
 .right-column
   flex: 1 0 auto
   display: flex

diff --git a/vue-client/src/views/Trade/Trade.vue b/vue-client/src/views/Trade/Trade.vue
@@ -49,16 +49,22 @@ export default {
   height: 100vh
   max-height: 100vh
   overflow: hidden
+  width: 100%
+  max-width: 100%
 
 .left-column
   flex: 0 0 360px
+  max-width: 360px
+  min-width: 360px
 .middle-column
-  flex: 0 1 auto
+  flex: 1 0 auto
   display: flex
   flex-direction: column
   heigth: 100vh
 .right-column
-  flex: 0 0 250px
+  flex: 0 0 280px
+  max-width: 280px
+  min-width: 280px
 
 .orders-wrapper
   height: calc(100vh + 2px)