mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
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:
@@ -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);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
@@ -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}} ({{tag.count}})</span>
|
<span>{{tag.term}} ({{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">
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
@@ -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});
|
||||||
|
|||||||
@@ -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 {
|
||||||
|
|||||||
@@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -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,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 {
|
||||||
|
|||||||
@@ -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
|
||||||
|
|||||||
@@ -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('{}');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user