diff --git a/website/components/EditArticleFunction.js b/website/components/EditArticleFunction.js index e8306e6..66829f6 100644 --- a/website/components/EditArticleFunction.js +++ b/website/components/EditArticleFunction.js @@ -1,10 +1,10 @@ import { useState } from 'react'; -import 'suneditor/dist/css/suneditor.min.css'; import dynamic from 'next/dynamic'; -import htmlParser from 'html-react-parser'; import { complex } from '../utils/sunEditorConfig'; import api from '../utils/api'; +import FunctionArticle from '../components/FunctionArticle'; import 'notyf/notyf.min.css'; // for React and Vue +import 'suneditor/dist/css/suneditor.min.css'; const SunEditor = dynamic( () => import('suneditor-react'), @@ -36,9 +36,7 @@ const EditArticleFunction = (props) => { return (
-
- {htmlParser(htmlContent)} -
+
); } diff --git a/website/components/FunctionArticle.js b/website/components/FunctionArticle.js new file mode 100644 index 0000000..236c68b --- /dev/null +++ b/website/components/FunctionArticle.js @@ -0,0 +1,11 @@ +import htmlParser from 'html-react-parser'; + +const FunctionArticle = ({ article }) => { + return ( +
+ {(article != undefined) && htmlParser(article)} +
+ ); +} + +export default FunctionArticle; \ No newline at end of file diff --git a/website/components/FunctionTabManager.js b/website/components/FunctionTabManager.js index 7c62edf..25dc621 100644 --- a/website/components/FunctionTabManager.js +++ b/website/components/FunctionTabManager.js @@ -1,16 +1,8 @@ -import htmlParser from 'html-react-parser'; import FunctionTabs from './FunctionTabs/FunctionTabs'; import FunctionForm from './FunctionForm'; +import FunctionArticle from './FunctionArticle'; import FunctionComments from './FunctionComments/FunctionComments'; -const Article = ({ article }) => { - return ( -
- {(article != undefined) && htmlParser(article)} -
- ); -} - const FunctionTabManager = (props) => { if (props.type === "form") { return ( @@ -19,7 +11,7 @@ const FunctionTabManager = (props) => {
-
+
@@ -31,7 +23,7 @@ const FunctionTabManager = (props) => { return (
-
+
diff --git a/website/package-lock.json b/website/package-lock.json index 31c7d50..d0910cf 100644 --- a/website/package-lock.json +++ b/website/package-lock.json @@ -9548,12 +9548,12 @@ "integrity": "sha512-KLmKMq1QrBT9GT+/yv0d/a6YGEQ5+QUSmzZYJaIXGJ8QNNRV0BqfQP0gBnWY8s35HFKiU5meXWuzrI03AmubRg==" }, "suneditor-react": { - "version": "2.9.1", - "resolved": "https://registry.npmjs.org/suneditor-react/-/suneditor-react-2.9.1.tgz", - "integrity": "sha512-O26aLQ4dRWbdJv+d78pPaL/mLwWgVMiz64uo531+kHjBlNlREpV2dvvIYVH7TNxKi6LboeDZybJ5rm8kPMchAQ==", + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/suneditor-react/-/suneditor-react-2.8.0.tgz", + "integrity": "sha512-yUBY9ETs8z+FD8G60GZgiCr602qXidoAbK00IC7n2v5epkEYZSOCgJMmSaLI3aYT7uLYlajozccNHKbrd+rXKQ==", "requires": { "prop-types": "^15.7.2", - "suneditor": "^2.28.4" + "suneditor": "^2.27.1" } }, "supports-color": { diff --git a/website/package.json b/website/package.json index cf167f1..19f5ddd 100644 --- a/website/package.json +++ b/website/package.json @@ -25,7 +25,7 @@ "react-dom": "16.13.0", "react-swipeable-views": "^0.13.9", "react-swipeable-views-utils": "^0.13.9", - "suneditor-react": "^2.9.1", + "suneditor-react": "^2.8.0", "universal-cookie": "^4.0.3" }, "devDependencies": { diff --git a/website/public/css/pages/FunctionComponent.css b/website/public/css/pages/FunctionComponent.css index 189f291..aeb5235 100644 --- a/website/public/css/pages/FunctionComponent.css +++ b/website/public/css/pages/FunctionComponent.css @@ -31,4 +31,10 @@ top: 15px; margin-right: 15px; cursor: pointer; +} +.vscode-editor { + padding: 15px; + border-radius: 10px; + overflow: auto; + white-space: normal !important; } \ No newline at end of file