Skip to content

N
nexpie-grafana-theme
Commit 74b3a509 by Torkel Ödegaard
Options

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

parents 514c8a02 a3dd29fb
Showing with 26 additions and 66 deletions
public/app/features/dashboard/dashgrid/TimeRangeOptions.tsx
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { Switch } from 'app/core/components/Switch/Switch'; import { Switch } from 'app/core/components/Switch/Switch';
import { Input } from 'app/core/components/Form'; import { Input } from 'app/core/components/Form';
import { isValidTimeSpan } from 'app/core/utils/rangeutil'; import { isValidTimeSpan } from 'app/core/utils/rangeutil';
...@@ -64,12 +64,7 @@ export class TimeRangeOptions extends PureComponent<Props> { ...@@ -64,12 +64,7 @@ export class TimeRangeOptions extends PureComponent<Props> {
<div className="gf-form-group"> <div className="gf-form-group">
<div className="gf-form"> <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-12">Override relative time</span>
<span className="gf-form-label width-6">Last</span>
<Input <Input
type="text" type="text"
className="gf-form-input max-width-8" className="gf-form-input max-width-8"
...@@ -81,11 +76,7 @@ export class TimeRangeOptions extends PureComponent<Props> { ...@@ -81,11 +76,7 @@ export class TimeRangeOptions extends PureComponent<Props> {
</div> </div>
<div className="gf-form"> <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-12">Add time shift</span>
<span className="gf-form-label width-6">Amount</span>
<Input <Input
type="text" type="text"
className="gf-form-input max-width-8" className="gf-form-input max-width-8"
...@@ -97,11 +88,6 @@ export class TimeRangeOptions extends PureComponent<Props> { ...@@ -97,11 +88,6 @@ export class TimeRangeOptions extends PureComponent<Props> {
</div> </div>
<div className="gf-form-inline"> <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} /> <Switch label="Hide time override info" checked={hideTimeOverride} onChange={this.onToggleTimeOverride} />
</div> </div>
</div> </div>
......
public/app/features/panel/panel_editor_tab.ts
...@@ -12,7 +12,12 @@ function panelEditorTab(dynamicDirectiveSrv) { ...@@ -12,7 +12,12 @@ function panelEditorTab(dynamicDirectiveSrv) {
}, },
directive: scope => { directive: scope => {
const pluginId = scope.ctrl.pluginId; 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]) {
if (directiveCache[pluginId][tabName]) { if (directiveCache[pluginId][tabName]) {
......
public/app/plugins/panel/graph/module.ts
...@@ -138,6 +138,7 @@ class GraphCtrl extends MetricsPanelCtrl { ...@@ -138,6 +138,7 @@ class GraphCtrl extends MetricsPanelCtrl {
this.addEditorTab('Display options', 'public/app/plugins/panel/graph/tab_display.html'); this.addEditorTab('Display options', 'public/app/plugins/panel/graph/tab_display.html');
this.addEditorTab('Axes', axesEditorComponent); this.addEditorTab('Axes', axesEditorComponent);
this.addEditorTab('Legend', 'public/app/plugins/panel/graph/tab_legend.html'); 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; this.subTabIndex = 0;
} }
......
public/app/plugins/panel/graph/tab_display.html
<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"> <div class="section gf-form-group">
<h5 class="section-heading">Draw Modes</h5> <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> <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 @@ ...@@ -89,9 +66,7 @@
</div> </div>
</div> </div>
<div class="edit-tab-content" ng-if="ctrl.subTabIndex === 1">
<div class="gf-form-group"> <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-inline" ng-repeat="override in ctrl.panel.seriesOverrides" ng-controller="SeriesOverridesCtrl">
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label">alias or regex</label> <label class="gf-form-label">alias or regex</label>
...@@ -110,35 +85,26 @@ ...@@ -110,35 +85,26 @@
</span> </span>
</label> </label>
</div> </div>
<div class="gf-form"> <div class="gf-form">
<span class="dropdown" dropdown-typeahead="overrideMenu" dropdown-typeahead-on-select="setOverride($item, $subItem)"> <span class="dropdown" dropdown-typeahead="overrideMenu" dropdown-typeahead-on-select="setOverride($item, $subItem)">
</span> </span>
</div> </div>
<div class="gf-form gf-form--grow"> <div class="gf-form gf-form--grow">
<div class="gf-form-label gf-form-label--grow"></div> <div class="gf-form-label gf-form-label--grow"></div>
</div> </div>
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label"> <label class="gf-form-label">
<i class="fa fa-trash pointer" ng-click="ctrl.removeSeriesOverride(override)"></i> <i class="fa fa-trash pointer" ng-click="ctrl.removeSeriesOverride(override)"></i>
</label> </label>
</div> </div>
</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> </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>
public/app/plugins/panel/graph/tab_thresholds_time_regions.html 0 → 100644
<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
public/app/plugins/panel/graph/thresholds_form.html
<div class="gf-form-group"> <div class="gf-form-group">
<h5>Thresholds</h5>
<p class="muted" ng-show="ctrl.disabled"> <p class="muted" ng-show="ctrl.disabled">
Visual thresholds options <strong>disabled.</strong> Visual thresholds options <strong>disabled.</strong>
Visit the Alert tab update your thresholds. <br> Visit the Alert tab update your thresholds. <br>
......
public/app/plugins/panel/graph/time_regions_form.html
<div class="gf-form-group"> <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-inline" ng-repeat="timeRegion in ctrl.panel.timeRegions">
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label">T{{$index+1}}</label> <label class="gf-form-label">T{{$index+1}}</label>
...@@ -58,7 +57,7 @@ ...@@ -58,7 +57,7 @@
<div class="gf-form-button-row"> <div class="gf-form-button-row">
<button class="btn btn-inverse" ng-click="ctrl.addTimeRegion()"> <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> </button>
</div> </div>
</div> </div>
\ No newline at end of file
public/sass/_variables.light.scss
...@@ -62,7 +62,7 @@ $critical: #ec2128; ...@@ -62,7 +62,7 @@ $critical: #ec2128;
// ------------------------- // -------------------------
$body-bg: $gray-7; $body-bg: $gray-7;
$page-bg: $gray-6; $page-bg: $gray-7;
$body-color: $gray-1; $body-color: $gray-1;
$text-color: $gray-1; $text-color: $gray-1;
$text-color-strong: $dark-2; $text-color-strong: $dark-2;
...@@ -402,6 +402,6 @@ $panel-grid-placeholder-shadow: 0 0 4px $blue-light; ...@@ -402,6 +402,6 @@ $panel-grid-placeholder-shadow: 0 0 4px $blue-light;
$logs-color-unkown: $gray-5; $logs-color-unkown: $gray-5;
// toggle-group // toggle-group
$button-toggle-group-btn-active-bg: linear-gradient(90deg, $yellow, $red); $button-toggle-group-btn-active-bg: $brand-primary;
$button-toggle-group-btn-active-shadow: inset 0 0 4px $black; $button-toggle-group-btn-active-shadow: inset 0 0 4px $white;
$button-toggle-group-btn-seperator-border: 1px solid $gray-6; $button-toggle-group-btn-seperator-border: 1px solid $gray-6;
public/sass/components/_toggle_button_group.scss
...@@ -8,13 +8,13 @@ ...@@ -8,13 +8,13 @@
font-weight: $font-weight-semi-bold; font-weight: $font-weight-semi-bold;
font-size: $font-size-sm; font-size: $font-size-sm;
border-radius: 0; border-radius: 0;
color: $text-color;
border-right: $button-toggle-group-btn-seperator-border; border-right: $button-toggle-group-btn-seperator-border;
&.active { &.active {
background: $button-toggle-group-btn-active-bg; background: $button-toggle-group-btn-active-bg;
box-shadow: $button-toggle-group-btn-active-shadow; box-shadow: $button-toggle-group-btn-active-shadow;
border-right: 0; border-right: 0;
color: $white;
&:hover { &:hover {
cursor: default; 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