[Enhancement] Hide sidebar on tablets (#358)

* [Enhancement] Hide sidebar on tablets

* Remove unnecessary console.log

* Use beforeDestroy

app/javascript/dashboard/assets/scss/_foundation-settings.scss

@@ -456,12 +456,12 @@ $meter-fill-bad: $alert-color;
 // --------------
 
 $offcanvas-sizes: (
-  small: 250px,
-  medium: 350px,
+  small: 23rem,
+  medium: 23rem,
 );
 $offcanvas-vertical-sizes: (
-  small: 250px,
-  medium: 350px,
+  small: 23rem,
+  medium: 23rem,
 );
 $offcanvas-background: $light-gray;
 $offcanvas-shadow: 0 0 10px rgba($black, 0.7);

app/javascript/dashboard/assets/scss/views/settings/inbox.scss

@@ -17,9 +17,6 @@
     @include flex;
     @include flex-align($x: center, $y: middle);
     @include margin($zero);
-    > span {
-      @include padding($zero $space-small $zero $space-small);
-    }
   }
 
 }

app/javascript/dashboard/assets/scss/widgets/_conversation-view.scss

@@ -3,9 +3,14 @@
   flex-direction: column;
 
   .chat-list__top {
+    @include flex;
     @include padding($space-normal $zero $space-small $zero);
+
+    align-items: center;
+    justify-content: space-between;
+
     .page-title {
-      float: left;
+      @include flex;
       margin-bottom: $zero;
       margin-left: $space-normal;
     }

app/javascript/dashboard/assets/scss/widgets/_sidemenu.scss

@@ -126,3 +126,22 @@
     margin-top: auto;
   }
 }
+
+.hamburger--menu {
+  cursor: pointer;
+  display: none;
+  margin-right: $space-normal;
+
+  @media screen and (max-width: 1200px){
+    display: block;
+  }
+}
+
+.header--icon {
+  display: block;
+  margin-right: $space-normal;
+
+  @media screen and (max-width: 1200px){
+    display: none;
+  }
+}