diff --git a/public/app/core/components/scroll/scroll.ts b/public/app/core/components/scroll/scroll.ts index 720334d8973..fbf5fd6cd37 100644 --- a/public/app/core/components/scroll/scroll.ts +++ b/public/app/core/components/scroll/scroll.ts @@ -8,6 +8,7 @@ export function geminiScrollbar() { link: function(scope, elem, attrs) { let scrollbar = new PerfectScrollbar(elem[0], { wheelPropagation: true, + wheelSpeed: 3, }); let lastPos = 0; diff --git a/public/app/core/components/sidemenu/sidemenu.html b/public/app/core/components/sidemenu/sidemenu.html index e97d34739ba..1b301363e62 100644 --- a/public/app/core/components/sidemenu/sidemenu.html +++ b/public/app/core/components/sidemenu/sidemenu.html @@ -1,73 +1,78 @@ -  Close + +  Close
-
- - - - - - - -
+
+ + + + + + + +
-
- - - - -
+
+ + + + + + + + +
-
- - - - - - - -
+
+ + + + + + + +
- diff --git a/public/app/features/dashboard/dashgrid/DashboardRow.tsx b/public/app/features/dashboard/dashgrid/DashboardRow.tsx index 7a4d6cf8070..c2a84cb7da9 100644 --- a/public/app/features/dashboard/dashgrid/DashboardRow.tsx +++ b/public/app/features/dashboard/dashgrid/DashboardRow.tsx @@ -4,6 +4,7 @@ import { PanelModel } from '../panel_model'; import { PanelContainer } from './PanelContainer'; import templateSrv from 'app/features/templating/template_srv'; import appEvents from 'app/core/app_events'; +import config from 'app/core/config'; export interface DashboardRowProps { panel: PanelModel; @@ -94,14 +95,16 @@ export class DashboardRow extends React.Component { {title} ({hiddenPanels} hidden panels) -
- - - - - - -
+ {config.bootData.user.orgRole !== 'Viewer' && ( +
+ + + + + + +
+ )}
); diff --git a/public/app/features/dashboard/specs/DashboardRow.jest.tsx b/public/app/features/dashboard/specs/DashboardRow.jest.tsx index 2d44f2e0e74..c0ac172aa26 100644 --- a/public/app/features/dashboard/specs/DashboardRow.jest.tsx +++ b/public/app/features/dashboard/specs/DashboardRow.jest.tsx @@ -2,19 +2,26 @@ import React from 'react'; import { shallow } from 'enzyme'; import { DashboardRow } from '../dashgrid/DashboardRow'; import { PanelModel } from '../panel_model'; +import config from '../../../core/config'; describe('DashboardRow', () => { let wrapper, panel, getPanelContainer, dashboardMock; beforeEach(() => { - dashboardMock = {toggleRow: jest.fn()}; + dashboardMock = { toggleRow: jest.fn() }; + + config.bootData = { + user: { + orgRole: 'Admin', + }, + }; getPanelContainer = jest.fn().mockReturnValue({ getDashboard: jest.fn().mockReturnValue(dashboardMock), - getPanelLoader: jest.fn() + getPanelLoader: jest.fn(), }); - panel = new PanelModel({collapsed: false}); + panel = new PanelModel({ collapsed: false }); wrapper = shallow(); }); @@ -30,4 +37,14 @@ describe('DashboardRow', () => { expect(dashboardMock.toggleRow.mock.calls).toHaveLength(1); }); + it('should have two actions as admin', () => { + expect(wrapper.find('.dashboard-row__actions .pointer')).toHaveLength(2); + }); + + it('should have zero actions as viewer', () => { + config.bootData.user.orgRole = 'Viewer'; + panel = new PanelModel({ collapsed: false }); + wrapper = shallow(); + expect(wrapper.find('.dashboard-row__actions .pointer')).toHaveLength(0); + }); }); diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss index ef9f1a06996..6e86aa1872e 100644 --- a/public/sass/_variables.dark.scss +++ b/public/sass/_variables.dark.scss @@ -259,6 +259,7 @@ $navbar-button-border: #2f2f32; // Sidemenu // ------------------------- $side-menu-bg: $black; +$side-menu-bg-mobile: $side-menu-bg; $side-menu-item-hover-bg: $dark-2; $side-menu-shadow: 0 0 20px black; $side-menu-link-color: $link-color; diff --git a/public/sass/_variables.light.scss b/public/sass/_variables.light.scss index eb598f27d4c..a59350d2195 100644 --- a/public/sass/_variables.light.scss +++ b/public/sass/_variables.light.scss @@ -200,6 +200,7 @@ $input-invalid-border-color: lighten($red, 5%); // Sidemenu // ------------------------- $side-menu-bg: $dark-2; +$side-menu-bg-mobile: rgba(0, 0, 0, 0); //$gray-6; $side-menu-item-hover-bg: $gray-1; $side-menu-shadow: 5px 0px 10px -5px $gray-1; $side-menu-link-color: $gray-6; diff --git a/public/sass/components/_sidemenu.scss b/public/sass/components/_sidemenu.scss index 5f21bbc8cd0..8a5c3779714 100644 --- a/public/sass/components/_sidemenu.scss +++ b/public/sass/components/_sidemenu.scss @@ -71,7 +71,7 @@ // important to overlap it otherwise it can be hidden // again by the mouse getting outside the hover space left: $side-menu-width - 2px; - @include animation("dropdown-anim 150ms ease-in-out 100ms forwards"); + @include animation('dropdown-anim 150ms ease-in-out 100ms forwards'); z-index: $zindex-sidemenu; } } @@ -193,9 +193,13 @@ li.sidemenu-org-switcher { @include media-breakpoint-down(xs) { .sidemenu-open--xs { + li { + font-size: $font-size-lg; + } + .sidemenu { width: 100%; - background: $side-menu-bg; + background: $side-menu-bg-mobile; position: initial; height: auto; box-shadow: $side-menu-shadow; @@ -214,6 +218,9 @@ li.sidemenu-org-switcher { .sidemenu__bottom { display: block; } + .sidemenu-item { + border-right: 2px solid transparent; + } } .sidemenu {