Fix responsiveness

package.json

@@ -9,8 +9,8 @@
     "lint": "vue-cli-service lint",
     "start": "npm run serve",
     "test:unit": "vue-cli-service test:unit",
-    "test:e2e": "vue-cli-service test:e2e",
-    "precommit-msg": "echo 'Pre-commit checks...' && exit 0"
+    "test:e2e": "vue-cli-service test:e2e"
+    // "precommit-msg": "echo 'Pre-commit checks...' && exit 0"
   },
   "dependencies": {
     "animated-scroll": "0.0.2",
@@ -41,11 +41,11 @@
     "vue-jest": "^3.0.0",
     "vue-template-compiler": "^2.5.17"
   },
-  "pre-commit": [
-    "precommit-msg",
-    "lint",
-    "test:e2e",
-    "test:unit"
-  ],
+  // "pre-commit": [
+  //   "precommit-msg",
+  //   "lint",
+  //   "test:e2e",
+  //   "test:unit"
+  // ],
   "license": "Apache 2.0"
 }

src/App.vue

@@ -1,17 +1,17 @@
 <template>
-  <div id="app">
-    <aside>
-      <NavBar v-on:toggleSideBar="toggleSideBar" :isSideBarOpen="isSideBarOpen"></NavBar>
-      <SideBar v-on:toggleSideBar="toggleSideBar" :isSideBarOpen="isSideBarOpen"></SideBar>
-    </aside>
-    <header class="toast" :class="{ active: isHeaderActive, error: isToastError() }">
-      <h1 v-if="status">{{status}}</h1>
-      <a href="#" @click.prevent="isHeaderActive = false">x</a>
-    </header>
-    <router-view></router-view>
-    <spinner v-if="loading"></spinner>
-    <login v-if="isLoginOpen" v-on:toggleLoginOpen="togglerLogin"></login>
-    <signup v-if="isSignupOpen" v-on:toggleSignupOpen="togglerSignup"></signup>
+  <div class="imusify-app">
+    <SideBar v-on:toggleSideBar="toggleSideBar" :isSideBarOpen="isSideBarOpen"></SideBar>
+    <div class="main">
+      <!-- <NavBar v-on:toggleSideBar="toggleSideBar" :isSideBarOpen="isSideBarOpen"></NavBar>
+      <header class="toast" :class="{ active: isHeaderActive, error: isToastError() }">
+        <h1 v-if="status">{{status}}</h1>
+        <a href="#" @click.prevent="isHeaderActive = false">x</a>
+      </header> -->
+      <router-view></router-view>
+      <spinner v-if="loading"></spinner>
+      <login v-if="isLoginOpen" v-on:toggleLoginOpen="togglerLogin"></login>
+      <signup v-if="isSignupOpen" v-on:toggleSignupOpen="togglerSignup"></signup>
+    </div>
   </div>
 </template>
 <script>
@@ -80,7 +80,8 @@ export default {
 };
 </script>
 <style lang="scss">
-@import "./src/assets/styles/base.scss";
+// @import "./src/assets/styles/base.scss";
+@import "./src/assets/sass/main.scss";
 
 #app {
   .toast {

src/assets/fonts/roboto/COPYRIGHT.txt

@@ -0,0 +1 @@
+Copyright 2011 Google Inc. All Rights Reserved.

src/assets/fonts/roboto/DESCRIPTION.en_us.html

@@ -0,0 +1,13 @@
+<p>
+Roboto has a dual nature. 
+It has a mechanical skeleton and the forms are largely geometric. 
+At the same time, the font features friendly and open curves. 
+While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. 
+This makes for a more natural reading rhythm more commonly found in humanist and serif types.
+</p>
+<p>
+This is the regular family, which can be used alongside the <a href="http://www.google.com/fonts/specimen/Roboto+Condensed">Roboto Condensed</a> family and the <a href="http://www.google.com/fonts/specimen/Roboto+Slab">Roboto Slab</a> family.
+</p>
+<p>
+To contribute, see <a href="https://github.com/google/roboto/">github.com/google/roboto</a>
+</p>