chris/calque
1
0
Fork 0
Code Issues 13 Pull requests Projects Releases Packages Wiki Activity Actions

some restructuring and added a color-scheme-picker

Browse source
This commit is contained in:
Chris Kruining 2024-10-28 14:15:41 +01:00
parent c02fb2d924
commit fa9264326b
No known key found for this signature in database
GPG key ID: EB894A3560CCCAD2
11 changed files with 137 additions and 103 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/routes/(editor).tsx
View file

@ -1,17 +1,17 @@
import { Title } from "@solidjs/meta";
import { createSignal, ParentProps, Show } from "solid-js";
import { Meta, Title } from "@solidjs/meta";
import { createSignal, For, ParentProps, Show } from "solid-js";
import { BsTranslate } from "solid-icons/bs";
import { FilesProvider } from "~/features/file";
import { CommandPalette, CommandPaletteApi, MenuProvider, asMenuRoot } from "~/features/menu";
import { CommandPalette, CommandPaletteApi, Menu, MenuProvider } from "~/features/menu";
import { isServer } from "solid-js/web";
import { A } from "@solidjs/router";
import { createCommand, Modifier } from "~/features/command";
import { ColorScheme, ColorSchemePicker } from "~/components/colorschemepicker";
import css from "./editor.module.css";
asMenuRoot // prevents removal of import
export default function Editor(props: ParentProps) {
const [commandPalette, setCommandPalette] = createSignal<CommandPaletteApi>();
const [colorScheme, setColorScheme] = createSignal<ColorScheme>(ColorScheme.Auto);
const supported = isServer || typeof window.showDirectoryPicker === 'function';
const commands = [
@ -22,10 +22,17 @@ export default function Editor(props: ParentProps) {
return <MenuProvider commands={commands}>
<Title>Translation-Tool</Title>
<Meta name="color-scheme" content={colorScheme()} />
<main class={css.layout} inert={commandPalette()?.open()}>
<nav use:asMenuRoot>
<A class="logo" href="/"><BsTranslate /></A>
<nav class={css.menu}>
<A class={css.logo} href="/"><BsTranslate /></A>
<Menu.Mount />
<section class={css.right}>
<ColorSchemePicker value={[colorScheme, setColorScheme]} />
</section>
</nav>
<Show when={supported} fallback={<span>too bad, so sad. Your browser does not support the File Access API</span>}>