]> Untitled Git - lemmy.git/blobdiff - ui/src/components/markdown-textarea.tsx
routes.api: fix get_captcha endpoint (#1135)
[lemmy.git] / ui / src / components / markdown-textarea.tsx
index 9e4dbf844cf7b50f3282b72564b00802dbe35158..0a7f904aac32d2ac666eb002fabc29b734ce3f5a 100644 (file)
@@ -21,9 +21,11 @@ interface MarkdownTextAreaProps {
   replyType?: boolean;
   focus?: boolean;
   disabled?: boolean;
+  maxLength?: number;
   onSubmit?(msg: { val: string; formId: string }): any;
   onContentChange?(val: string): any;
   onReplyCancel?(): any;
+  hideNavigationWarnings?: boolean;
 }
 
 interface MarkdownTextAreaState {
@@ -77,7 +79,7 @@ export class MarkdownTextArea extends Component<
   }
 
   componentDidUpdate() {
-    if (this.state.content) {
+    if (!this.props.hideNavigationWarnings && this.state.content) {
       window.onbeforeunload = () => true;
     } else {
       window.onbeforeunload = undefined;
@@ -109,7 +111,10 @@ export class MarkdownTextArea extends Component<
   render() {
     return (
       <form id={this.formId} onSubmit={linkEvent(this, this.handleSubmit)}>
-        <Prompt when={this.state.content} message={i18n.t('block_leaving')} />
+        <Prompt
+          when={!this.props.hideNavigationWarnings && this.state.content}
+          message={i18n.t('block_leaving')}
+        />
         <div class="form-group row">
           <div className={`col-sm-12`}>
             <textarea
@@ -121,11 +126,11 @@ export class MarkdownTextArea extends Component<
               required
               disabled={this.props.disabled}
               rows={2}
-              maxLength={10000}
+              maxLength={this.props.maxLength || 10000}
             />
             {this.state.previewMode && (
               <div
-                className="card card-body md-div"
+                className="card bg-transparent border-secondary card-body md-div"
                 dangerouslySetInnerHTML={mdToHtml(this.state.content)}
               />
             )}
@@ -267,6 +272,24 @@ export class MarkdownTextArea extends Component<
                 <use xlinkHref="#icon-code"></use>
               </svg>
             </button>
+            <button
+              class="btn btn-sm text-muted"
+              data-tippy-content={i18n.t('subscript')}
+              onClick={linkEvent(this, this.handleInsertSubscript)}
+            >
+              <svg class="icon icon-inline">
+                <use xlinkHref="#icon-subscript"></use>
+              </svg>
+            </button>
+            <button
+              class="btn btn-sm text-muted"
+              data-tippy-content={i18n.t('superscript')}
+              onClick={linkEvent(this, this.handleInsertSuperscript)}
+            >
+              <svg class="icon icon-inline">
+                <use xlinkHref="#icon-superscript"></use>
+              </svg>
+            </button>
             <button
               class="btn btn-sm text-muted"
               data-tippy-content={i18n.t('spoiler')}
@@ -470,6 +493,16 @@ export class MarkdownTextArea extends Component<
     i.simpleInsert('#');
   }
 
+  handleInsertSubscript(i: MarkdownTextArea, event: any) {
+    event.preventDefault();
+    i.simpleSurround('~');
+  }
+
+  handleInsertSuperscript(i: MarkdownTextArea, event: any) {
+    event.preventDefault();
+    i.simpleSurround('^');
+  }
+
   simpleInsert(chars: string) {
     if (!this.state.content) {
       this.state.content = `${chars} `;