From 9a5440e5ff8e04664592a99f2bcc6b1ba859c939 Mon Sep 17 00:00:00 2001
From: Nikan Dalvand <nikandalvand@gmail.com>
Date: Fri, 19 Jul 2019 22:05:31 +0430
Subject: [PATCH] Adjusted the main layout for sidebar, page, player and fixed
 normalize

---
 src/renderer/App.vue                     | 13 ++++++++++---
 src/renderer/layouts/DockableSidebar.vue |  6 ++++--
 src/renderer/layouts/HomePage.vue        |  2 +-
 src/renderer/layouts/PlayerBar.vue       |  5 +++--
 4 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/src/renderer/App.vue b/src/renderer/App.vue
index db67877..e5d226f 100644
--- a/src/renderer/App.vue
+++ b/src/renderer/App.vue
@@ -2,8 +2,8 @@
   <div id="app" class="root">
     <DockableSidebar />
     <div class="page-wrapper">
-      <router-view></router-view>
-      <PlayerBar />
+      <router-view class="page"></router-view>
+      <PlayerBar class="player-bar" />
     </div>
   </div>
 </template>
@@ -18,10 +18,17 @@ export default {
 </script>
 
 <style lang="sass">
-@import "../../node_modules/normalize-scss/sass/normalize.scss"
+@import 'normalize-scss';
+@include normalize();
 .root,.page-wrapper
   display: flex
 .page-wrapper
   flex-direction: column
   flex-grow: 1
+  height: 100vh
+  box-sizing: border-box
+  max-height: 100vh
+  .page
+    flex-grow: 1
+    overflow: auto
 </style>
diff --git a/src/renderer/layouts/DockableSidebar.vue b/src/renderer/layouts/DockableSidebar.vue
index e6e18ea..52e749c 100644
--- a/src/renderer/layouts/DockableSidebar.vue
+++ b/src/renderer/layouts/DockableSidebar.vue
@@ -10,6 +10,8 @@ export default {
 }
 </script>
 
-<style>
-
+<style scoped lang="sass">
+section
+    width: 100%
+    max-width: 250px
 </style>
diff --git a/src/renderer/layouts/HomePage.vue b/src/renderer/layouts/HomePage.vue
index fb28a10..38a7e44 100644
--- a/src/renderer/layouts/HomePage.vue
+++ b/src/renderer/layouts/HomePage.vue
@@ -1,7 +1,7 @@
 <template>
     <section>
       <ActionBar />
-      HomePage
+      <p>home</p>
     </section>
 </template>
 
diff --git a/src/renderer/layouts/PlayerBar.vue b/src/renderer/layouts/PlayerBar.vue
index 7db7b9a..0981714 100644
--- a/src/renderer/layouts/PlayerBar.vue
+++ b/src/renderer/layouts/PlayerBar.vue
@@ -10,6 +10,7 @@ export default {
 }
 </script>
 
-<style>
-
+<style lang="sass" scoped>
+section
+    height: 3rem
 </style>