ux: fix for responsive breakpoints and solo mode showing sidemenu

public/app/features/panel/solo_panel_ctrl.ts

@@ -1,4 +1,5 @@
 import angular from 'angular';
+import appEvents from 'app/core/app_events';
 
 export class SoloPanelCtrl {
   /** @ngInject */
@@ -7,6 +8,7 @@ export class SoloPanelCtrl {
 
     $scope.init = function() {
       contextSrv.sidemenu = false;
+      appEvents.emit('toggle-sidemenu');
 
       var params = $location.search();
       panelId = parseInt(params.panelId);

public/sass/_old_responsive.scss

@@ -18,8 +18,8 @@
 // ---------------------
 
 @include media-breakpoint-down(xs) {
-  input[type="text"],
-  input[type="number"],
+  input[type='text'],
+  input[type='number'],
   textarea {
     font-size: 16px;
   }
@@ -51,9 +51,15 @@
     display: flex;
   }
   .navbar-page-btn {
-    max-width: none;
+    max-width: 450px;
   }
   .gf-timepicker-nav-btn {
     max-width: none;
   }
 }
+
+@include media-breakpoint-up(xl) {
+  .navbar-page-btn {
+    max-width: 600px;
+  }
+}