From 2a45e879bb8f63a5d2c3d8887d8feae9cdd205cd Mon Sep 17 00:00:00 2001
From: bergquist <carl.bergquist@gmail.com>
Date: Wed, 24 Feb 2016 07:20:54 +0100
Subject: [PATCH] ux(panel_timesettings): tight-form -> gf-form

---
 .../features/panel/partials/panelTime.html    | 87 +++++++------------
 1 file changed, 31 insertions(+), 56 deletions(-)

diff --git a/public/app/features/panel/partials/panelTime.html b/public/app/features/panel/partials/panelTime.html
index 4e7c7c7259c..7fd398a9282 100644
--- a/public/app/features/panel/partials/panelTime.html
+++ b/public/app/features/panel/partials/panelTime.html
@@ -1,59 +1,34 @@
-<div class="editor-row">
-	<div class="section tight-form-container" style="margin-bottom: 20px">
-		<div class="tight-form">
-			<ul class="tight-form-list">
-				<li class="tight-form-item tight-form-item-icon">
-					<i class="fa fa-clock-o"></i>
-				</li>
-				<li class="tight-form-item" style="width: 178px">
-					<strong>Override relative time</strong>
-				</li>
-				<li class="tight-form-item" style="width: 50px">
-					Last
-				</li>
-				<li>
-					<input type="text" class="input-small tight-form-input last" placeholder="1h"
-					  empty-to-null ng-model="ctrl.panel.timeFrom" valid-time-span
-					  ng-change="ctrl.refresh()" ng-model-onblur>
-				</li>
-			</ul>
-			<div class="clearfix"></div>
-		</div>
-		<div class="tight-form">
-			<ul class="tight-form-list">
-				<li class="tight-form-item tight-form-item-icon">
-					<i class="fa fa-clock-o"></i>
-				</li>
-				<li class="tight-form-item" style="width: 178px">
-					<strong>Add time shift</strong>
-				</li>
-				<li class="tight-form-item" style="width: 50px">
-					Amount
-				</li>
-				<li>
-					<input type="text" class="input-small tight-form-input last" placeholder="1h"
-					empty-to-null ng-model="ctrl.panel.timeShift" valid-time-span
-					ng-change="ctrl.refresh()" ng-model-onblur>
-				</li>
-			</ul>
-			<div class="clearfix"></div>
-		</div>
-		<div class="tight-form">
-			<ul class="tight-form-list">
-				<li class="tight-form-item tight-form-item-icon">
-					<i class="fa fa-clock-o"></i>
-				</li>
-				<li class="tight-form-item" style="width: 178px">
-					<strong>Hide time override info</strong>
-				</li>
-				<li class="tight-form-item last">
-					<input class="cr1" id="ctrl.panel.hideTimeOverride" type="checkbox"
-					ng-model="ctrl.panel.hideTimeOverride" ng-checked="ctrl.panel.hideTimeOverride" ng-change="ctrl.refresh()">
-					<label for="ctrl.panel.hideTimeOverride" class="cr1"></label>
-				</li>
-			</ul>
-			<div class="clearfix"></div>
-		</div>
+<div class="gf-form-group">
+	<div class="gf-form">
+		<span class="gf-form-label">
+			<i class="fa fa-clock-o"></i>
+		</span>
+
+		<span class="gf-form-label width-12">Override relative time</span>
+		<span class="gf-form-label width-6">Last</span>
+
+		<input type="text" class="gf-form-input max-width-8" placeholder="1h"
+			empty-to-null ng-model="ctrl.panel.timeFrom" valid-time-span
+			ng-change="ctrl.refresh()" ng-model-onblur>
+	</div>
+
+	<div class="gf-form">
+		<span class="gf-form-label">
+			<i class="fa fa-clock-o"></i>
+		</span>
+		<span class="gf-form-label width-12">Add time shift</span>
+		<span class="gf-form-label width-6">Amount</span>
+		<input type="text" class="gf-form-input max-width-8" placeholder="1h"
+			empty-to-null ng-model="ctrl.panel.timeShift" valid-time-span
+			ng-change="ctrl.refresh()" ng-model-onblur>
+	</div>
+
+	<div class="gf-form">
+		<span class="gf-form-label">
+			<i class="fa fa-clock-o"></i>
+		</span>
+		<editor-checkbox text="Hide time override info" model="ctrl.panel.hideTimeOverride" change="ctrl.refresh()"></editor-checkbox>
 	</div>
 </div>
 
+