Final polish on panel & row repeats, #1888, still some missing places where…

Final polish on panel & row repeats, #1888, still some missing places where scopedVars needs to be used

public/app/features/dashboard/partials/variableValueSelect.html

 <span class="template-variable" ng-show="!variable.hideLabel" style="padding-right: 5px">
 <span class="template-variable" ng-show="!variable.hideLabel" style="padding-right: 5px">
 	{{labelText}}:
 	{{labelText}}:
 </span>
 </span>
-<a ng-click="show()" class="variable-value-link">
+
+<div style="position: relative; display: inline-block">
+	<a ng-click="show()" class="variable-value-link">
 		{{linkText}}
 		{{linkText}}
 		<i class="fa fa-caret-down"></i>
 		<i class="fa fa-caret-down"></i>
-</a>
+	</a>
 
 
-<div ng-if="selectorOpen" class="variable-value-dropdown">
+	<div ng-if="selectorOpen" class="variable-value-dropdown">
 		<div class="variable-search-wrapper">
 		<div class="variable-search-wrapper">
 			<span style="position: relative;">
 			<span style="position: relative;">
 				<input type="text" placeholder="Search values..." ng-keydown="keyDown($event)" give-focus="giveFocus" tabindex="1" ng-model="search.query" spellcheck='false' ng-change="queryChanged()" />
 				<input type="text" placeholder="Search values..." ng-keydown="keyDown($event)" give-focus="giveFocus" tabindex="1" ng-model="search.query" spellcheck='false' ng-change="queryChanged()" />
@@ -18,7 +20,7 @@
 				ng-class="{'selected': option.selected, 'highlighted': $index === highlightIndex}" ng-click="optionSelected(option, $event)">
 				ng-class="{'selected': option.selected, 'highlighted': $index === highlightIndex}" ng-click="optionSelected(option, $event)">
 				<span >{{option.text}}</label>
 				<span >{{option.text}}</label>
 				<span class="fa fa-fw variable-option-icon"></span>
 				<span class="fa fa-fw variable-option-icon"></span>
-			</div>
 			</a>
 			</a>
 		</div>
 		</div>
+	</div>
 </div>
 </div>

public/app/partials/panelgeneral.html

@@ -38,7 +38,7 @@
 					Repeat Panel
 					Repeat Panel
 				</li>
 				</li>
 				<li>
 				<li>
-					<select class="input-small tight-form-input" ng-model="panel.repeat" ng-options="f.name as f.name for f in dashboard.templating.list">
+					<select class="input-small tight-form-input last" ng-model="panel.repeat" ng-options="f.name as f.name for f in dashboard.templating.list">
 						<option value=""></option>
 						<option value=""></option>
 					</select>
 					</select>
 				</li>
 				</li>

public/app/partials/roweditor.html

+
 <div class="gf-box-header">
 <div class="gf-box-header">
 	<div class="gf-box-title">
 	<div class="gf-box-title">
 		<i class="fa fa-th-list"></i>
 		<i class="fa fa-th-list"></i>
@@ -16,24 +17,46 @@
 
 
 <div class="gf-box-body">
 <div class="gf-box-body">
 
 
-	<div class="editor-row" ng-if="editor.index == 0">
+	<div class="editor-row">
 		<div class="section">
 		<div class="section">
 			<h5>Row details</h5>
 			<h5>Row details</h5>
-			<div class="editor-option">
-				<label class="small">Title</label><input type="text" class="input-medium" ng-model='row.title'></input>
-			</div>
-			<div class="editor-option">
-				<label class="small">Height</label><input type="text" class="input-mini" ng-model='row.height'></input>
+			<div class="tight-form">
+				<ul class="tight-form-list">
+					<li class="tight-form-item">
+						Title
+					</li>
+					<li>
+						<input type="text" class="input-xlarge tight-form-input" ng-model='row.title'></input>
+					</li>
+					<li class="tight-form-item">
+						Height
+					</li>
+					<li>
+						<input type="text" class="input-small tight-form-input" ng-model='row.height'></input>
+					</li>
+					<li class="tight-form-item">
+						<label class="checkbox-label" for="row.showTitle">Show Title</label>
+						<input class="cr1" id="row.showTitle" type="checkbox" ng-model="row.showTitle" ng-checked="row.showTitle">
+						<label for="row.showTitle" class="cr1"></label>
+					</li>
+				</ul>
+				<div class="clearfix"></div>
 			</div>
 			</div>
-			<editor-opt-bool text="Editable" model="row.editable"></editor-opt-bool>
-			<editor-opt-bool text="Show title" model="row.showTitle"></editor-opt-bool>
 		</div>
 		</div>
-
 		<div class="section">
 		<div class="section">
 			<h5>Templating options</h5>
 			<h5>Templating options</h5>
-			<div class="editor-option">
-				<label class="small">Repeat row</label>
-				<input type="text" class="input-medium" ng-model='row.repeat'></input>
+			<div class="tight-form">
+				<ul class="tight-form-list">
+					<li class="tight-form-item">
+						Repeat Row
+					</li>
+					<li>
+						<select class="input-small tight-form-input last" ng-model="row.repeat" ng-options="f.name as f.name for f in dashboard.templating.list">
+							<option value=""></option>
+						</select>
+					</li>
+				</ul>
+				<div class="clearfix"></div>
 			</div>
 			</div>
 		</div>
 		</div>
 	</div>
 	</div>

public/css/less/submenu.less

@@ -26,7 +26,7 @@
 
 
 .variable-value-dropdown {
 .variable-value-dropdown {
   position: absolute;
   position: absolute;
-  top: 35px;
+  top: 27px;
   min-width: 150px;
   min-width: 150px;
   max-height: 400px;
   max-height: 400px;
   background: @grafanaPanelBackground;
   background: @grafanaPanelBackground;