diff --git a/public/app/core/components/grafana_app.ts b/public/app/core/components/grafana_app.ts index 77089b14ddc..39601f903ec 100644 --- a/public/app/core/components/grafana_app.ts +++ b/public/app/core/components/grafana_app.ts @@ -79,21 +79,16 @@ export function grafanaAppDirective(playlistSrv, contextSrv, $timeout, $rootScop sidemenuOpen = scope.contextSrv.sidemenu; body.toggleClass('sidemenu-open', sidemenuOpen); - scope.$watch('contextSrv.sidemenu', newVal => { - if (sidemenuOpen !== scope.contextSrv.sidemenu) { - sidemenuOpen = scope.contextSrv.sidemenu; - body.toggleClass('sidemenu-open', scope.contextSrv.sidemenu); - } + appEvents.on('toggle-sidemenu', () => { + body.toggleClass('sidemenu-open'); }); - let sidemenuOpenSmallBreakpoint = scope.contextSrv.sidemenuSmallBreakpoint; - body.toggleClass('sidemenu-open--xs', sidemenuOpenSmallBreakpoint); + appEvents.on('toggle-sidemenu-mobile', () => { + body.toggleClass('sidemenu-open--xs'); + }); - scope.$watch('contextSrv.sidemenuSmallBreakpoint', newVal => { - if (sidemenuOpenSmallBreakpoint !== scope.contextSrv.sidemenuSmallBreakpoint) { - sidemenuOpenSmallBreakpoint = scope.contextSrv.sidemenuSmallBreakpoint; - body.toggleClass('sidemenu-open--xs', scope.contextSrv.sidemenuSmallBreakpoint); - } + appEvents.on('toggle-sidemenu-hidden', () => { + body.toggleClass('sidemenu-hidden'); }); // tooltip removal fix @@ -111,6 +106,9 @@ export function grafanaAppDirective(playlistSrv, contextSrv, $timeout, $rootScop } } + // clear body class sidemenu states + body.removeClass('sidemenu-open--xs'); + $("#tooltip, .tooltip").remove(); // check for kiosk url param diff --git a/public/app/core/components/sidemenu/sidemenu.html b/public/app/core/components/sidemenu/sidemenu.html index b47b7fc8265..7ed2ab1f2c7 100644 --- a/public/app/core/components/sidemenu/sidemenu.html +++ b/public/app/core/components/sidemenu/sidemenu.html @@ -3,11 +3,10 @@ - -

 Close

+ +  Close -
diff --git a/public/app/core/components/sidemenu/sidemenu.ts b/public/app/core/components/sidemenu/sidemenu.ts index cae0b338ce9..489cad72957 100644 --- a/public/app/core/components/sidemenu/sidemenu.ts +++ b/public/app/core/components/sidemenu/sidemenu.ts @@ -1,9 +1,8 @@ -/// - import _ from 'lodash'; import config from 'app/core/config'; import $ from 'jquery'; import coreModule from '../../core_module'; +import appEvents from 'app/core/app_events'; export class SideMenuCtrl { user: any; @@ -11,7 +10,7 @@ export class SideMenuCtrl { bottomNav: any; loginUrl: string; isSignedIn: boolean; - smallBPSideMenuOpen = false; + isOpenMobile: boolean; /** @ngInject */ constructor(private $scope, private $rootScope, private $location, private contextSrv, private $timeout) { @@ -29,24 +28,21 @@ export class SideMenuCtrl { } this.$scope.$on('$routeChangeSuccess', () => { - if (this.smallBPSideMenuOpen) { - this.contextSrv.setSideMenuForSmallBreakpoint(false, true); - this.smallBPSideMenuOpen = false; - } this.loginUrl = 'login?redirect=' + encodeURIComponent(this.$location.path()); }); } toggleSideMenu() { this.contextSrv.toggleSideMenu(); + appEvents.emit('toggle-sidemenu'); + this.$timeout(() => { this.$rootScope.$broadcast('render'); }); } toggleSideMenuSmallBreakpoint() { - this.smallBPSideMenuOpen = !this.smallBPSideMenuOpen; - this.contextSrv.setSideMenuForSmallBreakpoint(this.smallBPSideMenuOpen, false); + appEvents.emit('toggle-sidemenu-mobile'); } switchOrg() { @@ -75,10 +71,6 @@ export function sideMenuDirective() { parent.append(menu); }, 100); }); - - scope.$on("$destory", function() { - elem.off('click.dropdown'); - }); } }; } diff --git a/public/app/core/controllers/error_ctrl.ts b/public/app/core/controllers/error_ctrl.ts index fe894a69806..15cd4281a64 100644 --- a/public/app/core/controllers/error_ctrl.ts +++ b/public/app/core/controllers/error_ctrl.ts @@ -1,5 +1,6 @@ import config from 'app/core/config'; import coreModule from '../core_module'; +import appEvents from 'app/core/app_events'; export class ErrorCtrl { @@ -8,11 +9,14 @@ export class ErrorCtrl { $scope.navModel = navModelSrv.getNotFoundNav(); $scope.appSubUrl = config.appSubUrl; - var showSideMenu = contextSrv.sidemenu; - contextSrv.sidemenu = false; + if (!contextSrv.isSignedIn) { + appEvents.emit('toggle-sidemenu-hidden'); + } - $scope.$on('$destroy', function() { - contextSrv.sidemenu = showSideMenu; + $scope.$on("destroy", () => { + if (!contextSrv.isSignedIn) { + appEvents.emit('toggle-sidemenu-hidden'); + } }); } } diff --git a/public/app/core/nav_model_srv.ts b/public/app/core/nav_model_srv.ts index 2be95aca0da..e77cfb8f09f 100644 --- a/public/app/core/nav_model_srv.ts +++ b/public/app/core/nav_model_srv.ts @@ -70,13 +70,15 @@ export class NavModelSrv { getNotFoundNav() { var node = { - text: "Page not found ", + text: "Page not found", icon: "fa fa-fw fa-warning", + subTitle: "404 Error" }; return { breadcrumbs: [node], - node: node + node: node, + main: node }; } diff --git a/public/app/core/routes/routes.ts b/public/app/core/routes/routes.ts index f4132400c7d..87437770e0e 100644 --- a/public/app/core/routes/routes.ts +++ b/public/app/core/routes/routes.ts @@ -178,23 +178,27 @@ function setupAngularRoutes($routeProvider, $locationProvider) { .when('/login', { templateUrl: 'public/app/partials/login.html', controller : 'LoginCtrl', - pageClass: 'page-login', + pageClass: 'sidemenu-hidden', }) .when('/invite/:code', { templateUrl: 'public/app/partials/signup_invited.html', controller : 'InvitedCtrl', + pageClass: 'sidemenu-hidden', }) .when('/signup', { templateUrl: 'public/app/partials/signup_step2.html', controller : 'SignUpCtrl', + pageClass: 'sidemenu-hidden', }) .when('/user/password/send-reset-email', { templateUrl: 'public/app/partials/reset_password.html', controller : 'ResetPasswordCtrl', + pageClass: 'sidemenu-hidden', }) .when('/user/password/reset', { templateUrl: 'public/app/partials/reset_password.html', controller : 'ResetPasswordCtrl', + pageClass: 'sidemenu-hidden', }) .when('/dashboard/snapshots', { templateUrl: 'public/app/features/snapshot/partials/snapshots.html', diff --git a/public/app/core/services/context_srv.ts b/public/app/core/services/context_srv.ts index a904acae471..d707afc283d 100644 --- a/public/app/core/services/context_srv.ts +++ b/public/app/core/services/context_srv.ts @@ -58,10 +58,6 @@ export class ContextSrv { this.sidemenu = !this.sidemenu; store.set('grafana.sidemenu', this.sidemenu); } - - setSideMenuForSmallBreakpoint(show: boolean, persistToggle: boolean) { - this.sidemenuSmallBreakpoint = show; - } } var contextSrv = new ContextSrv(); diff --git a/public/app/features/dashboard/dashnav/dashnav.ts b/public/app/features/dashboard/dashnav/dashnav.ts index 6985d27be5f..2b174e2c301 100644 --- a/public/app/features/dashboard/dashnav/dashnav.ts +++ b/public/app/features/dashboard/dashnav/dashnav.ts @@ -1,5 +1,3 @@ -/// - import _ from 'lodash'; import moment from 'moment'; import angular from 'angular'; @@ -18,7 +16,6 @@ export class DashNavCtrl { private dashboardSrv, private $location, private backendSrv, - private contextSrv, public playlistSrv, navModelSrv) { this.navModel = navModelSrv.getDashboardNav(this.dashboard, this); @@ -35,10 +32,6 @@ export class DashNavCtrl { } } - toggleSideMenu() { - this.contextSrv.toggleSideMenu(); - } - openEditView(editview) { var search = _.extend(this.$location.search(), {editview: editview}); this.$location.search(search); diff --git a/public/app/partials/error.html b/public/app/partials/error.html index a7c074fea94..f489251d040 100644 --- a/public/app/partials/error.html +++ b/public/app/partials/error.html @@ -1,60 +1,47 @@ -
-
-
- -
-

- Page not found -

-
- 404 Error + + +
+
+
+
+
+

100%

+

80%

+

60%

+

40%

+

20%

+

0%

+
+
+ +
+

Then

+

Now

+
+
+
+

current

+
+
+ +
+
+

Chances you are on the page you are looking for.

+

0%

+
+ +
+
+
+
-
-
-
-
-

100%

-

80%

-

60%

-

40%

-

20%

-

0%

-
-
- -
-

Then

-

Now

-
-
-
-
-
-
-

current

-
-
- -
-
-

Chances you are on the page you are looking for.

-

0%

-
-
-

Sorry for the inconvenience

-

Please go back to your - home dashboard and try again.

-

If the error persists, seek help on the - community site.

-
-
-
-
- -
diff --git a/public/app/partials/reset_password.html b/public/app/partials/reset_password.html index 82024932a16..f6caeef2a66 100644 --- a/public/app/partials/reset_password.html +++ b/public/app/partials/reset_password.html @@ -58,13 +58,14 @@
-
-
-
- Back to login -
-
-
+
+
+ Back to login +
+
+
+ +
diff --git a/public/sass/components/_sidemenu.scss b/public/sass/components/_sidemenu.scss index 605b15dd5bc..05882d75fc9 100644 --- a/public/sass/components/_sidemenu.scss +++ b/public/sass/components/_sidemenu.scss @@ -16,6 +16,14 @@ .sidemenu__close { display: none; } + +} + +// body class that hides sidemenu +.sidemenu-hidden { + .sidemenu { + display: none; + } } @include media-breakpoint-up(sm) { @@ -164,7 +172,7 @@ li.sidemenu-org-switcher { } } -.sidemenu__logo, .sidemenu__logo_small_breakpoint { +.sidemenu__logo { display: block; padding: 0.4rem 1.0rem 0.4rem 0.65rem; min-height: $navbarHeight; @@ -203,6 +211,8 @@ li.sidemenu-org-switcher { .sidemenu__close { display: block; font-size: $font-size-md; + position: relative; + top: -3px; } .sidemenu__top, @@ -215,14 +225,16 @@ li.sidemenu-org-switcher { .sidemenu__logo { display: none; } + .sidemenu__logo_small_breakpoint { + padding: 12px 10px 26px; display: flex; flex-direction: row; justify-content: space-between; align-items: baseline; - &:hover { - background: transparent; + .fa-bars { + font-size: 25px; } } diff --git a/public/sass/pages/_login.scss b/public/sass/pages/_login.scss index 3c54224c4cc..2b3426b45b5 100644 --- a/public/sass/pages/_login.scss +++ b/public/sass/pages/_login.scss @@ -8,12 +8,6 @@ padding-top: $spacer * 5; /* BAD HACK - experiement to see how it looks */ } -.page-login { - .sidemenu { - display: none; - } -} - .login-form { display: inline-block; max-width: 24rem;