From 2c201bd1b340937a096e5f3baf05dff22d7abc14 Mon Sep 17 00:00:00 2001 From: ShadowDara <128976697+ShadowDara@users.noreply.github.com> Date: Mon, 22 Jun 2026 22:28:32 +0200 Subject: [PATCH 1/2] better editor --- web/app/(site)/webtools/html/page.tsx | 70 ++++++++++++++++++----- web/bun.lock | 18 ++++++ web/package-lock.json | 82 +++++++++++++++++++++++++++ web/package.json | 2 + 4 files changed, 159 insertions(+), 13 deletions(-) diff --git a/web/app/(site)/webtools/html/page.tsx b/web/app/(site)/webtools/html/page.tsx index a2bb3ab..1d9f8b4 100644 --- a/web/app/(site)/webtools/html/page.tsx +++ b/web/app/(site)/webtools/html/page.tsx @@ -1,6 +1,14 @@ "use client"; -import { useState } from "react"; +import { useEffect, useState } from "react"; + +import Prism from "prismjs"; +import "prismjs/themes/prism-tomorrow.css"; +import "prismjs/components/prism-markup"; +import "prismjs/components/prism-css"; +import "prismjs/components/prism-javascript"; + +import Editor from "@monaco-editor/react"; export default function HtmlPreviewPage() { const [html, setHtml] = useState(` @@ -8,34 +16,70 @@ export default function HtmlPreviewPage() { Preview -

Hello World

HTML hier einfügen...

`); + const [previewOnly, setPreviewOnly] = useState(false); + + useEffect(() => { + const handleKeyDown = (e: KeyboardEvent) => { + if (e.key === "F9") { + e.preventDefault(); + setPreviewOnly((v) => !v); + } + }; + + window.addEventListener("keydown", handleKeyDown); + return () => window.removeEventListener("keydown", handleKeyDown); + }, []); + + if (previewOnly) { + return ( +