LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-22 12:21:13 +00:00
Code Issues Projects Releases Wiki Activity

Hide WYSIWYG buttons when previewing markdown (#2366)

Browse source 
Co-authored-by: SleeplessOne1917 <insomnia-void@protonmail.com>
This commit is contained in:
SleeplessOne1917 2024-02-16 22:57:07 +00:00 committed by GitHub
parent 77cd46b35b
commit 40ade7df88
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 67 additions and 63 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

130
src/shared/components/common/markdown-textarea.tsx
View file

@ -156,72 +156,76 @@ export class MarkdownTextArea extends Component<
<div className="mb-3 row"> <div className="mb-3 row">
<div className="col-12"> <div className="col-12">
<div className="rounded bg-light border"> <div className="rounded bg-light border">
<div {!this.state.previewMode && (
className={classNames("d-flex flex-wrap border-bottom", { <div
"no-click": this.isDisabled, className={classNames("d-flex flex-wrap border-bottom", {
})} "no-click": this.isDisabled,
>
{this.getFormatButton("bold", this.handleInsertBold)}
{this.getFormatButton("italic", this.handleInsertItalic)}
{this.getFormatButton("link", this.handleInsertLink)}
<EmojiPicker onEmojiClick={this.handleEmoji}></EmojiPicker>
<label
htmlFor={`file-upload-${this.id}`}
className={classNames("mb-0", {
pointer: UserService.Instance.myUserInfo,
})} })}
data-tippy-content={I18NextService.i18n.t("upload_image")}
> >
{this.state.imageUploadStatus ? ( {this.getFormatButton("bold", this.handleInsertBold)}
<Spinner /> {this.getFormatButton("italic", this.handleInsertItalic)}
) : ( {this.getFormatButton("link", this.handleInsertLink)}
<button <EmojiPicker onEmojiClick={this.handleEmoji}></EmojiPicker>
type="button" <label
className="btn btn-sm btn-link rounded-0 text-muted mb-0" htmlFor={`file-upload-${this.id}`}
onClick={() => { className={classNames("mb-0", {
document pointer: UserService.Instance.myUserInfo,
.getElementById(`file-upload-${this.id}`) })}
?.click(); data-tippy-content={I18NextService.i18n.t("upload_image")}
}} >
> {this.state.imageUploadStatus ? (
<Icon icon="image" classes="icon-inline" /> <Spinner />
</button> ) : (
<button
type="button"
className="btn btn-sm btn-link rounded-0 text-muted mb-0"
onClick={() => {
document
.getElementById(`file-upload-${this.id}`)
?.click();
}}
>
<Icon icon="image" classes="icon-inline" />
</button>
)}
</label>
<input
id={`file-upload-${this.id}`}
type="file"
accept="image/*,video/*"
name="file"
className="d-none"
multiple
disabled={!UserService.Instance.myUserInfo}
onChange={linkEvent(this, this.handleImageUpload)}
/>
{this.getFormatButton("header", this.handleInsertHeader)}
{this.getFormatButton(
"strikethrough",
this.handleInsertStrikethrough,
)} )}
</label> {this.getFormatButton("quote", this.handleInsertQuote)}
<input {this.getFormatButton("list", this.handleInsertList)}
id={`file-upload-${this.id}`} {this.getFormatButton("code", this.handleInsertCode)}
type="file" {this.getFormatButton(
accept="image/*,video/*" "subscript",
name="file" this.handleInsertSubscript,
className="d-none" )}
multiple {this.getFormatButton(
disabled={!UserService.Instance.myUserInfo} "superscript",
onChange={linkEvent(this, this.handleImageUpload)} this.handleInsertSuperscript,
/> )}
{this.getFormatButton("header", this.handleInsertHeader)} {this.getFormatButton("spoiler", this.handleInsertSpoiler)}
{this.getFormatButton( <a
"strikethrough", href={markdownHelpUrl}
this.handleInsertStrikethrough, className="btn btn-sm btn-link rounded-0 text-muted fw-bold"
)} title={I18NextService.i18n.t("formatting_help")}
{this.getFormatButton("quote", this.handleInsertQuote)} rel={relTags}
{this.getFormatButton("list", this.handleInsertList)} >
{this.getFormatButton("code", this.handleInsertCode)} <Icon icon="help-circle" classes="icon-inline" />
{this.getFormatButton("subscript", this.handleInsertSubscript)} </a>
{this.getFormatButton( </div>
"superscript", )}
this.handleInsertSuperscript,
)}
{this.getFormatButton("spoiler", this.handleInsertSpoiler)}
<a
href={markdownHelpUrl}
className="btn btn-sm btn-link rounded-0 text-muted fw-bold"
title={I18NextService.i18n.t("formatting_help")}
rel={relTags}
>
<Icon icon="help-circle" classes="icon-inline" />
</a>
</div>
<div> <div>
<textarea <textarea
id={this.id} id={this.id}