graphite: split tags and functions into 2 rows when seriesByTag used

public/app/plugins/datasource/graphite/partials/query.editor.html

@@ -1,13 +1,13 @@
 <query-editor-row query-ctrl="ctrl" has-text-edit-mode="true">
 
-	<div class="gf-form" ng-show="ctrl.target.textEditor">
-		<input type="text" class="gf-form-input" ng-model="ctrl.target.target" spellcheck="false" ng-blur="ctrl.targetTextChanged()"></input>
-	</div>
+  <div class="gf-form" ng-show="ctrl.target.textEditor">
+    <input type="text" class="gf-form-input" ng-model="ctrl.target.target" spellcheck="false" ng-blur="ctrl.targetTextChanged()"></input>
+  </div>
 
   <div ng-hide="ctrl.target.textEditor">
-		<div class="gf-form-inline">
-      <div class="gf-form" ng-if="ctrl.queryModel.seriesByTagUsed">
-        <label class="gf-form-label query-keyword">seriesByTag</label>
+    <div class="gf-form-inline" ng-if="ctrl.queryModel.seriesByTagUsed">
+      <div class="gf-form">
+        <label class="gf-form-label width-6 query-keyword">Tags</label>
       </div>
 
       <div ng-repeat="tag in ctrl.queryModel.tags" class="gf-form">
@@ -31,6 +31,15 @@
           on-change="ctrl.addNewTag(segment)">
         </metric-segment>
       </div>
+      <div class="gf-form gf-form--grow">
+        <div class="gf-form-label gf-form-label--grow"></div>
+      </div>
+    </div>
+
+    <div class="gf-form-inline">
+      <div class="gf-form" ng-if="ctrl.queryModel.seriesByTagUsed">
+        <label class="gf-form-label width-6 query-keyword">Functions</label>
+      </div>
 
       <div ng-repeat="segment in ctrl.segments" role="menuitem" class="gf-form">
         <metric-segment segment="segment" get-options="ctrl.getAltSegments($index)" on-change="ctrl.segmentValueChanged(segment, $index)"></metric-segment>
@@ -45,8 +54,8 @@
       </div>
 
       <div class="gf-form gf-form--grow">
-				<div class="gf-form-label gf-form-label--grow"></div>
-			</div>
+        <div class="gf-form-label gf-form-label--grow"></div>
+      </div>
     </div>
   </div>