|
@@ -36,13 +36,15 @@ const datas = [
|
|
|
|
|
|
export const EditorsPage = (
|
|
export const EditorsPage = (
|
|
data = { type: "", name: "", text: "", index: "", theme: "", font: "" },
|
|
data = { type: "", name: "", text: "", index: "", theme: "", font: "" },
|
|
- onSave,
|
|
|
|
- onChange
|
|
|
|
|
|
+ onSave
|
|
|
|
+ // onChange
|
|
) => {
|
|
) => {
|
|
const [editors, setEditors] = useState(datas);
|
|
const [editors, setEditors] = useState(datas);
|
|
const [title, setTitle] = useState("");
|
|
const [title, setTitle] = useState("");
|
|
const [description, setDescription] = useState("");
|
|
const [description, setDescription] = useState("");
|
|
const [srcDoc, setSrcDoc] = useState("");
|
|
const [srcDoc, setSrcDoc] = useState("");
|
|
|
|
+ const [theme, setTheme] = useState();
|
|
|
|
+ const [font, setFont] = useState();
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
const timeout = setTimeout(() => {
|
|
const timeout = setTimeout(() => {
|
|
@@ -64,18 +66,14 @@ export const EditorsPage = (
|
|
return () => clearTimeout(timeout);
|
|
return () => clearTimeout(timeout);
|
|
}, [editors]);
|
|
}, [editors]);
|
|
|
|
|
|
- const changeTheme = (theme) => onChange({ theme });
|
|
|
|
-
|
|
|
|
- const changeFont = (font) => onChange({ font });
|
|
|
|
-
|
|
|
|
return (
|
|
return (
|
|
<>
|
|
<>
|
|
<div className="styles">
|
|
<div className="styles">
|
|
{"Theme: "}
|
|
{"Theme: "}
|
|
- <SelectTheme onChange={() => changeTheme} value={data.theme} />
|
|
|
|
|
|
+ <SelectTheme onChange={setTheme} value={theme} />
|
|
<br />
|
|
<br />
|
|
{"FontSize: "}
|
|
{"FontSize: "}
|
|
- <SelectFontSize onChange={() => changeFont} value={data.font} />
|
|
|
|
|
|
+ <SelectFontSize onChange={setFont} value={font} />
|
|
<br />
|
|
<br />
|
|
</div>
|
|
</div>
|
|
{editors.map((data, index) => {
|
|
{editors.map((data, index) => {
|
|
@@ -83,8 +81,8 @@ export const EditorsPage = (
|
|
<Editor
|
|
<Editor
|
|
data={data}
|
|
data={data}
|
|
key={index}
|
|
key={index}
|
|
- theme='monokai'
|
|
|
|
- font={16}
|
|
|
|
|
|
+ theme={theme}
|
|
|
|
+ font={font}
|
|
onChange={(newData) => {
|
|
onChange={(newData) => {
|
|
let editor = [...editors];
|
|
let editor = [...editors];
|
|
editor.splice(index, 1, newData);
|
|
editor.splice(index, 1, newData);
|