样式优化。

ShadowEditor.Web/src/ui/property/ButtonProperty.jsx

@@ -18,7 +18,7 @@ class ButtonProperty extends React.Component {
         const { className, style, text } = this.props;
 
         return <Button
-            className={classNames('ButtonProperty', className)}
+            className={classNames('button', className)}
             style={style}
             onClick={this.handleChange}>{text}</Button>;
     }

ShadowEditor.Web/src/ui/property/ButtonsProperty.jsx

@@ -14,7 +14,7 @@ class ButtonsProperty extends React.Component {
     render() {
         const { className, style, children } = this.props;
 
-        return <div className={classNames('ButtonsProperty', className)} style={style}>{children}</div>;
+        return <div className={classNames('buttons', className)} style={style}>{children}</div>;
     }
 }
 

ShadowEditor.Web/src/ui/property/CheckBoxProperty.jsx

@@ -18,7 +18,7 @@ class CheckBoxProperty extends React.Component {
         const { className, style, name, value } = this.props;
 
         return <CheckBox
-            className={classNames('CheckBoxProperty', className)}
+            className={classNames('checkbox', className)}
             style={style}
             name={name}
             checked={value}

ShadowEditor.Web/src/ui/property/ColorProperty.jsx

@@ -19,7 +19,7 @@ class ColorProperty extends React.Component {
         const { className, style, name, value } = this.props;
 
         return <Input
-            className={classNames('ColorProperty', className)}
+            className={classNames('input', className)}
             style={style}
             name={name}
             type={'color'}

ShadowEditor.Web/src/ui/property/DisplayProperty.jsx

@@ -14,7 +14,7 @@ class DisplayProperty extends React.Component {
     render() {
         const { className, style, name, value } = this.props;
 
-        return <div className={classNames('DisplayProperty', className)} style={style}>{value}</div>;
+        return <div className={classNames('div', className)} style={style}>{value}</div>;
     }
 }
 

ShadowEditor.Web/src/ui/property/IntegerProperty.jsx

@@ -19,7 +19,7 @@ class IntegerProperty extends React.Component {
         const { className, style, name, value } = this.props;
 
         return <Input
-            className={classNames('IntegerProperty', className)}
+            className={classNames('input', className)}
             style={style}
             name={name}
             type={'number'}

ShadowEditor.Web/src/ui/property/NumberProperty.jsx

@@ -19,7 +19,7 @@ class NumberProperty extends React.Component {
         const { className, style, name, value } = this.props;
 
         return <Input
-            className={classNames('NumberProperty', className)}
+            className={classNames('input', className)}
             style={style}
             name={name}
             type={'number'}

ShadowEditor.Web/src/ui/property/PropertyGroup.jsx

@@ -28,7 +28,7 @@ class PropertyGroup extends React.Component {
                     if (n.props.show === false) {
                         return null;
                     }
-                    return <div className={'property'} key={i}>
+                    return <div className={classNames('property', n.type.name)} key={i}>
                         <div className={'label'}>{n.props.label}</div>
                         <div className={'field'}>{n}</div>
                     </div>;

ShadowEditor.Web/src/ui/property/SelectProperty.jsx

@@ -19,7 +19,7 @@ class SelectProperty extends React.Component {
         const { className, style, options, name, value, disabled } = this.props;
 
         return <Select
-            className={classNames('SelectProperty', className)}
+            className={classNames('select', className)}
             style={style}
             options={options}
             name={name}

ShadowEditor.Web/src/ui/property/TextProperty.jsx

@@ -19,7 +19,7 @@ class TextProperty extends React.Component {
         const { className, style, name, value } = this.props;
 
         return <Input
-            className={classNames('TextProperty', className)}
+            className={classNames('input', className)}
             style={style}
             name={name}
             value={value}

ShadowEditor.Web/src/ui/property/TextureProperty.jsx

@@ -22,7 +22,7 @@ class TextureProperty extends React.Component {
         const { className, style, fileName } = this.props;
 
         return <canvas
-            className={classNames('TextureProperty', className)}
+            className={classNames('canvas', className)}
             style={style}
             ref={this.canvasRef}
             onClick={this.handleSelect}></canvas>;

ShadowEditor.Web/src/ui/property/css/ButtonProperty.css

@@ -1,4 +1,4 @@
-.ButtonProperty {
+.ButtonProperty>.field>.button {
     height: auto;
     margin-left: 2px;
     padding: 2px 8px;

ShadowEditor.Web/src/ui/property/css/ButtonsProperty.css

@@ -1,9 +1,9 @@
-.ButtonsProperty {
+.ButtonsProperty>.field>.buttons {
     height: auto;
     margin-left: 4px;
 }
 
-.ButtonsProperty>.Button {
+.ButtonsProperty>.field>.buttons>.Button {
     height: 20px;
     font-size: 12px;
     line-height: 20px;

ShadowEditor.Web/src/ui/property/css/CheckBoxProperty.css

@@ -1,3 +1,3 @@
-.CheckBox.CheckBoxProperty {
+.CheckBoxProperty>.field>.checkbox {
     margin: 0 0 0 2px;
 }

ShadowEditor.Web/src/ui/property/css/ColorProperty.css

@@ -1,4 +1,4 @@
-.ColorProperty {
+.ColorProperty>.field>.input {
     width: 100%;
     height: 20px;
     margin: 0;

ShadowEditor.Web/src/ui/property/css/DisplayProperty.css

@@ -1,3 +1,3 @@
-.DisplayProperty {
+.DisplayProperty>.field>.div {
     padding: 0 4px;
 }

ShadowEditor.Web/src/ui/property/css/IntegerProperty.css

@@ -1,4 +1,4 @@
-.IntegerProperty {
+.IntegerProperty>.field>.input {
     width: 100%;
     border: none;
 }

ShadowEditor.Web/src/ui/property/css/NumberProperty.css

@@ -1,4 +1,4 @@
-.NumberProperty {
+.NumberProperty>.field>.input {
     width: 100%;
     border: none;
 }

ShadowEditor.Web/src/ui/property/css/SelectProperty.css

@@ -1,4 +1,4 @@
-.SelectProperty {
+.SelectProperty>.field>.select {
     width: 100%;
     border: none;
 }

ShadowEditor.Web/src/ui/property/css/TextProperty.css

@@ -1,4 +1,4 @@
-.TextProperty {
+.TextProperty>.field>.input {
     width: 100%;
     border: none;
 }

ShadowEditor.Web/src/ui/property/css/TextureProperty.css

@@ -1,4 +1,4 @@
-.TextureProperty {
+.TextureProperty>.field>.canvas {
     width: 100%;
     height: 20px;
 }