From 75b83af08ff4056ee0cdd6e5ef231be1d22c6a6b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel.odegaard@gmail.com>
Date: Tue, 1 Dec 2015 14:04:44 +0100
Subject: [PATCH] refactoring(ui): minor ui improvement to graph axis tab

---
 public/app/panels/graph/axisEditor.html | 118 ++++++++++++++----------
 1 file changed, 68 insertions(+), 50 deletions(-)

diff --git a/public/app/panels/graph/axisEditor.html b/public/app/panels/graph/axisEditor.html
index 175c0c78fa7..2c22dee8359 100644
--- a/public/app/panels/graph/axisEditor.html
+++ b/public/app/panels/graph/axisEditor.html
@@ -6,7 +6,7 @@
 				<li class="tight-form-item" style="width: 80px">
 					Left Y
 				</li>
-				<li class="tight-form-item">
+				<li class="tight-form-item" style="width: 40px">
 					Unit
 				</li>
 				<li class="dropdown" style="width: 140px;"
@@ -14,22 +14,6 @@
 					dropdown-typeahead="unitFormats"
 					dropdown-typeahead-on-select="setUnitFormat(0, $subItem)">
 				</li>
-				<li class="tight-form-item">
-					&nbsp;&nbsp; Grid Max
-				</li>
-				<li>
-					<input type="number" class="input-small tight-form-input" placeholder="auto"
-					empty-to-null ng-model="panel.grid.leftMax"
-					ng-change="render()" ng-model-onblur>
-				</li>
-				<li class="tight-form-item">
-					Min
-				</li>
-				<li>
-					<input type="number" class="input-small tight-form-input" placeholder="auto"
-					empty-to-null ng-model="panel.grid.leftMin"
-					ng-change="render()" ng-model-onblur>
-				</li>
 				<li class="tight-form-item">
 					Scale type
 				</li>
@@ -46,12 +30,36 @@
 			</ul>
 			<div class="clearfix"></div>
 		</div>
-		<div class="tight-form last">
+		<div class="tight-form">
+			<ul class="tight-form-list">
+				<li class="tight-form-item" style="width: 80px">
+					<i class="fa fa-remove invisible"></i>
+				</li>
+				<li class="tight-form-item">
+					Y-Max
+				</li>
+				<li>
+					<input type="number" class="input-small tight-form-input" placeholder="auto"
+					empty-to-null ng-model="panel.grid.leftMax"
+					ng-change="render()" ng-model-onblur>
+				</li>
+				<li class="tight-form-item" style="width: 115px; text-align: right;">
+					Y-Min
+				</li>
+				<li>
+					<input type="number" class="input-small tight-form-input" placeholder="auto" style="width: 113px;"
+					empty-to-null ng-model="panel.grid.leftMin"
+					ng-change="render()" ng-model-onblur>
+				</li>
+				</ul>
+			<div class="clearfix"></div>
+		</div>
+		<div class="tight-form">
 			<ul class="tight-form-list">
 				<li class="tight-form-item" style="width: 80px">
 					Right Y
 				</li>
-				<li class="tight-form-item">
+				<li class="tight-form-item" style="width: 40px">
 					Unit
 				</li>
 				<li class="dropdown" style="width: 140px"
@@ -59,22 +67,6 @@
 					dropdown-typeahead="unitFormats"
 					dropdown-typeahead-on-select="setUnitFormat(1, $subItem)">
 				</li>
-				<li class="tight-form-item">
-					&nbsp;&nbsp; Grid Max
-				</li>
-				<li>
-					<input type="number" class="input-small tight-form-input" placeholder="auto"
-					empty-to-null ng-model="panel.grid.rightMax"
-					ng-change="render()" ng-model-onblur>
-				</li>
-				<li class="tight-form-item">
-					Min
-				</li>
-				<li>
-					<input type="number" class="input-small tight-form-input" placeholder="auto"
-					empty-to-null ng-model="panel.grid.rightMin"
-					ng-change="render()" ng-model-onblur>
-				</li>
 				<li class="tight-form-item">
 					Scale type
 				</li>
@@ -91,6 +83,31 @@
 			</ul>
 			<div class="clearfix"></div>
 		</div>
+		<div class="tight-form last">
+			<ul class="tight-form-list">
+				<li class="tight-form-item" style="width: 80px">
+					<i class="fa fa-remove invisible"></i>
+				</li>
+				<li class="tight-form-item">
+					Y-Max
+				</li>
+				<li>
+					<input type="number" class="input-small tight-form-input" placeholder="auto"
+					empty-to-null ng-model="panel.grid.rightMax"
+					ng-change="render()" ng-model-onblur>
+				</li>
+				<li class="tight-form-item" style="width: 115px; text-align: right;">
+					Y-Min
+				</li>
+				<li>
+					<input type="number" class="input-small tight-form-input" placeholder="auto" style="width: 113px;"
+					empty-to-null ng-model="panel.grid.rightMin"
+					ng-change="render()" ng-model-onblur>
+				</li>
+			</ul>
+			<div class="clearfix"></div>
+		</div>
+
 	</div>
 
 	<div class="section" style="margin-bottom: 20px">
@@ -168,6 +185,21 @@
 			<div class="clearfix"></div>
 		</div>
 		<div class="tight-form">
+			<ul class="tight-form-list">
+				<li class="tight-form-item" style="width: 80px">
+					Hide series
+				</li>
+				<li class="tight-form-item">
+					<editor-checkbox text="with only nulls" model="panel.legend.hideEmpty" change="render()"></editor-checkbox>
+				</li>
+				<li class="tight-form-item last">
+					<editor-checkbox text="with only zeroes" model="panel.legend.hideZero" change="render()"></editor-checkbox>
+				</li>
+			</ul>
+			<div class="clearfix"></div>
+		</div>
+
+		<div class="tight-form last">
 			<ul class="tight-form-list">
 				<li class="tight-form-item" style="width: 80px">
 					Values
@@ -184,7 +216,7 @@
 				<li class="tight-form-item">
 					<editor-checkbox text="Current" model="panel.legend.current" change="legendValuesOptionChanged()"></editor-checkbox>
 				</li>
-				<li class="tight-form-item last">
+				<li class="tight-form-item">
 					<editor-checkbox text="Total" model="panel.legend.total" change="legendValuesOptionChanged()"></editor-checkbox>
 				</li>
 				<li class="tight-form-item">
@@ -197,19 +229,5 @@
 			</ul>
 			<div class="clearfix"></div>
 		</div>
-		<div class="tight-form">
-			<ul class="tight-form-list">
-				<li class="tight-form-item" style="width: 80px">
-					Hide
-				</li>
-				<li class="tight-form-item last">
-					<editor-checkbox text="All null series" model="panel.legend.hideEmpty" change="render()"></editor-checkbox>
-				</li>
-        <li class="tight-form-item last">
-          <editor-checkbox text="All zero series" model="panel.legend.hideZero" change="render()"></editor-checkbox>
-        </li>
-			</ul>
-			<div class="clearfix"></div>
-		</div>
 	</div>
 </div>