Commit 74b3a509 by Torkel Ödegaard

Merge branch 'develop' of github.com:grafana/grafana into develop

parents 514c8a02 a3dd29fb
import React, { PureComponent } from 'react';
import React, { PureComponent } from 'react';
import { Switch } from 'app/core/components/Switch/Switch';
import { Input } from 'app/core/components/Form';
import { isValidTimeSpan } from 'app/core/utils/rangeutil';
......@@ -64,12 +64,7 @@ export class TimeRangeOptions extends PureComponent<Props> {
<div className="gf-form-group">
<div className="gf-form">
<span className="gf-form-label">
<i className="fa fa-clock-o" />
</span>
<span className="gf-form-label width-12">Override relative time</span>
<span className="gf-form-label width-6">Last</span>
<Input
type="text"
className="gf-form-input max-width-8"
......@@ -81,11 +76,7 @@ export class TimeRangeOptions extends PureComponent<Props> {
</div>
<div className="gf-form">
<span className="gf-form-label">
<i className="fa fa-clock-o" />
</span>
<span className="gf-form-label width-12">Add time shift</span>
<span className="gf-form-label width-6">Amount</span>
<Input
type="text"
className="gf-form-input max-width-8"
......@@ -97,11 +88,6 @@ export class TimeRangeOptions extends PureComponent<Props> {
</div>
<div className="gf-form-inline">
<div className="gf-form">
<span className="gf-form-label">
<i className="fa fa-clock-o" />
</span>
</div>
<Switch label="Hide time override info" checked={hideTimeOverride} onChange={this.onToggleTimeOverride} />
</div>
</div>
......
......@@ -12,7 +12,12 @@ function panelEditorTab(dynamicDirectiveSrv) {
},
directive: scope => {
const pluginId = scope.ctrl.pluginId;
const tabName = scope.editorTab.title.toLowerCase().replace(' ', '-');
const tabName = scope.editorTab.title
.toLowerCase()
.replace(' ', '-')
.replace('&', '')
.replace(' ', '')
.replace(' ', '-');
if (directiveCache[pluginId]) {
if (directiveCache[pluginId][tabName]) {
......
......@@ -138,6 +138,7 @@ class GraphCtrl extends MetricsPanelCtrl {
this.addEditorTab('Display options', 'public/app/plugins/panel/graph/tab_display.html');
this.addEditorTab('Axes', axesEditorComponent);
this.addEditorTab('Legend', 'public/app/plugins/panel/graph/tab_legend.html');
this.addEditorTab('Thresholds & Time Regions', 'public/app/plugins/panel/graph/tab_thresholds_time_regions.html');
this.subTabIndex = 0;
}
......
<div class="edit-tab-with-sidemenu">
<aside class="edit-sidemenu-aside">
<ul class="edit-sidemenu">
<li ng-class="{active: ctrl.subTabIndex === 0}">
<a ng-click="ctrl.subTabIndex = 0">Draw options</a>
</li>
<li ng-class="{active: ctrl.subTabIndex === 1}">
<a ng-click="ctrl.subTabIndex = 1">
Series overrides <span class="muted">({{ctrl.panel.seriesOverrides.length}})</span>
</a>
</li>
<li ng-class="{active: ctrl.subTabIndex === 2}">
<a ng-click="ctrl.subTabIndex = 2">
Thresholds <span class="muted">({{ctrl.panel.thresholds.length}})</span>
</a>
</li>
<li ng-class="{active: ctrl.subTabIndex === 3}">
<a ng-click="ctrl.subTabIndex = 3">
Time regions <span class="muted">({{ctrl.panel.timeRegions.length}})</span>
</a>
</li>
</ul>
</aside>
<div class="edit-tab-content" ng-if="ctrl.subTabIndex === 0">
<div class="editor-row">
<div class="section gf-form-group">
<h5 class="section-heading">Draw Modes</h5>
<gf-form-switch class="gf-form" label="Bars" label-class="width-5" checked="ctrl.panel.bars" on-change="ctrl.render()"></gf-form-switch>
......@@ -89,9 +66,7 @@
</div>
</div>
<div class="edit-tab-content" ng-if="ctrl.subTabIndex === 1">
<div class="gf-form-group">
<h5>Series specific overrides <tip>Regex match example: /server[0-3]/i </tip></h5>
<div class="gf-form-inline" ng-repeat="override in ctrl.panel.seriesOverrides" ng-controller="SeriesOverridesCtrl">
<div class="gf-form">
<label class="gf-form-label">alias or regex</label>
......@@ -110,35 +85,26 @@
</span>
</label>
</div>
<div class="gf-form">
<span class="dropdown" dropdown-typeahead="overrideMenu" dropdown-typeahead-on-select="setOverride($item, $subItem)">
</span>
</div>
<div class="gf-form gf-form--grow">
<div class="gf-form-label gf-form-label--grow"></div>
</div>
<div class="gf-form">
<label class="gf-form-label">
<i class="fa fa-trash pointer" ng-click="ctrl.removeSeriesOverride(override)"></i>
</label>
</div>
</div>
<div class="gf-form-button-row">
<button class="btn btn-inverse" ng-click="ctrl.addSeriesOverride()">
<i class="fa fa-plus"></i>&nbsp;Add series override<tip>Regex match example: /server[0-3]/i </tip>
</button>
</div>
</div>
<button class="btn btn-inverse" ng-click="ctrl.addSeriesOverride()">
<i class="fa fa-plus"></i>&nbsp;Add override
</button>
</div>
<div class="edit-tab-content" ng-if="ctrl.subTabIndex === 2">
<graph-threshold-form panel-ctrl="ctrl"></graph-threshold-form>
</div>
<div class="edit-tab-content" ng-if="ctrl.subTabIndex === 3">
<graph-time-region-form panel-ctrl="ctrl"></graph-time-region-form>
</div>
</div>
<graph-threshold-form panel-ctrl="ctrl"></graph-threshold-form>
<graph-time-region-form panel-ctrl="ctrl"></graph-time-region-form>
\ No newline at end of file
<div class="gf-form-group">
<h5>Thresholds</h5>
<p class="muted" ng-show="ctrl.disabled">
Visual thresholds options <strong>disabled.</strong>
Visit the Alert tab update your thresholds. <br>
......
<div class="gf-form-group">
<h5>Time regions <tip>All configured time regions refers to UTC time</tip></h5>
<div class="gf-form-inline" ng-repeat="timeRegion in ctrl.panel.timeRegions">
<div class="gf-form">
<label class="gf-form-label">T{{$index+1}}</label>
......@@ -58,7 +57,7 @@
<div class="gf-form-button-row">
<button class="btn btn-inverse" ng-click="ctrl.addTimeRegion()">
<i class="fa fa-plus"></i>&nbsp;Add time region
<i class="fa fa-plus"></i>&nbsp;Add time region<tip>All configured time regions refers to UTC time</tip>
</button>
</div>
</div>
\ No newline at end of file
......@@ -62,7 +62,7 @@ $critical: #ec2128;
// -------------------------
$body-bg: $gray-7;
$page-bg: $gray-6;
$page-bg: $gray-7;
$body-color: $gray-1;
$text-color: $gray-1;
$text-color-strong: $dark-2;
......@@ -402,6 +402,6 @@ $panel-grid-placeholder-shadow: 0 0 4px $blue-light;
$logs-color-unkown: $gray-5;
// toggle-group
$button-toggle-group-btn-active-bg: linear-gradient(90deg, $yellow, $red);
$button-toggle-group-btn-active-shadow: inset 0 0 4px $black;
$button-toggle-group-btn-active-bg: $brand-primary;
$button-toggle-group-btn-active-shadow: inset 0 0 4px $white;
$button-toggle-group-btn-seperator-border: 1px solid $gray-6;
......@@ -8,13 +8,13 @@
font-weight: $font-weight-semi-bold;
font-size: $font-size-sm;
border-radius: 0;
color: $text-color;
border-right: $button-toggle-group-btn-seperator-border;
&.active {
background: $button-toggle-group-btn-active-bg;
box-shadow: $button-toggle-group-btn-active-shadow;
border-right: 0;
color: $white;
&:hover {
cursor: default;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment