From 767b8d6894730d662beefde9e531004c332cdaa5 Mon Sep 17 00:00:00 2001
From: George Michael Brower <georgebrower@google.com>
Date: Mon, 24 Jan 2011 14:21:21 -0700
Subject: [PATCH] Style changes

---
 controller.boolean.js  |  3 ++-
 controller.function.js |  4 +---
 demo.html              |  3 +++
 gui.css                | 51 +++++++++++++++++++++++++++++-------------
 4 files changed, 42 insertions(+), 19 deletions(-)

diff --git a/controller.boolean.js b/controller.boolean.js
index eb2c0f8..3acc78f 100644
--- a/controller.boolean.js
+++ b/controller.boolean.js
@@ -16,7 +16,8 @@ var BooleanController = function() {
     	input.checked = !input.checked; // counteracts default.
     }, false);
     
-    this.domElement.style.cursor = 'pointer';
+    this.domElement.style.cursor = "pointer";
+    this.propertyNameElement.style.cursor = "pointer";
     this.domElement.appendChild(input);
 
 };
diff --git a/controller.function.js b/controller.function.js
index 5b5e765..d523562 100644
--- a/controller.function.js
+++ b/controller.function.js
@@ -2,13 +2,11 @@ var FunctionController = function() {
 	this.type = "function";
 	var _this = this;
     Controller.apply(this, arguments);
-    var input = document.createElement('input');
-    input.setAttribute('type', 'submit');
     this.domElement.addEventListener('click', function() {
     	_this.object[_this.propertyName].call(_this.object);
     }, false);
     this.domElement.style.cursor = "pointer";
-    this.domElement.appendChild(input);
+    this.propertyNameElement.style.cursor = "pointer";
 };
 FunctionController.prototype = new Controller();
 FunctionController.prototype.constructor = FunctionController;
\ No newline at end of file
diff --git a/demo.html b/demo.html
index 754082c..edd6b72 100644
--- a/demo.html
+++ b/demo.html
@@ -16,6 +16,7 @@ var controllableObject =
       constrainedNum: 0,
       textProperty: "a string",
       booleanProperty: false,
+      anotherBooleanProperty: false,
       functionProperty: function() {
          alert("I am a function!");
       }
@@ -39,6 +40,8 @@ window.onload = function() {
    
    // Creates a checkbox
    GUI.add(controllableObject, "booleanProperty");
+   // Creates a checkbox
+   GUI.add(controllableObject, "anotherBooleanProperty");
    
    // Creates a button
    GUI.add(controllableObject, "functionProperty");
diff --git a/gui.css b/gui.css
index c496792..95dd873 100644
--- a/gui.css
+++ b/gui.css
@@ -20,6 +20,7 @@
 #guidat-controllers { 
 	height: 300px;
 	overflow-y: auto;
+	overflow-x: hidden;
 	background-color: #eee;
 }
 
@@ -41,31 +42,50 @@
 	padding: 5px;
 	height: 23px;
 	clear: left;
-	border-bottom: 1px solid #444;
+	border-bottom: 1px solid #222;
 	background-color: #111;
 }
+
+.guidat-controller.boolean:hover,
+.guidat-controller.function:hover{
+	background-color: #000;
+}
 .guidat-controller input { 
-float: right;
-clear: both;
-border: 0;
-padding: 2px;
+	float: right;
+	outline: none;
+	clear: both;
+	border: 0;
+	padding: 2px;
 }
-
-
-.guidat-controller.number input[type=number] {
-	width: 55px;
-
+.guidat-controller.number { 
+	border-left: 5px solid #00aeff ;
 }
-
-
 .guidat-controller.string { 
-	border-left-color: #0af;
+	border-left: 5px solid #1ed36f;
+}
+.guidat-controller.string input { 
+	border: 0;
+	text-align: right;
+	color: #1ed36f;
+	
+	background-color: rgba(0,0,0,0);
+}
+.guidat-controller.boolean { 
+	border-left: 5px solid #54396e;
+}
+.guidat-controller.function { 
+	border-left: 5px solid #e61d5f;
+}
+.guidat-controller.number input[type=number] {
+	width: 45px;
 }
 
-.guidat-controller:nth-child(even) {
-	background-color: #1a1a1a;
+.guidat-controller.boolean input { 
+margin-top: 6px;
 }
 
+
+
 .guidat-controller:last-child {
 	
 	-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
@@ -75,5 +95,6 @@ padding: 2px;
 
 .guidat-propertyname { 
 	padding: 5px;
+	cursor: default;
 	display: inline-block;
 }
\ No newline at end of file