added icons for save,load,delete

4 files changed, 22 insertions, 4 deletions

diff --git a/README.md b/README.md
index a9a4e97..e9f3ee9 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,2 @@
 # mdrtl
-A markdown editor with rtl support.<br/>
+A bare-bones rtl markdown editor.<br/>
diff --git a/spring-front/src/App.js b/spring-front/src/App.js
index e965d51..a91418e 100644
--- a/spring-front/src/App.js
+++ b/spring-front/src/App.js
@@ -10,6 +10,9 @@ export default class App extends React.Component {
     return (
       <div>
         <Editor />
+        <img className="icon" src="save.png" width="20" height="20" />
+        <img className="icon" src="load.jpg" width="20" height="20" />
+        <img className="icon" src="delete.png" width="20" height="20" />
       </div>
     );
   }
diff --git a/spring-front/src/components/Editor.js b/spring-front/src/components/Editor.js
index 3f8fefb..eee31a9 100644
--- a/spring-front/src/components/Editor.js
+++ b/spring-front/src/components/Editor.js
@@ -26,7 +26,7 @@ const md = new mit({ html: true })
   .use(mittexmath, {
     engine: katex,
     delimiters: "gitlab",
-    katexOptions: { macros: { "\\RR": "\\mathbb{R}" }, output: "mathml" },
+    katexOptions: { output: "mathml" },
   })
   .use(mitmmdtable)
   .use(mithljs, { inline: true, auto: true, code: true, hljs: hljs });
@@ -41,7 +41,8 @@ export default class Editor extends React.Component {
       this.updateCodeSyntaxHighlighting.bind(this);
     this.handleChange = this.handleChange.bind(this);
     this.parseMarkdown = this.parseMarkdown.bind(this);
-    this.state = { value: "" };
+    this.handleTitleClick = this.handleTitleClick.bind(this);
+    this.state = { value: "", drawerActive: false };
     // this.hljs_worker = new Worker("../highlight_worker.js");
     // this.md_worker = new Worker("../parse_worker.js");
   }
@@ -112,7 +113,13 @@ export default class Editor extends React.Component {
     }
   }
 
+  handleTitleClick() {
+    this.setState((prevState) => ({ drawerActive: !prevState.drawerActive }));
+  }
+
   render() {
+    const { markdownText, drawerTitle, drawerChildren } = this.props;
+    const drawerStyles = this.state.drawerActive ? "is-expanded" : "";
     return (
       <div>
         <div>
@@ -134,7 +141,10 @@ export default class Editor extends React.Component {
             onScroll={this.handleScroll.bind(this)}
             onKeyDown={this.handleKeyDown.bind(this)}
             direction="rtl"
-          ></textarea>
+            tabIndex="0"
+          >
+            {markdownText}
+          </textarea>
         </div>
         <div className="split right">
           <div direction="rtl" id="markdown-placeholder"></div>
diff --git a/spring-front/src/index.css b/spring-front/src/index.css
index 942cb96..159a28e 100644
--- a/spring-front/src/index.css
+++ b/spring-front/src/index.css
@@ -100,3 +100,8 @@ code {
   white-space: pre-wrap;
   overflow-y: auto;
 }
+
+.icon {
+  z-index: 2;
+  position: relative;
+}