chris/streamarr
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

lovely. got a couple of partial implementations....

Browse source 
update git ignore

kaas

remove large file

syncy sync
This commit is contained in:
Chris Kruining 2025-04-03 17:27:35 +02:00 • committed by Chris Kruining
parent 89f526e9d9
commit 98cd4d630c
Signed by: chris
SSH key fingerprint: SHA256:nG82MUfuVdRVyCKKWqhY+pCrbz9nbX6uzUns4RKa1Pg
24 changed files with 586 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

90
src/features/theme/picker.tsx
View file

@ -1,43 +1,69 @@
import { WiMoonAltFirstQuarter, WiMoonAltFull, WiMoonAltNew } from "solid-icons/wi";
import { Component, createEffect, For, Match, on, Setter, Switch } from "solid-js";
import {
WiMoonAltFirstQuarter,
WiMoonAltFull,
WiMoonAltNew,
} from "solid-icons/wi";
import {
Component,
createEffect,
For,
Match,
on,
Setter,
Switch,
} from "solid-js";
import { ColorScheme, useTheme } from "./context";
import css from './picker.module.css';
import css from "./picker.module.css";
import { Select } from "~/components/select";
const colorSchemes: Record<ColorScheme, keyof typeof ColorScheme> = Object.fromEntries(Object.entries(ColorScheme).map(([k, v]) => [v, k])) as any;
const colorSchemes: Record<ColorScheme, keyof typeof ColorScheme> =
Object.fromEntries(
Object.entries(ColorScheme).map(([k, v]) => [v, k]),
) as any;
export const ColorSchemePicker: Component = (props) => {
const themeContext = useTheme();
const themeContext = useTheme();
const setScheme: Setter<ColorScheme> = (next) => {
const setScheme: Setter<ColorScheme> = (next) => {
if (typeof next === "function") {
next = next();
}
if (typeof next === 'function') {
next = next();
}
themeContext.setColorScheme(next);
};
themeContext.setColorScheme(next);
};
return (
<>
<label aria-label="Color scheme picker">
<Select
id="color-scheme-picker"
class={css.picker}
value={themeContext.theme.colorScheme}
setValue={setScheme}
values={colorSchemes}
>
{(k, v) => (
<>
<Switch>
<Match when={k === ColorScheme.Auto}>
<WiMoonAltFirstQuarter />
</Match>
<Match when={k === ColorScheme.Light}>
<WiMoonAltNew />
</Match>
<Match when={k === ColorScheme.Dark}>
<WiMoonAltFull />
</Match>
</Switch>
{v}
</>
)}
</Select>
</label>
createEffect(on(() => themeContext.theme.colorScheme, (colorScheme) => {
console.log(colorScheme);
}));
return <>
<label aria-label="Color scheme picker">
<Select id="color-scheme-picker" class={css.picker} value={themeContext.theme.colorScheme} setValue={setScheme} values={colorSchemes}>{
(k, v) => <>
<Switch>
<Match when={k === ColorScheme.Auto}><WiMoonAltFirstQuarter /></Match>
<Match when={k === ColorScheme.Light}><WiMoonAltNew /></Match>
<Match when={k === ColorScheme.Dark}><WiMoonAltFull /></Match>
</Switch>
{v}
</>
}</Select>
</label>
{/* <label class={css.hue} aria-label="Hue slider">
{/* <label class={css.hue} aria-label="Hue slider">
<input type="range" min="0" max="360" value={theme.hue} onInput={e => setHue(e.target.valueAsNumber)} />
</label> */}
</>;
};
</>
);
};