refactoring(ui): minor ui improvement to graph axis tab

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;"
@@ -15,43 +15,51 @@
 					dropdown-typeahead-on-select="setUnitFormat(0, $subItem)">
 				</li>
 				<li class="tight-form-item">
-					&nbsp;&nbsp; Grid Max
+					Scale type
 				</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>
+					<select class="input-small tight-form-input" style="width: 113px" ng-model="panel.grid.leftLogBase" ng-options="v as k for (k, v) in logScales" ng-change="render()"></select>
 				</li>
 				<li class="tight-form-item">
-					Min
+					Label
 				</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>
+					<input type="text" class="input-small tight-form-input last"
+					ng-model="panel.leftYAxisLabel" 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">
+					<i class="fa fa-remove invisible"></i>
 				</li>
 				<li class="tight-form-item">
-					Scale type
+					Y-Max
 				</li>
 				<li>
-					<select class="input-small tight-form-input" style="width: 113px" ng-model="panel.grid.leftLogBase" ng-options="v as k for (k, v) in logScales" ng-change="render()"></select>
+					<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">
-					Label
+				<li class="tight-form-item" style="width: 115px; text-align: right;">
+					Y-Min
 				</li>
 				<li>
-					<input type="text" class="input-small tight-form-input last"
-					ng-model="panel.leftYAxisLabel" ng-change="render()" ng-model-onblur>
+					<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>
+				</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">
 					Right Y
 				</li>
-				<li class="tight-form-item">
+				<li class="tight-form-item" style="width: 40px">
 					Unit
 				</li>
 				<li class="dropdown" style="width: 140px"
@@ -60,37 +68,46 @@
 					dropdown-typeahead-on-select="setUnitFormat(1, $subItem)">
 				</li>
 				<li class="tight-form-item">
-					&nbsp;&nbsp; Grid Max
+					Scale type
 				</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>
+					<select class="input-small tight-form-input" style="width: 113px" ng-model="panel.grid.rightLogBase" ng-options="v as k for (k, v) in logScales" ng-change="render()"></select>
 				</li>
 				<li class="tight-form-item">
-					Min
+					Label
 				</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>
+					<input type="text" class="input-small tight-form-input last"
+					ng-model="panel.rightYAxisLabel" ng-change="render()" ng-model-onblur>
+				</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">
+					<i class="fa fa-remove invisible"></i>
 				</li>
 				<li class="tight-form-item">
-					Scale type
+					Y-Max
 				</li>
 				<li>
-					<select class="input-small tight-form-input" style="width: 113px" ng-model="panel.grid.rightLogBase" ng-options="v as k for (k, v) in logScales" ng-change="render()"></select>
+					<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">
-					Label
+				<li class="tight-form-item" style="width: 115px; text-align: right;">
+					Y-Min
 				</li>
 				<li>
-					<input type="text" class="input-small tight-form-input last"
-					ng-model="panel.rightYAxisLabel" ng-change="render()" ng-model-onblur>
+					<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">
@@ -170,6 +187,21 @@
 		<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
 				</li>
 				<li class="tight-form-item">
@@ -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>