refactor: markdown input css

This commit is contained in:
Tristan Yang
2023-04-12 07:41:57 +08:00
parent 5d7b90b5ec
commit 390e2e5ac9
3 changed files with 17 additions and 5 deletions
+10 -1
View File
@@ -282,8 +282,17 @@ html.dark ::-webkit-scrollbar-thumb {
font-size: 14px; font-size: 14px;
line-height: 20px; line-height: 20px;
} }
.toastui-editor-md-preview {
overflow-x: hidden;
}
.toastui-editor-dark .toastui-editor-md-container { .toastui-editor-dark .toastui-editor-md-container {
background-color: #4e5762 !important; background-color: transparent !important;
}
.toastui-editor-md-container.toastui-editor-md-vertical-style {
align-items: flex-start;
}
html.dark .send.markdown {
background-color: #222 !important;
} }
html.dark .slate-mention { html.dark .slate-mention {
background: #333; background: #333;
@@ -1,7 +1,7 @@
import { useRef, useEffect, FC } from "react"; import { useRef, useEffect, FC } from "react";
import "@toast-ui/editor/dist/toastui-editor.css";
import { Editor } from "@toast-ui/react-editor"; import { Editor } from "@toast-ui/react-editor";
import "prismjs/themes/prism.css"; import "prismjs/themes/prism.css";
import "@toast-ui/editor/dist/toastui-editor.css";
import '@toast-ui/editor/dist/theme/toastui-editor-dark.css'; import '@toast-ui/editor/dist/theme/toastui-editor-dark.css';
import "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight.css"; import "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight.css";
import codeSyntaxHighlight from "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight-all.js"; import codeSyntaxHighlight from "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight-all.js";
+6 -3
View File
@@ -1,10 +1,13 @@
import { useRef, FC } from "react"; import { useRef, FC } from "react";
import "prismjs/themes/prism.css"; import "prismjs/themes/prism.css";
import '@toast-ui/editor/dist/theme/toastui-editor-dark.css'; import { Viewer } from "@toast-ui/react-editor";
import codeSyntaxHighlight from "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight-all.js";
import '@toast-ui/editor/dist/toastui-editor-viewer.css';
// import '@toast-ui/editor/dist/theme/toastui-editor-dark.css';
// import '@toast-ui/editor/dist/toastui-editor.css';
// import '@toast-ui/editor/dist/theme/toastui-editor-dark.css';
import "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight.css"; import "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight.css";
//@ts-ignore //@ts-ignore
import codeSyntaxHighlight from "@toast-ui/editor-plugin-code-syntax-highlight/dist/toastui-editor-plugin-code-syntax-highlight-all.js";
import { Viewer } from "@toast-ui/react-editor";
import { isDarkMode } from "../utils"; import { isDarkMode } from "../utils";
import ImagePreview from "./ImagePreview"; import ImagePreview from "./ImagePreview";