Changes to gui.css

This commit is contained in:
George Michael Brower 2011-01-23 17:50:14 -07:00
parent 506d5b597c
commit 2c03829a83
3 changed files with 40 additions and 6 deletions

View File

@ -1,9 +1,14 @@
var Controller = function() { var Controller = function(object, propertyName) {
this.domElement = document.createElement('div'); this.domElement = document.createElement('div');
this.domElement.setAttribute('class', 'guidat-controller'); this.domElement.setAttribute('class', 'guidat-controller');
this.object = arguments[0]; this.object = arguments[0];
this.propertyName = arguments[1]; this.propertyName = arguments[1];
this.propertyNameElement = document.createElement('span');
this.propertyNameElement.setAttribute('class', 'guidat-propertyname');
this.propertyNameElement.innerHTML = arguments[1];
this.domElement.appendChild(this.propertyNameElement);
}; };
var NumberController = function() { var NumberController = function() {

31
gui.css
View File

@ -7,16 +7,19 @@
top: 0; top: 0;
left: 100%; left: 100%;
margin-left: -270px; margin-left: -270px;
background-color: #fff;
-moz-transition: margin-top .2s ease-out; -moz-transition: margin-top .2s ease-out;
-webkit-transition: margin-top .2s ease-out; -webkit-transition: margin-top .2s ease-out;
transition: margin-top .2s ease-out; transition: margin-top .2s ease-out;
background-color: #fff;
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
} }
#guidat-controllers { #guidat-controllers {
height: 300px; height: 300px;
overflow-y: scroll; overflow-y: auto;
background-color: #eee;
} }
#guidat-toggle { #guidat-toggle {
@ -32,4 +35,28 @@
#guidat-toggle:hover { #guidat-toggle:hover {
background-color: #000; background-color: #000;
}
.guidat-controller {
padding: 5px;
border-bottom: 1px solid #ccc;
text-align: right;
background-color: #fff;
}
.guidat-controller:nth-child(even) {
background-color: #E1F9FF;
}
.guidat-controller:last-child {
border-bottom: 1px solid #ccc;
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
}
.guidat-propertyname {
float: left;
margin: 5px;
font-size: 11px;
} }

6
gui.js
View File

@ -57,8 +57,10 @@ var GUI = new function() {
var addHandlers = { var addHandlers = {
"number": function() { "number": function() {
var n = new NumberController(arguments);
return n; return new NumberController(arguments);
// return n.button;
}, },
"string": function() { "string": function() {