Some styling improvements

Author: andrerpena

demo/App.js

@@ -13,7 +13,7 @@ class App extends Component {
 
     render() {
         return (
-            <div className="container">
+            <div className="react-mde-demo container">
                 <ReactMde value={this.state.mdeValue} onChange={this.handleValueChange.bind(this)} />
             </div>
         );

demo/client.js

@@ -7,6 +7,7 @@ import App from './App';
 import '../node_modules/bootstrap/dist/css/bootstrap.css';
 import '../node_modules/font-awesome/css/font-awesome.css';
 import '../src/styles/react-mde.scss';
+import './styles/demo.scss';
 
 render(
     <App>

demo/styles/demo.scss

@@ -0,0 +1,3 @@
+.react-mde-demo {
+    margin-top: 50px;
+}

src/styles/react-mde.scss

@@ -28,6 +28,8 @@
     .mde-text {
         textarea {
             width: 100%;
+            min-height: $textarea-min-height;
+            padding: $textarea-padding;
         }
     }
 

src/styles/variables.scss

@@ -1 +1,3 @@
-$default-border-color:      rgba(0,0,0,.125) !default; // this defaults to the Bootstrap 4 default border color
+$default-border-color:      rgba(0,0,0,.125) !default; // this defaults to the Bootstrap 4 default border color
+$textarea-min-height:       200px;
+$textarea-padding:          8px;