From ae99317dd40df0c38bb7ae94086ad181f134b9c6 Mon Sep 17 00:00:00 2001
From: Valessio Soares de Brito <contato@valessiobrito.info>
Date: Wed, 27 Jul 2011 18:38:08 -0300
Subject: [PATCH] style button

---
 src/web/static/css/survey.css | 20 ++++++++++++++++++--
 src/web/templates/survey.html | 24 ++++++++++++++----------
 2 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/src/web/static/css/survey.css b/src/web/static/css/survey.css
index 44511f2..8e03f60 100644
--- a/src/web/static/css/survey.css
+++ b/src/web/static/css/survey.css
@@ -93,6 +93,7 @@ font-size:
 }
 
 .radioButton,
+.radioButton:hover,
 #next-button,
 #restart-button,
 #continue-button,
@@ -113,29 +114,44 @@ z-index: 2;
 cursor: pointer;
 }
 
+.radioButton:hover { height: 20px; }
+
 #continue-button {
 float: right;
 }
 
-.radioButton:hover,
 #next-button:hover,
 #controls-form input:hover {
 background: white;
 }
 
 .radioButton {
+border: 1px solid white;
+box-shadow: 0 1px 4px white inset;
 text-align: left;
 vertical-align: middle;
-cursor: normal;
 width: 150px;
 height: 20px;
 margin-bottom: 10px;
 float: left;
+font-size: 12px;
+font-weight: 600;
+line-height: 14px;
+margin: 0;
+margin-left: 10px;
+padding: 5px;
+z-index: 2;
+cursor: pointer;
 }
 
 #panel-controls {
 position: relative; 
 width: 180px;
+padding: 5px;
+border-radius: 5px;
+border: 1px solid #888a85;
+box-shadow: 0 1px 4px gray inset;
+background: white;
 float: right;
 }
 
diff --git a/src/web/templates/survey.html b/src/web/templates/survey.html
index a3bdc4f..d5bc8ef 100644
--- a/src/web/templates/survey.html
+++ b/src/web/templates/survey.html
@@ -66,15 +66,10 @@ $for pkg in pkg_details:
 			<h1 id="title_pkg">$pkg['package'] <br />
 			<span>$pkg['description']</span></h1>
 			</p>
-		     	<div id="panel-controls">
-			<label class="glass radioButton">
-			<input class="radio" type="radio" name="evaluation-$pkg_details.index(pkg)" value="surprising" />
-			Pleasantly surprising 
-			<!--<div class="tip tip">
-			<p>Pleasantly $pkg['package'] FIXME </p>
-			</div>-->
-			</label><br />
-       			<label class="glass radioButton">
+		     	<div id="panel-controls" class="glass">
+		   <fieldset>
+		     <legend>Do you consider this recommendation useful?</legend>
+       			<label class="radioButton">
 			<img src="/static/images/yes-enb.JPG" alt="Yes, Good" style="float: right;">
 			<input class="radio" type="radio" name="evaluation-$pkg_details.index(pkg)" value="good" />
 			Yes
@@ -82,14 +77,23 @@ $for pkg in pkg_details:
 			<p>Good $pkg['package'] FIXME </p>
 			</div>-->
 			</label><br />
-			<label class="glass radioButton">
+			<label class="radioButton">
 			<img src="/static/images/no-dis.JPG" alt="Poor" style="float: right;">
 			<input class="radio" type="radio" name="evaluation-$pkg_details.index(pkg)" value="poor" />
 			No
 			<!--<div class="tip tip">
 			<p>Poor $pkg['package'] FIXME </p>
 			</div>-->
+			</label><br />
+		     <legend>Was it surprising?</legend>
+			<label class="radioButton">
+			<input class="radio" type="radio" name="evaluation-$pkg_details.index(pkg)" value="surprising" />
+			Pleasantly surprising 
+			<!--<div class="tip tip">
+			<p>Pleasantly $pkg['package'] FIXME </p>
+			</div>-->
 			</label>
+		   </fieldset>
 			<br style="clear: both;" />
 		     	</div><!-- #panel-controls -->
             		<div class="content-pkg">
--
libgit2 0.21.2