3 files changed, 123 insertions, 35 deletions

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.css b/js/components/tools-properties/text-properties.reel/text-properties.css
index 6aa61812..f7bb8295 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.css
+++ b/js/components/tools-properties/text-properties.reel/text-properties.css
@@ -12,6 +12,10 @@
     padding: 0px 8px;
 }
 
+.optionsTextTool select {
+    margin: 2px;
+}
+
 .optionsTextTool > *, .optionsTextTool .btnGroup > * {
     float:left;
 }
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 7ded1236..13a88ba7 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -100,7 +100,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "btnBold",
-                    "label": "B"
+                    "pressedLabel": "B",
+                    "unpressedLabel": "B"
                 },
                 "listeners": [
                     {
@@ -117,7 +118,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "btnItalic",
-                    "label": "I"
+                    "pressedLabel": "I",
+                    "unpressedLabel": "I"
                 },
                 "listeners": [
                     {
@@ -134,7 +136,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "btnUnderline",
-                    "label": "U"
+                    "pressedLabel": "U",
+                    "unpressedLabel": "U"
                 },
                 "listeners": [
                     {
@@ -151,7 +154,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "btnStrikethrough",
-                    "label": "S"
+                    "pressedLabel": "S",
+                    "unpressedLabel": "S"
                 },
                 "listeners": [
                     {
@@ -169,7 +173,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "alignLeft",
-                    "label": "Left"
+                    "pressedLabel": "Left",
+                    "unpressedLabel": "Left"
                 },
                 "listeners": [
                     {
@@ -186,7 +191,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "alignCenter",
-                    "label": "Center"
+                    "pressedLabel": "Center",
+                    "unpressedLabel": "Center"
                 },
                 "listeners": [
                     {
@@ -203,7 +209,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "alignRight",
-                    "label": "Right"
+                    "pressedLabel": "Right",
+                    "unpressedLabel": "Right"
                 },
                 "listeners": [
                     {
@@ -220,7 +227,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "alignJustify",
-                    "label": "Justify"
+                    "pressedLabel": "Justify",
+                    "unpressedLabel": "Justify"
                 },
                 "listeners": [
                     {
@@ -236,7 +244,7 @@
                     "element": {"#": "indent"},
                     "pressedClass": "active",
                     "preventFocus": true,
-                    "identifier": "outdent",
+                    "identifier": "indent",
                     "label": ">>"
                 },
                 "listeners": [
@@ -253,7 +261,7 @@
                     "element": {"#": "outdent"},
                     "pressedClass": "active",
                     "preventFocus": true,
-                    "identifier": "<<",
+                    "identifier": "outdent",
                     "label": "<<"
                 },
                 "listeners": [
@@ -271,7 +279,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "bulletedList",
-                    "label": "• • •"
+                    "pressedLabel": "• • •",
+                    "unpressedLabel": "• • •"
                 },
                 "listeners": [
                     {
@@ -288,7 +297,8 @@
                     "pressedClass": "active",
                     "preventFocus": true,
                     "identifier": "numberedList",
-                    "label": "1 2 3"
+                    "pressedLabel": "1 2 3",
+                    "unpressedLabel": "1 2 3"
                 },
                 "listeners": [
                     {
@@ -310,10 +320,10 @@
             <label class="label" style="display: none">Tag:</label>
             <select id="tagType" style="display: none"></select>
             <label class="label">Font:</label>
-            <select id="fontSelection" class="fontSelection"></select>
+            <select id="fontSelection" class="nj-skinned fontSelection"></select>
             <button id="fontSettings" style="display: none"></button>
             <label class="label">Size:</label>
-            <input id="fontSize"/>
+            <select id="fontSize" class="nj-skinned"></select>
             <div class="fontColor"></div>
             <div class="btnGroup">
                 <button id="btnBold" class="btnBold nj-skinned" style="font-weight:bold"></button>
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.js b/js/components/tools-properties/text-properties.reel/text-properties.js
index 55274322..88d38ffe 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.js
+++ b/js/components/tools-properties/text-properties.reel/text-properties.js
@@ -6,6 +6,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 
 var Montage = require("montage/core/core").Montage;
 var Component = require("montage/ui/component").Component;
+var ArrayController = require("montage/ui/controller/array-controller").ArrayController;
 var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
 
 exports.TextProperties = Montage.create(ToolProperties, {
@@ -29,18 +30,57 @@ exports.TextProperties = Montage.create(ToolProperties, {