|
|
@@ -1,6 +1,7 @@
|
|
|
import { render } from "preact";
|
|
|
import { useEffect, useRef, useState } from "preact/hooks";
|
|
|
import showdown, { Converter } from "showdown";
|
|
|
+import { asset } from "$fresh/runtime.ts";
|
|
|
import { debounce, DebouncedFunction } from "$async/debounce.ts";
|
|
|
import { hideLoading } from "utils/ui.ts";
|
|
|
|
|
|
@@ -110,6 +111,8 @@ export default function Editor(props: EditorProps) {
|
|
|
shadowRoot = document.createElement("div");
|
|
|
shadowRoot.id = "shadow-root";
|
|
|
shadow?.appendChild(shadowRoot);
|
|
|
+
|
|
|
+ renderStyleToShadow();
|
|
|
}
|
|
|
render(
|
|
|
<div dangerouslySetInnerHTML={{ __html: convertedContent }} />,
|
|
|
@@ -118,6 +121,14 @@ export default function Editor(props: EditorProps) {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
+ // Render markdown style to shadow root
|
|
|
+ const renderStyleToShadow = async () => {
|
|
|
+ const shadowStyle = document.createElement("style");
|
|
|
+ const resp = await fetch(asset("/markdown.css"));
|
|
|
+ shadowStyle.innerText = await resp.text();
|
|
|
+ shadow?.appendChild(shadowStyle);
|
|
|
+ };
|
|
|
+
|
|
|
// Event listener
|
|
|
const modeChangeListener = (e: CustomEvent) => {
|
|
|
if (
|
