From 58e588a6fd72d71886030b78a303acde5622e004 Mon Sep 17 00:00:00 2001
From: Jori Lallo <jtlallo@gmail.com>
Date: Wed, 18 May 2016 01:14:35 -0700
Subject: [PATCH] Improved responsive styles for the editor

---
 .../components/ClickablePadding/ClickablePadding.js    | 10 +++++-----
 .../components/ClickablePadding/ClickablePadding.scss  | 10 ++++++++++
 2 files changed, 15 insertions(+), 5 deletions(-)
 create mode 100644 src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.scss

diff --git a/src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.js b/src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.js
index aca457920..def635264 100644
--- a/src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.js
+++ b/src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.js
@@ -1,13 +1,13 @@
 import React from 'react';
 
-const styles = {
-  paddingTop: "100px",
-  cursor: "text",
-};
+import styles from './ClickablePadding.scss';
 
 const ClickablePadding = (props) => {
   return (
-    <div style={ styles } onClick={ props.onClick }>&nbsp;</div>
+    <div
+      className={ styles.container }
+      onClick={ props.onClick }
+    >&nbsp;</div>
   )
 };
 
diff --git a/src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.scss b/src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.scss
new file mode 100644
index 000000000..f4a03faea
--- /dev/null
+++ b/src/components/MarkdownEditor/components/ClickablePadding/ClickablePadding.scss
@@ -0,0 +1,10 @@
+.container {
+  padding-top: 100px;
+  cursor: text;
+}
+
+@media all and (max-width: 960px) {
+  .container {
+    padding-top: 50px;
+  }
+}