From dbb978e2786d43b35050f4cc46658c4b3922f6d9 Mon Sep 17 00:00:00 2001 From: Ryan Huffman Date: Thu, 15 Jan 2015 10:22:39 -0800 Subject: [PATCH] Update style and layout of entity properties window --- examples/html/entityProperties.html | 103 +++++++++++++--------------- examples/html/style.css | 70 ++++++++++++++----- 2 files changed, 98 insertions(+), 75 deletions(-) diff --git a/examples/html/entityProperties.html b/examples/html/entityProperties.html index 2df5524795..52b8001c9e 100644 --- a/examples/html/entityProperties.html +++ b/examples/html/entityProperties.html @@ -445,47 +445,38 @@ } - -
- -
+
-
+
- ID +
+
+
-
-
- Type -
-
- -
-
-
+
Locked
-
+
Visible
-
+
Position
-
X
-
Y
-
Z
+
X
+
Y
+
Z
@@ -493,7 +484,7 @@
-
+
Registration
X
@@ -502,7 +493,7 @@
-
+
Dimensions
X
@@ -512,7 +503,7 @@
- % + %
@@ -520,7 +511,7 @@
-
+
Rotation
Pitch
@@ -529,7 +520,7 @@
-
+
Linear Velocity
X
@@ -537,13 +528,13 @@
Z
-
+
Linear Damping
-
+
Angular Velocity
Pitch
@@ -551,14 +542,14 @@
Roll
-
+
Angular Damping
-
+
Gravity
X
@@ -567,35 +558,35 @@
-
+
Mass
-
+
Ignore For Collisions
-
+
Collisions Will Move
-
+
Lifetime
-
+
Script URL
@@ -603,7 +594,7 @@
-
+
Color
R
@@ -614,49 +605,49 @@ -
+
Model URL
-
+
Animation URL
-
+
Animation Playing
-
+
Animation FPS
-
+
Animation Frame
-
+
Animation Settings
-
+
Textures
-
+
Original Textures
@@ -664,19 +655,19 @@
-
+
Text
-
+
Line Height
-
+
Text Color
R
@@ -684,7 +675,7 @@
B
-
+
Background Color
R
@@ -693,13 +684,13 @@
-
+
Spot Light
-
+
Diffuse
R
@@ -707,7 +698,7 @@
B
-
+
Ambient
R
@@ -715,7 +706,7 @@
B
-
+
Specular
R
@@ -723,31 +714,31 @@
B
-
+
Constant Attenuation
-
+
Linear Attenuation
-
+
Quadratic Attenuation
-
+
Exponent
-
+
Cutoff (degrees)
diff --git a/examples/html/style.css b/examples/html/style.css index 20baaca915..5023bb4609 100644 --- a/examples/html/style.css +++ b/examples/html/style.css @@ -6,8 +6,8 @@ body { padding: 0; background-color: #efefef; - font-family: Sans-Serif; - font-size: 12px; + font-family: Arial; + font-size: 11.5px; -webkit-touch-callout: none; -webkit-user-select: none; @@ -17,6 +17,12 @@ body { user-select: none; } +body.properties { + background-color: rgb(76, 76, 76); + color: rgb(204, 204, 204); + font-size: 11px; +} + .selectable { -webkit-touch-callout: text; -webkit-user-select: text; @@ -85,12 +91,10 @@ input[type=button] { border: 0; color: #fff; font-weight: bold; - margin: 0 2px; - margin-top: 5px; - font-size: .9em; } textarea, input { + margin: 0; padding: 2px; border: 1px solid #999; background-color: #eee; @@ -105,10 +109,15 @@ input.url { width: 100%; } +input.coord { + width: 7em; + display: block; +} + table#entity-table { border-collapse: collapse; font-family: Sans-Serif; - font-size: 12px; + /* font-size: 12px; */ width: 100%; } @@ -145,11 +154,42 @@ th#entity-url { div.input-area { display: inline-block; + font-size: 10px; } input { } +#type { + font-size: 14px; +} + +#type label { + color: rgb(150, 150, 150); +} + +#properties-list input, #properties-list textarea { + background-color: rgb(102, 102, 102); + color: rgb(204, 204, 204); + border: none; + font-size: 10px; +} + +#properties-list input[type=button] { + cursor: pointer; + background-color: rgb(51, 102, 102); + border-color: #608e96; + border-radius: 5px; + padding: 5px 10px; + border: 0; + color: rgb(204, 204, 204); +} + +#properties-list .property { + padding: 8px 8px; + border-top: 1px solid rgb(63, 63, 63); + min-height: 1em; +} table#properties-list { @@ -158,10 +198,13 @@ table#properties-list { width: 100%; background-color: #efefef; font-family: Arial; - font-size: 12px; table-layout: fixed; } +#properties-list > div { + margin: 4px 0; +} + #properties-list { border-bottom: 1px solid #e5e5e5; } @@ -174,21 +217,10 @@ table#properties-list { vertical-align: middle; height: 1.2em; - background-color: #ccc; - border-bottom: 1px solid #e5e5e5; -} - -#properties-list .value { - min-height: 1em; } #properties-list .value > div{ - padding: 4px; -} - -#properties-list > div > div{ - padding: 3px; - border-bottom: 1px solid black; + padding: 4px 0; } col#col-label {