Skip to content

N
nexpie-grafana-theme
Commit a1e39ce2 by Torkel Ödegaard
Options

Fixed show/hide axis toggles, #1331

parent c39f9ed2
Showing with 90 additions and 73 deletions
src/app/directives/arrayJoin.js
...@@ -31,4 +31,5 @@ function (angular, app, _) { ...@@ -31,4 +31,5 @@ function (angular, app, _) {
} }
}; };
}); });
}); });
src/app/panels/graph/axisEditor.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="grafana-target-inner"> <div class="grafana-target-inner">
<ul class="grafana-segment-list"> <ul class="grafana-segment-list">
<li class="grafana-target-segment" style="width: 90px"> <li class="grafana-target-segment" style="width: 90px">
<strong>Left Y Axis</strong> <strong>Left Y</strong>
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Unit Unit
...@@ -38,16 +38,13 @@ ...@@ -38,16 +38,13 @@
<input type="text" class="input-small grafana-target-segment-input" placeholder="auto" <input type="text" class="input-small grafana-target-segment-input" placeholder="auto"
ng-model="panel.leftYAxisLabel" ng-change="render()" ng-model-onblur> ng-model="panel.leftYAxisLabel" ng-change="render()" ng-model-onblur>
</li> </li>
<li class="grafana-target-segment">
Show
</li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="grafana-target-inner"> <div class="grafana-target-inner">
<ul class="grafana-segment-list"> <ul class="grafana-segment-list">
<li class="grafana-target-segment" style="width: 90px"> <li class="grafana-target-segment" style="width: 90px">
<strong>Right Y Axis</strong> <strong>Right Y</strong>
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Unit Unit
...@@ -80,91 +77,110 @@ ...@@ -80,91 +77,110 @@
<input type="text" class="input-small grafana-target-segment-input" placeholder="auto" <input type="text" class="input-small grafana-target-segment-input" placeholder="auto"
ng-model="panel.rightYAxisLabel" ng-change="render()" ng-model-onblur> ng-model="panel.rightYAxisLabel" ng-change="render()" ng-model-onblur>
</li> </li>
</ul>
<div class="clearfix"></div>
</div>
<div class="grafana-target-inner">
<ul class="grafana-segment-list">
<li class="grafana-target-segment" style="width: 90px">
<strong>Show Axis</strong>
</li>
<li class="grafana-target-segment">
X-Axis&nbsp;
<input class="cr1" id="hideXAxis" type="checkbox"
ng-model="panel['x-axis']" ng-checked="panel['x-axis']" ng-change="render()">
<label for="hideXAxis" class="cr1"></label>
</li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Show Y-Axis&nbsp;
<input class="cr1" id="hideYAxis" type="checkbox"
ng-model="panel['y-axis']" ng-checked="panel['y-axis']" ng-change="render()">
<label for="hideYAxis" class="cr1"></label>
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="editor-row" style="margin-top: 20px"> <div class="editor-row" style="margin-top: 20px">
<div class="section"> <div class="section">
<div class="grafana-target"> <div class="grafana-target">
<div class="grafana-target-inner"> <div class="grafana-target-inner">
<ul class="grafana-segment-list"> <ul class="grafana-segment-list">
<li class="grafana-target-segment" style="width: 90px"> <li class="grafana-target-segment" style="width: 90px">
<strong>Thresholds</strong> <strong>Thresholds</strong>
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Level 1 Level 1
</li> </li>
<li> <li>
<input type="text" class="input-small grafana-target-segment-input"> <input type="text" class="input-small grafana-target-segment-input">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
<spectrum-picker ng-model="panel.grid.threshold1Color" ng-change="render()" ></spectrum-picker> <spectrum-picker ng-model="panel.grid.threshold1Color" ng-change="render()" ></spectrum-picker>
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Level 2 Level 2
</li> </li>
<li> <li>
<input type="text" class="input-small grafana-target-segment-input"> <input type="text" class="input-small grafana-target-segment-input">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
<spectrum-picker ng-model="panel.grid.threshold2Color" ng-change="render()" ></spectrum-picker> <spectrum-picker ng-model="panel.grid.threshold2Color" ng-change="render()" ></spectrum-picker>
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Line mode Line mode
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div>
</div> </div>
</div> </div>
</div>
</div> </div>
<div class="editor-row" style="margin-top: 20px"> <div class="editor-row" style="margin-top: 20px">
<div class="section"> <div class="section">
<div class="grafana-target"> <div class="grafana-target">
<div class="grafana-target-inner"> <div class="grafana-target-inner">
<ul class="grafana-segment-list"> <ul class="grafana-segment-list">
<li class="grafana-target-segment" style="width: 90px"> <li class="grafana-target-segment" style="width: 90px">
<strong>Legend</strong> <strong>Legend</strong>
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Show: <input type="checkbox"> Show: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Table: <input type="checkbox"> Table: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Right side: <input type="checkbox"> Right side: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Hide empty: <input type="checkbox"> Hide empty: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Min: <input type="checkbox"> Min: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Max: <input type="checkbox"> Max: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Avg: <input type="checkbox"> Avg: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Total: <input type="checkbox"> Total: <input type="checkbox">
</li> </li>
<li class="grafana-target-segment"> <li class="grafana-target-segment">
Current: <input type="checkbox"> Current: <input type="checkbox">
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div>
</div> </div>
</div> </div>
</div>
</div> </div>
src/css/less/forms.less
...@@ -15,7 +15,7 @@ input[type="checkbox"]+.cr1 { ...@@ -15,7 +15,7 @@ input[type="checkbox"]+.cr1 {
height: 19px; height: 19px;
clear: none; clear: none;
text-indent: 2px; text-indent: 2px;
margin-top: 4px; margin: 0;
padding: 0 0 0 20px; padding: 0 0 0 20px;
vertical-align:middle; vertical-align:middle;
background: url(@checkboxImageUrl) left top no-repeat; background: url(@checkboxImageUrl) left top no-repeat;
......
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