Placeholders, css

src/RichTextEditor.js

@@ -14,6 +14,8 @@ export default class RichTextEditor extends Component {
   static propTypes = {
     initialTitleHTML: PropTypes.string,
     initialContentHTML: PropTypes.string,
+    titlePlaceholder: PropTypes.string,
+    contentPlaceholder: PropTypes.string,
     editorInitializedCallback: PropTypes.func,
     customCSS: PropTypes.string
   };
@@ -62,6 +64,8 @@ export default class RichTextEditor extends Component {
           if (this.props.customCSS) {
             this.setCustomCSS(this.props.customCSS);
           }
+          this.setTitlePlaceholder(this.props.titlePlaceholder);
+          this.setContentPlaceholder(this.props.contentPlaceholder);
           this.setTitleHTML(this.props.initialTitleHTML);
           this.setContentHTML(this.props.initialContentHTML);
           this.props.editorInitializedCallback && this.props.editorInitializedCallback();
@@ -344,12 +348,12 @@ export default class RichTextEditor extends Component {
     this._sendAction(actions.setTextColor, color);
   }
 
-  setTitlePlaceholder() {
-    this._sendAction(actions.setTitlePlaceholder);
+  setTitlePlaceholder(placeholder) {
+    this._sendAction(actions.setTitlePlaceholder, placeholder);
   }
 
-  setContentPlaceholder() {
-    this._sendAction(actions.setContentPlaceholder);
+  setContentPlaceholder(placeholder) {
+    this._sendAction(actions.setContentPlaceholder, placeholder);
   }
 
   setCustomCSS(css) {

src/WebviewMessageHandler.js

@@ -95,10 +95,10 @@ export const InjectedMessageHandler = `
           zss_editor.setOutdent();
           break;
         case '${actions.setTitlePlaceholder}':
-          zss_editor.setTitlePlaceholder();
+          zss_editor.setTitlePlaceholder(action.data);
           break;
         case '${actions.setContentPlaceholder}':
-          zss_editor.setContentPlaceholder();
+          zss_editor.setContentPlaceholder(action.data);
           break;
         case '${actions.getTitleHtml}':
           var html = zss_editor.getTitleHTML();

src/ZSSRichTextEditor/ZSSRichTextEditor.js

@@ -384,7 +384,7 @@ zss_editor.setTextColor = function(color) {
 }
 
 zss_editor.setBackgroundColor = function(color) {
-    
+
     if(zss_editor.currentSelection) {
         zss_editor.restorerange();
     }

src/ZSSRichTextEditor/style.css

@@ -55,11 +55,12 @@ div.zss_editor_title {
 
 [placeholder]:empty:before {
     content: attr(placeholder);
-    color: #555;
+    color: #c0c0c0;
 }
 
 [placeholder]:empty:focus:before {
-    content: "";
+    content: attr(placeholder);
+    color: #e0e0e0;
 }
 
 hr {