Address problems found in in-person review

IPython/html/static/widgets/js/widget.js

@@ -445,7 +445,7 @@ define(["widgets/js/manager",
                 this.update_attr('font-weight', value); }, this);
 
             this.model.on('change:font_size', function (model, value) { 
-                this.update_attr('font-size', value); }, this);
+                this.update_attr('font-size', this._default_px(value)); }, this);
 
             this.model.on('change:font_family', function (model, value) { 
                 this.update_attr('font-family', value); }, this);
@@ -454,7 +454,10 @@ define(["widgets/js/manager",
                 this.update_attr('padding', value); }, this);
 
             this.model.on('change:margin', function (model, value) { 
-                this.update_attr('margin', value); }, this);
+                this.update_attr('margin', this._default_px(value)); }, this);
+
+            this.model.on('change:border_radius', function (model, value) { 
+                this.update_attr('border-radius', this._default_px(value)); }, this);
 
             this.after_displayed(function() {
                 this.update_visible(this.model, this.model.get("visible"));
@@ -474,9 +477,18 @@ define(["widgets/js/manager",
                 this.update_attr('font-family', this.model.get('font_family'));
                 this.update_attr('padding', this.model.get('padding'));
                 this.update_attr('margin', this.model.get('margin'));
+                this.update_attr('border-radius', this.model.get('border_radius'));
             }, this);
         },
 
+        _default_px: function(value) {
+            // Makes browser interpret a numerical string as a pixel value.
+            if (/^\d+\.?(\d+)?$/.test(value.trim())) {
+                return value.trim() + 'px';
+            }
+            return value;
+        },
+
         update_attr: function(name, value) {
             // Set a css attr of the widget view.
             this.$el.css(name, value);

IPython/html/static/widgets/js/widget_box.js

@@ -179,8 +179,8 @@ define([
                     that.popped_out = !that.popped_out;
                     if (!that.popped_out) {
                         that.$minimize
-                            .removeClass('fa fa-arrow-down')
-                            .addClass('fa fa-arrow-up');
+                            .removeClass('fa-arrow-down')
+                            .addClass('fa-arrow-up');
                             
                         that.$window
                             .draggable('destroy')
@@ -193,8 +193,8 @@ define([
                         that.$close.hide();
                     } else {
                         that.$minimize
-                            .addClass('fa fa-arrow-down')
-                            .removeClass('fa fa-arrow-up');
+                            .addClass('fa-arrow-down')
+                            .removeClass('fa-arrow-up');
 
                         that.$window
                             .removeClass('docked-widget-modal')

IPython/html/widgets/widget.py

@@ -393,6 +393,7 @@ class DOMWidget(Widget):
     border_color = Unicode(sync=True)
 
     border_width = CUnicode(sync=True)
+    border_radius = CUnicode(sync=True)
     border_style = CaselessStrEnum(values=[ # http://www.w3schools.com/cssref/pr_border-style.asp
         'none', 
         'hidden', 
@@ -425,3 +426,14 @@ class DOMWidget(Widget):
         default_value='', sync=True)
     font_size = CUnicode(sync=True)
     font_family = Unicode(sync=True)
+
+    def __init__(self, *pargs, **kwargs):
+        super(DOMWidget, self).__init__(*pargs, **kwargs)
+
+        def _validate_border(name, old, new):
+            if new is not None and new != '':
+                if name != 'border_width' and not self.border_width:
+                    self.border_width = 1
+                if name != 'border_style' and self.border_style == '':
+                    self.border_style = 'solid'
+        self.on_trait_change(_validate_border, ['border_width', 'border_style', 'border_color'])

IPython/html/widgets/widget_float.py

@@ -170,6 +170,7 @@ class FloatRangeSlider(_BoundedFloatRange):
         help="Vertical or horizontal.", sync=True)
     _range = Bool(True, help="Display a range selector", sync=True)
     readout = Bool(True, help="Display the current value of the slider next to it.", sync=True)
+    slider_color = Unicode(sync=True)
 
 # Remove in IPython 4.0
 FloatTextWidget = DeprecatedClass(FloatText, 'FloatTextWidget')

IPython/html/widgets/widget_int.py

@@ -174,6 +174,7 @@ class IntRangeSlider(_BoundedIntRange):
         help="Vertical or horizontal.", sync=True)
     _range = Bool(True, help="Display a range selector", sync=True)
     readout = Bool(True, help="Display the current value of the slider next to it.", sync=True)
+    slider_color = Unicode(sync=True)
 
 # Remove in IPython 4.0
 IntTextWidget = DeprecatedClass(IntText, 'IntTextWidget')