pdsls.dev
1import { createSignal } from "solid-js";
2import { TextInput } from "../components/text-input.jsx";
3import { ThemeSelection } from "../components/theme.jsx";
4
5export const [hideMedia, setHideMedia] = createSignal(localStorage.hideMedia === "true");
6
7const Settings = () => {
8 return (
9 <div class="flex w-full flex-col gap-3 px-2">
10 <div class="flex items-center gap-1 font-semibold">
11 <span>Settings</span>
12 </div>
13 <div class="flex flex-col gap-3">
14 <div class="flex flex-col gap-0.5">
15 <label for="plcDirectory" class="select-none">
16 PLC Directory
17 </label>
18 <TextInput
19 id="plcDirectory"
20 value={localStorage.plcDirectory || "https://plc.directory"}
21 onInput={(e) => {
22 e.currentTarget.value.length ?
23 (localStorage.plcDirectory = e.currentTarget.value)
24 : localStorage.removeItem("plcDirectory");
25 }}
26 />
27 </div>
28 <ThemeSelection />
29 <div class="flex justify-between">
30 <div class="flex items-center gap-1">
31 <input
32 id="disableMedia"
33 type="checkbox"
34 checked={localStorage.hideMedia === "true"}
35 onChange={(e) => {
36 localStorage.hideMedia = e.currentTarget.checked;
37 setHideMedia(e.currentTarget.checked);
38 }}
39 />
40 <label for="disableMedia" class="select-none">
41 Hide media embeds
42 </label>
43 </div>
44 </div>
45 </div>
46 </div>
47 );
48};
49
50export { Settings };