CSS fixes, refactor
This commit is contained in:
parent
9096973dc6
commit
75e0d1b3d5
|
|
@ -12,7 +12,7 @@ const fixedHeightEditor = EditorView.theme({
|
|||
minWidth: "8em",
|
||||
flex: "none",
|
||||
},
|
||||
".cm-scroller": { overflow: "auto" },
|
||||
".cm-scroller": { overflow: "auto scroll" },
|
||||
});
|
||||
|
||||
export class Editor {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,35 @@
|
|||
import van from "vanjs-core";
|
||||
import * as vanX from "vanjs-ext";
|
||||
const v = van.tags;
|
||||
|
||||
import { Editor } from "./editor";
|
||||
import * as u from "./utils";
|
||||
|
||||
const EditorWrapper = (editor: any, del: any, k: any) =>
|
||||
v.div(
|
||||
{ class: "flex flex-col" },
|
||||
v.div(
|
||||
{ class: "flex" },
|
||||
v.span({ class: "mx-1 flex-1" }, "Editor " + k),
|
||||
u.InlineButton(del, "Close", "❌"),
|
||||
),
|
||||
v.div({ class: "flex-auto h-4" }, editor.val.dom),
|
||||
);
|
||||
|
||||
const editors = vanX.reactive([]);
|
||||
|
||||
export function addEditor() {
|
||||
editors.push(vanX.noreactive(new Editor()));
|
||||
}
|
||||
|
||||
export const EditorGrid = v.main({
|
||||
class: "flex flex-auto gap-4 overflow-x-auto",
|
||||
});
|
||||
vanX.list(EditorGrid, editors, EditorWrapper);
|
||||
|
||||
// const grid = v.main({
|
||||
// class: "flex flex-auto gap-4 overflow-x-auto",
|
||||
// });
|
||||
// export const EditorGrid = vanX.list(grid, editors, EditorWrapper);
|
||||
// vanX.list(document.getElementById("editorGrid"), editors, EditorWrapper);
|
||||
// van.add(document.getElementById("editorGrid"), EditorGrid);
|
||||
|
|
@ -7,30 +7,11 @@ const v = van.tags;
|
|||
|
||||
import { Editor } from "./editor";
|
||||
import { FolderTreeView } from "./foldernav";
|
||||
import { EditorGrid, addEditor } from "./editorgrid";
|
||||
import * as u from "./utils";
|
||||
|
||||
const EditorWrapper = (editor: any, del: any, k: any) =>
|
||||
v.div(
|
||||
{ class: "flex flex-col" },
|
||||
v.div(
|
||||
{ class: "flex" },
|
||||
v.span({ class: "mx-1 flex-1" }, "Editor " + k),
|
||||
u.InlineButton(del, "Close", "❌"),
|
||||
),
|
||||
v.div({ class: "h-full" }, editor.val.dom),
|
||||
);
|
||||
|
||||
// Create and mount editor list
|
||||
const editors = vanX.reactive([]);
|
||||
vanX.list(document.getElementById("editorGrid"), editors, EditorWrapper);
|
||||
|
||||
function addView() {
|
||||
editors.push(vanX.noreactive(new Editor()));
|
||||
}
|
||||
|
||||
document.getElementById("addEditor")?.addEventListener("click", addView);
|
||||
|
||||
addView();
|
||||
|
||||
// Mount the folder tree view to the nav
|
||||
van.add(document.querySelector("aside nav"), FolderTreeView);
|
||||
van.add(document.getElementById("editorGrid"), EditorGrid);
|
||||
|
||||
document.getElementById("addEditor")?.addEventListener("click", addEditor);
|
||||
addEditor();
|
||||
|
|
|
|||
Loading…
Reference in New Issue