public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ux: minor progress on panel title menu makover

Browse Source
This commit is contained in:
Torkel Ödegaard
2017-06-08 16:22:51 +02:00
parent 4206f98ba4
commit 25683c688f
5 changed files with 28 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/features/panel/panel_header.ts
+16 -1
View File
@@ -1,5 +1,6 @@
///<reference path="../../headers/common.d.ts" />
import $ from 'jquery';
import angular from 'angular';
import {coreModule} from 'app/core/core';
@@ -37,7 +38,21 @@ function panelHeader() {
return {
restrict: 'E',
template: template,
link: function() {
link: function(scope, elem, attrs) {
elem.click(function(evt) {
const targetClass = evt.target.className;
if (targetClass === 'panel-title-text drag-handle' || targetClass === 'panel-title drag-handle') {
evt.stopPropagation();
elem.find('[data-toggle=dropdown]').dropdown('toggle');
}
// var toggleAttribute = evt.getAttribute('data-toggle');
// if (!toggleAttribute) {
// elem.find('[data-toggle=dropdown]').click();
// }
});
}
};
}
public/sass/_variables.dark.scss
+2 -1
View File
@@ -92,7 +92,8 @@ $panel-bg: $dark-2;
$panel-border-color: $dark-3;
$panel-border: solid 1px $panel-border-color;
$panel-drop-zone-bg: repeating-linear-gradient(-128deg, #111, #111 10px, #191919 10px, #222 20px);
$panel-menu-border: solid 1px black;
$panel-header-hover-bg: $dark-3;
$panel-header-menu-hover-bg: $dark-5;
$divider-border-color: #555;
public/sass/_variables.light.scss
+2 -1
View File
@@ -99,7 +99,8 @@ $panel-bg: $gray-7;
$panel-border-color: $gray-5;
$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-menu-border: solid 1px white;
$panel-header-hover-bg: $gray-6;
$panel-header-menu-hover-bg: $gray-4;
$divider-border-color: $gray-2;
public/sass/components/_view_states.scss
+1
View File
@@ -28,6 +28,7 @@
.panel-drop-zone
.dashnav-refresh-action,
.dashnav-zoom-out,
.panel-menu-container,
.dashnav-action-icons,
.panel-info-corner--info,
.panel-info-corner--links,
public/sass/pages/_dashboard.scss
+7 -7
View File
@@ -70,17 +70,13 @@ div.flot-text {
}
.panel-menu-container {
margin-left: 8px;
margin-left: 6px;
}
.panel-menu-toggle {
color: $text-color-faint;
cursor: pointer;
padding: 3px 5px;
&:hover {
background: $dark-4;
}
}
.panel-loading {
@@ -94,11 +90,13 @@ div.flot-text {
text-align: center;
&:hover {
background: $side-menu-bg;
background: $panel-header-hover-bg;
.panel-title-caret {
.panel-menu-toggle {
color: $text-color;
background: $panel-header-menu-hover-bg;
}
}
}
@@ -107,6 +105,8 @@ div.flot-text {
text-align: left;
background: $side-menu-bg;
box-shadow: $search-shadow;
top: 25px;
left: -100px;
li a {
display: block;