diff --git a/public/app/features/dashboard/dashnav/dashnav.html b/public/app/features/dashboard/dashnav/dashnav.html
index 5c01e2099c6..b5e151bf966 100644
--- a/public/app/features/dashboard/dashnav/dashnav.html
+++ b/public/app/features/dashboard/dashnav/dashnav.html
@@ -51,9 +51,8 @@
-
diff --git a/public/app/features/dashboard/dashnav/dashnav.ts b/public/app/features/dashboard/dashnav/dashnav.ts
index c87d533d192..837d0d76537 100644
--- a/public/app/features/dashboard/dashnav/dashnav.ts
+++ b/public/app/features/dashboard/dashnav/dashnav.ts
@@ -42,6 +42,18 @@ export class DashNavCtrl {
this.$location.search(search);
}
+ close() {
+ let search = this.$location.search();
+ if (search.editview) {
+ delete search.editview;
+ }
+ if (search.fullscreen) {
+ delete search.fullscreen;
+ delete search.edit;
+ }
+ this.$location.search(search);
+ }
+
starDashboard() {
this.dashboardSrv.starDashboard(this.dashboard.id, this.dashboard.meta.isStarred)
.then(newState => {
diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss
index fd5b5be364b..d2895fc2d78 100644
--- a/public/sass/_variables.dark.scss
+++ b/public/sass/_variables.dark.scss
@@ -22,7 +22,6 @@ $gray-5: #ECECEC;
$gray-6: #f4f5f8;
$gray-7: #fbfbfb;
-// $gray-blue: #292a2d;
$gray-blue: #212327;
$input-black: #09090B;
@@ -100,6 +99,7 @@ $panel-border: solid 1px $panel-border-color;
$panel-drop-zone-bg: repeating-linear-gradient(-128deg, #111, #111 10px, #191919 10px, #222 20px);
$panel-header-hover-bg: $dark-4;
$panel-header-menu-hover-bg: $dark-5;
+$panel-edit-shadow: 0 -30px 30px -30px $black;
// page header
$page-header-bg: linear-gradient(90deg, #292a2d, black);
diff --git a/public/sass/_variables.light.scss b/public/sass/_variables.light.scss
index f6512aed3c4..0570b6a6e85 100644
--- a/public/sass/_variables.light.scss
+++ b/public/sass/_variables.light.scss
@@ -103,6 +103,7 @@ $panel-border: solid 1px $panel-border-color;
$panel-drop-zone-bg: repeating-linear-gradient(-128deg, $body-bg, $body-bg 10px, $gray-6 10px, $gray-6 20px);
$panel-header-hover-bg: $gray-6;
$panel-header-menu-hover-bg: $gray-4;
+$panel-edit-shadow: 0 0 30px 20px $black;
// Page header
$page-header-bg: linear-gradient(90deg, $white, $gray-7);
diff --git a/public/sass/components/_navbar.scss b/public/sass/components/_navbar.scss
index 3a40ed89ccd..4f9b8fbbf4f 100644
--- a/public/sass/components/_navbar.scss
+++ b/public/sass/components/_navbar.scss
@@ -10,14 +10,19 @@
display: flex;
flex-grow: 1;
border-bottom: 1px solid transparent;
- transition: all 300ms ease-in-out;
+ transition: all 350ms ease-in-out;
}
+@mixin navbar-alt-look() {
+ background: $page-header-bg;
+ box-shadow: $search-shadow;
+ border-bottom: $navbarBorder;
+}
+
+
.dashboard-page--settings-open {
.navbar {
- background: $page-header-bg;
- box-shadow: $search-shadow;
- border-bottom: $navbarBorder;
+ @include navbar-alt-look();
}
.navbar-buttons--actions,
@@ -31,6 +36,20 @@
}
}
+.panel-in-fullscreen {
+ .navbar {
+ @include navbar-alt-look();
+ }
+
+ .navbar-buttons--actions {
+ display: none;
+ }
+
+ .navbar-buttons--close {
+ display: flex;
+ }
+}
+
.sidemenu-open {
.navbar {
padding-left: 15px;
diff --git a/public/sass/components/_tabbed_view.scss b/public/sass/components/_tabbed_view.scss
index d2c9b24d2a0..dfd760753fe 100644
--- a/public/sass/components/_tabbed_view.scss
+++ b/public/sass/components/_tabbed_view.scss
@@ -6,7 +6,8 @@
padding: 0;
.tabbed-view-header {
- padding: 1.5em 1rem 0 1rem;
+ padding: 0px 25px;
+ background: none;
}
}
}
diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss
index 943eb930543..d1951486c4b 100644
--- a/public/sass/pages/_dashboard.scss
+++ b/public/sass/pages/_dashboard.scss
@@ -217,4 +217,6 @@ div.flot-text {
}
}
-
+.panel-full-edit {
+ margin: $dashboard-padding (-$dashboard-padding) 0 (-$dashboard-padding);
+}