add css in mdedfitor
This commit is contained in:
@@ -8,6 +8,20 @@ import axios from "../../axios";
|
|||||||
import "highlight.js/styles/github-dark.css";
|
import "highlight.js/styles/github-dark.css";
|
||||||
import Header from "../mission/statement/Header";
|
import Header from "../mission/statement/Header";
|
||||||
|
|
||||||
|
import { defaultSchema } from "hast-util-sanitize";
|
||||||
|
|
||||||
|
const schema = {
|
||||||
|
...defaultSchema,
|
||||||
|
attributes: {
|
||||||
|
...defaultSchema.attributes,
|
||||||
|
div: [
|
||||||
|
...(defaultSchema.attributes?.div || []),
|
||||||
|
["style"] // разрешаем атрибут style на div
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
interface MarkdownEditorProps {
|
interface MarkdownEditorProps {
|
||||||
defaultValue?: string;
|
defaultValue?: string;
|
||||||
onChange: (value: string) => void;
|
onChange: (value: string) => void;
|
||||||
@@ -125,6 +139,17 @@ print(greet("Мир"))
|
|||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
или
|
||||||
|
|
||||||
|
<img src=\"https://upload.wikimedia.org/wikipedia/commons/4/48/Markdown-mark.svg\" alt=\"img\"/>
|
||||||
|
|
||||||
|
или если нужно выравнивание по центру
|
||||||
|
|
||||||
|
<div style=\"display: flex; items-align: center; justify-content: center; background: gray;\">
|
||||||
|
<img src=\"https://upload.wikimedia.org/wikipedia/commons/4/48/Markdown-mark.svg\" alt=\"img\"/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🧠 8. Цитаты и вложенность
|
## 🧠 8. Цитаты и вложенность
|
||||||
@@ -227,7 +252,7 @@ print(greet("Мир"))
|
|||||||
const cursorPos = (e.target as HTMLTextAreaElement).selectionStart;
|
const cursorPos = (e.target as HTMLTextAreaElement).selectionStart;
|
||||||
const newText =
|
const newText =
|
||||||
markdown.slice(0, cursorPos) +
|
markdown.slice(0, cursorPos) +
|
||||||
`` +
|
`<img src=\"${imageUrl}\" alt=\"img\"/>` +
|
||||||
markdown.slice(cursorPos);
|
markdown.slice(cursorPos);
|
||||||
|
|
||||||
setMarkdown(newText);
|
setMarkdown(newText);
|
||||||
@@ -253,7 +278,7 @@ print(greet("Мир"))
|
|||||||
<div className="prose prose-invert max-w-none h-full overflow-auto pr-4 medium-scrollbar">
|
<div className="prose prose-invert max-w-none h-full overflow-auto pr-4 medium-scrollbar">
|
||||||
<ReactMarkdown
|
<ReactMarkdown
|
||||||
remarkPlugins={[remarkGfm]}
|
remarkPlugins={[remarkGfm]}
|
||||||
rehypePlugins={[rehypeRaw, rehypeSanitize, rehypeHighlight]}
|
rehypePlugins={[rehypeRaw, [rehypeSanitize, schema], rehypeHighlight]}
|
||||||
>
|
>
|
||||||
{markdown}
|
{markdown}
|
||||||
</ReactMarkdown>
|
</ReactMarkdown>
|
||||||
|
|||||||
Reference in New Issue
Block a user