gabehf/Koito
1
0
Fork 0
mirror of https://github.com/gabehf/Koito.git synced 2026-03-10 07:50:37 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add server-side configuration with default theme (#90)

Browse source 
* docs: add example for usage of the main listenbrainz instance (#71)

* docs: add example for usage of the main listenbrainz instance

* Update scrobbler.md

---------

Co-authored-by: Gabe Farrell <90876006+gabehf@users.noreply.github.com>

* feat: add server-side cfg and default theme

* fix: repair custom theme

---------

Co-authored-by: m0d3rnX <jesper@posteo.de>
This commit is contained in:
Gabe Farrell 2025-11-18 18:37:05 -05:00 • committed by GitHub
parent 70f5198781
commit 1aeb6408aa
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 86 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

14
client/app/components/themeSwitcher/ThemeSwitcher.tsx
View file

@ -1,12 +1,11 @@
// ThemeSwitcher.tsx
import { useEffect, useState } from 'react';
import { useState } from 'react';
import { useTheme } from '../../hooks/useTheme';
import themes from '~/styles/themes.css';
import ThemeOption from './ThemeOption';
import { AsyncButton } from '../AsyncButton';
export function ThemeSwitcher() {
const { theme, themeName, setTheme } = useTheme();
const { setTheme } = useTheme();
const initialTheme = {
bg: "#1e1816",
bgSecondary: "#2f2623",
@ -24,7 +23,7 @@ export function ThemeSwitcher() {
info: "#87b8dd",
}
const { setCustomTheme, getCustomTheme } = useTheme()
const { setCustomTheme, getCustomTheme, resetTheme } = useTheme()
const [custom, setCustom] = useState(JSON.stringify(getCustomTheme() ?? initialTheme, null, " "))
const handleCustomTheme = () => {
@ -42,7 +41,12 @@ export function ThemeSwitcher() {
return (
<div className='flex flex-col gap-10'>
<div>
<h2>Select Theme</h2>
<div className='flex items-center gap-3'>
<h2>Select Theme</h2>
<div className='mb-3'>
<AsyncButton onClick={resetTheme}>Reset</AsyncButton>
</div>
</div>
<div className="grid grid-cols-2 items-center gap-2">
{Object.entries(themes).map(([name, themeData]) => (
<ThemeOption setTheme={setTheme} key={name} theme={themeData} themeName={name} />