Fixed so white theme looks good with new search and editor panes, Closes #735, and other small fixes and polish

This commit is contained in:
Torkel Ödegaard
2014-09-05 07:02:59 +02:00
parent 44edaad19d
commit dc63f0ddd0
12 changed files with 86 additions and 68 deletions
+2
View File
@@ -57,6 +57,8 @@ function (angular, $, config, _) {
$scope.checkFeatureToggles(); $scope.checkFeatureToggles();
dashboardKeybindings.shortcuts($scope); dashboardKeybindings.shortcuts($scope);
$scope.setWindowTitleAndTheme();
$scope.emitAppEvent("dashboard-loaded", $scope.dashboard); $scope.emitAppEvent("dashboard-loaded", $scope.dashboard);
}; };
+1 -4
View File
@@ -69,14 +69,11 @@
<div> <div>
<div class="grafana-target" ng-repeat="override in panel.seriesOverrides" ng-controller="SeriesOverridesCtrl"> <div class="grafana-target" ng-repeat="override in panel.seriesOverrides" ng-controller="SeriesOverridesCtrl">
<div class="grafana-target-inner"> <div class="grafana-target-inner">
<ul class="grafana-segment-list">
<ul class="grafana-target-controls-left">
<li class="grafana-target-segment"> <li class="grafana-target-segment">
<i class="icon-remove pointer" ng-click="removeSeriesOverride(override)"></i> <i class="icon-remove pointer" ng-click="removeSeriesOverride(override)"></i>
</li> </li>
</ul>
<ul class="grafana-segment-list">
<li class="grafana-target-segment"> <li class="grafana-target-segment">
alias or regex alias or regex
</li> </li>
+4
View File
@@ -32,6 +32,8 @@
<div ng-if="!showImport"> <div ng-if="!showImport">
<h6 ng-hide="results.dashboards.length">No dashboards matching your query were found.</h6> <h6 ng-hide="results.dashboards.length">No dashboards matching your query were found.</h6>
<div class="search-results-container" ng-if="tagsOnly"> <div class="search-results-container" ng-if="tagsOnly">
<div class="row">
<div class="span6 offset1">
<div ng-repeat="tag in results.tags" class="pointer" style="width: 180px; float: left;" <div ng-repeat="tag in results.tags" class="pointer" style="width: 180px; float: left;"
ng-class="{'selected': $index === selectedIndex }" ng-class="{'selected': $index === selectedIndex }"
ng-click="filterByTag(tag.term, $event)"> ng-click="filterByTag(tag.term, $event)">
@@ -40,6 +42,8 @@
<span>{{tag.term}} &nbsp;({{tag.count}})</span> <span>{{tag.term}} &nbsp;({{tag.count}})</span>
</a> </a>
</div> </div>
</div>
</div>
</div> </div>
<div class="search-results-container" ng-if="!tagsOnly"> <div class="search-results-container" ng-if="!tagsOnly">
+39 -41
View File
@@ -1,49 +1,47 @@
<div class="submenu-controls" ng-controller="SubmenuCtrl"> <div class="submenu-controls" ng-controller="SubmenuCtrl">
<div class="grafana-target"> <div class="grafana-target">
<div class="grafana-target-inner-wrapper"> <div class="grafana-target-inner" style="border-top: none">
<div class="grafana-target-inner">
<ul class="grafana-segment-list"> <ul class="grafana-segment-list">
<li class="grafana-target-segment"> <li class="grafana-target-segment">
<div class="dropdown"> <div class="dropdown">
<a class="pointer" data-toggle="dropdown"> <a class="pointer" data-toggle="dropdown">
<i class="icon-cog"></i> <i class="icon-cog"></i>
</a>
<ul class="dropdown-menu">
<li><a class="pointer" dash-editor-link="app/partials/templating_editor.html">Templating</a></li>
<li><a class="pointer" dash-editor-link="app/partials/annotations_editor.html">Annotations</a></li>
</ul>
</div>
</li>
</ul>
<ul class="grafana-segment-list" ng-if="dashboard.templating.enable">
<li class="small grafana-target-segment">
<strong>VARIABLES</strong>
</li>
<li ng-repeat-start="variable in variables" class="grafana-target-segment template-param-name">
{{variable.name}}:
</li>
<li ng-repeat-end template-param-selector>
</li>
</ul>
<ul class="grafana-segment-list" ng-if="dashboard.annotations.enable">
<li class="small grafana-target-segment">
<strong>ANNOTATIONS</strong>
</li>
<li ng-repeat="annotation in dashboard.annotations.list" class="grafana-target-segment annotation-segment" ng-class="{'annotation-disabled': !annotation.enable}">
<a ng-click="disableAnnotation(annotation)">
<i class="annotation-color-icon icon-bolt"></i>
{{annotation.name}}
</a> </a>
</li> <ul class="dropdown-menu">
</ul> <li><a class="pointer" dash-editor-link="app/partials/templating_editor.html">Templating</a></li>
<li><a class="pointer" dash-editor-link="app/partials/annotations_editor.html">Annotations</a></li>
</ul>
</div>
</li>
</ul>
<div class="clearfix"></div> <ul class="grafana-segment-list" ng-if="dashboard.templating.enable">
</div> <li class="small grafana-target-segment">
<strong>VARIABLES</strong>
</li>
<li ng-repeat-start="variable in variables" class="grafana-target-segment template-param-name">
{{variable.name}}:
</li>
<li ng-repeat-end template-param-selector>
</li>
</ul>
<ul class="grafana-segment-list" ng-if="dashboard.annotations.enable">
<li class="small grafana-target-segment">
<strong>ANNOTATIONS</strong>
</li>
<li ng-repeat="annotation in dashboard.annotations.list" class="grafana-target-segment annotation-segment" ng-class="{'annotation-disabled': !annotation.enable}">
<a ng-click="disableAnnotation(annotation)">
<i class="annotation-color-icon icon-bolt"></i>
{{annotation.name}}
</a>
</li>
</ul>
<div class="clearfix"></div>
</div> </div>
</div> </div>
</div> </div>
+2 -4
View File
@@ -120,10 +120,8 @@ function (angular, _, kbn) {
break; break;
default: default:
allValue = '{'; allValue = '{';
_.each(variable.options, function(option) { allValue += _.pluck(variable.options, 'text').join(',');
allValue += option.text + ','; allValue += '}';
});
allValue = allValue.substring(0, allValue.length - 1) + '}';
} }
variable.options.unshift({text: 'All', value: allValue}); variable.options.unshift({text: 'All', value: allValue});
+3 -2
View File
@@ -159,8 +159,9 @@ div.subnav {
li.active > a, li.active > a,
li.active > a:hover { li.active > a:hover {
border-color: transparent; border-color: transparent;
background-color: @blue; background-color: transparent;
color: @white; border-bottom: 2px solid @blue;
color: @blue
} }
li.disabled > a { li.disabled > a {
+9 -10
View File
@@ -334,23 +334,22 @@ select.grafana-target-segment-input {
::-webkit-scrollbar-button:horizontal:increment:active { background-image: none; } ::-webkit-scrollbar-button:horizontal:increment:active { background-image: none; }
::-webkit-scrollbar-button:vertical:decrement:active { background-image: none; } ::-webkit-scrollbar-button:vertical:decrement:active { background-image: none; }
::-webkit-scrollbar-button:vertical:increment:active {background-image: none; } ::-webkit-scrollbar-button:vertical:increment:active {background-image: none; }
::-webkit-scrollbar-track-piece { background-color: transparent; }
::-webkit-scrollbar-track-piece { background-color: grayDark; }
::-webkit-scrollbar-thumb:vertical { ::-webkit-scrollbar-thumb:vertical {
height: 50px; height: 50px;
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #3a3a3a), color-stop(100%, #222222)); background: -webkit-gradient(linear, left top, right top, color-stop(0%, @scrollbarBackground), color-stop(100%, @scrollbarBackground2));
border: 1px solid #0d0d0d; border: 1px solid @scrollbarBorder;
border-top: 1px solid #666666; border-top: 1px solid @scrollbarBorder;
border-left: 1px solid #666666; border-left: 1px solid @scrollbarBorder;
} }
::-webkit-scrollbar-thumb:horizontal { ::-webkit-scrollbar-thumb:horizontal {
width: 50px; width: 50px;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3a3a3a), color-stop(100%, #222222)); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @scrollbarBackground), color-stop(100%, @scrollbarBackground2));
border: 1px solid #1f1f1f; border: 1px solid @scrollbarBorder;
border-top: 1px solid #666666; border-top: 1px solid @scrollbarBorder;
border-left: 1px solid #666666; border-left: 1px solid @scrollbarBorder;
} }
+1 -1
View File
@@ -44,7 +44,7 @@
} }
.search-result-item:nth-child(odd) { .search-result-item:nth-child(odd) {
background-color: lighten(@grayDarker, 2%); background-color: @grafanaListAccent;
} }
.search-result-item { .search-result-item {
+2 -2
View File
@@ -2,7 +2,7 @@
width: 100%; width: 100%;
tr:nth-child(odd) td { tr:nth-child(odd) td {
background-color: lighten(@grayDarker, 2%); background-color: @grafanaListAccent;
} }
td { td {
@@ -39,7 +39,7 @@
max-width: 450px; max-width: 450px;
li:nth-child(odd) { li:nth-child(odd) {
background-color: lighten(@grayDarker, 2%); background-color: @grafanaListAccent;
} }
li { li {
+6 -1
View File
@@ -88,13 +88,18 @@
// Lists // Lists
@grafanaListBackground: transparent; @grafanaListBackground: transparent;
@grafanaListAccent: @grayDark; @grafanaListAccent: lighten(@grayDarker, 2%);
@grafanaListBorderTop: @grayDark; @grafanaListBorderTop: @grayDark;
@grafanaListBorderBottom: @black; @grafanaListBorderBottom: @black;
@grafanaListHighlight: @blue; @grafanaListHighlight: @blue;
@grafanaListHighlightContrast: #4F4F4F; @grafanaListHighlightContrast: #4F4F4F;
@grafanaListMainLinkColor: @linkColor; @grafanaListMainLinkColor: @linkColor;
// Scrollbars
@scrollbarBackground: #3a3a3a;
@scrollbarBackground2: #3a3a3a;
@scrollbarBorder: black;
// Tables // Tables
// ------------------------- // -------------------------
@tableBackground: transparent; // overall background-color @tableBackground: transparent; // overall background-color
+8 -3
View File
@@ -38,7 +38,7 @@
@submenuBorder: @white; @submenuBorder: @white;
// Tabs // Tabs
@fullEditBorder: @white; @fullEditBorder: @grayLighter;
// Graphite Target Editor // Graphite Target Editor
@grafanaTargetBorder: @submenuBackground; @grafanaTargetBorder: @submenuBackground;
@@ -96,7 +96,7 @@
// Lists // Lists
@grafanaListBackground: transparent; @grafanaListBackground: transparent;
@grafanaListAccent: #f9f9f9; @grafanaListAccent: @grayLighter;
@grafanaListBorderTop: #eee; @grafanaListBorderTop: #eee;
@grafanaListBorderBottom: #efefef; @grafanaListBorderBottom: #efefef;
@grafanaListHighlight: @blue; @grafanaListHighlight: @blue;
@@ -111,6 +111,11 @@
@tableBackgroundHover: #E8F8FD; // for hover @tableBackgroundHover: #E8F8FD; // for hover
@tableBorder: #ddd; // table and cell border @tableBorder: #ddd; // table and cell border
// Scrollbars
@scrollbarBackground: @grayLighter;
@scrollbarBackground2: @grayLighter;
@scrollbarBorder: @grayLight;
// Buttons // Buttons
// ------------------------- // -------------------------
@btnBackground: @grayLighter; @btnBackground: @grayLighter;
@@ -186,7 +191,7 @@
// Input placeholder text color // Input placeholder text color
// ------------------------- // -------------------------
@placeholderText: @gray; @placeholderText: @grayLight;
// Hr border color // Hr border color
@@ -208,7 +208,16 @@ define([
}); });
}); });
describeUpdateVariable('with include all glob no values', function(ctx) {
ctx.setup(function() {
ctx.variable = { type: 'query', query: 'apps.*', name: 'test', includeAll: true, allFormat: 'glob' };
ctx.queryResult = [];
});
it('should add empty glob', function() {
expect(ctx.variable.options[0].value).to.be('{}');
});
});
}); });