chore: clean up repo for public release

- Remove BMAD framework, IDE configs, dev screenshots, test files, internal docs, and backup files - Rename keep-notes/ to memento-note/ - Update all references from keep-notes to memento-note - Add Apache 2.0 license with Commons Clause (non-commercial restriction) - Add clean .gitignore and .env.docker.example
2026-04-20 22:48:06 +02:00
parent 402e88b788
commit e4d4e23dc7
3981 changed files with 407 additions and 530622 deletions
--- a/memento-note/app/(main)/settings/appearance/appearance-form.tsx
+++ b/memento-note/app/(main)/settings/appearance/appearance-form.tsx
@@ -0,0 +1,132 @@
+'use client'
+
+import { useRouter } from 'next/navigation'
+import { useState } from 'react'
+import { SettingsSection, SettingSelect } from '@/components/settings'
+import { updateAISettings as updateAI } from '@/app/actions/ai-settings'
+import { updateUserSettings as updateUser } from '@/app/actions/user-settings'
+import { useLanguage } from '@/lib/i18n'
+
+interface AppearanceSettingsFormProps {
+    initialTheme: string
+    initialFontSize: string
+    initialCardSizeMode?: string
+}
+
+export function AppearanceSettingsForm({ initialTheme, initialFontSize, initialCardSizeMode = 'variable' }: AppearanceSettingsFormProps) {
+    const router = useRouter()
+    const [theme, setTheme] = useState(initialTheme)
+    const [fontSize, setFontSize] = useState(initialFontSize)
+    const [cardSizeMode, setCardSizeMode] = useState(initialCardSizeMode)
+    const { t } = useLanguage()
+
+    const handleThemeChange = async (value: string) => {
+        setTheme(value)
+        localStorage.setItem('theme-preference', value)
+
+        // Instant visual update
+        const root = document.documentElement
+        root.removeAttribute('data-theme')
+        root.classList.remove('dark')
+
+        if (value === 'auto') {
+            if (window.matchMedia('(prefers-color-scheme: dark)').matches) root.classList.add('dark')
+        } else if (value === 'dark') {
+            root.classList.add('dark')
+        } else if (value === 'light') {
+            root.setAttribute('data-theme', 'light')
+        } else {
+            root.setAttribute('data-theme', value)
+            if (['midnight', 'blue', 'sepia'].includes(value)) root.classList.add('dark')
+        }
+
+        // Save to DB (no need for router.refresh - localStorage handles immediate visuals)
+        await updateUser({ theme: value as 'light' | 'dark' | 'auto' | 'sepia' | 'midnight' | 'blue' })
+    }
+
+    const handleFontSizeChange = async (value: string) => {
+        setFontSize(value)
+
+        // Instant visual update
+        const fontSizeMap: Record<string, string> = {
+            'small': '14px', 'medium': '16px', 'large': '18px', 'extra-large': '20px'
+        }
+        const root = document.documentElement
+        root.style.setProperty('--user-font-size', fontSizeMap[value] || '16px')
+
+        await updateAI({ fontSize: value as any })
+    }
+
+    const handleCardSizeModeChange = async (value: string) => {
+        setCardSizeMode(value)
+        localStorage.setItem('card-size-mode', value)
+        await updateUser({ cardSizeMode: value as 'variable' | 'uniform' })
+    }
+
+    return (
+        <div className="space-y-6">
+            <div>
+                <h1 className="text-3xl font-bold mb-2">{t('appearance.title')}</h1>
+                <p className="text-gray-600 dark:text-gray-400">
+                    {t('appearance.description')}
+                </p>
+            </div>
+
+            <SettingsSection
+                title={t('settings.theme')}
+                icon={<span className="text-2xl">🎨</span>}
+                description={t('settings.themeLight') + ' / ' + t('settings.themeDark')}
+            >
+                <SettingSelect
+                    label={t('settings.theme')}
+                    description={t('settings.selectLanguage')}
+                    value={theme}
+                    options={[
+                        { value: 'slate', label: t('settings.themeLight') },
+                        { value: 'dark', label: t('settings.themeDark') },
+                        { value: 'sepia', label: 'Sepia' },
+                        { value: 'midnight', label: 'Midnight' },
+                        { value: 'blue', label: 'Blue' },
+                        { value: 'auto', label: t('settings.themeSystem') },
+                    ]}
+                    onChange={handleThemeChange}
+                />
+            </SettingsSection>
+
+            <SettingsSection
+                title={t('profile.fontSize')}
+                icon={<span className="text-2xl">📝</span>}
+                description={t('profile.fontSizeDescription')}
+            >
+                <SettingSelect
+                    label={t('profile.fontSize')}
+                    description={t('profile.selectFontSize')}
+                    value={fontSize}
+                    options={[
+                        { value: 'small', label: t('profile.fontSizeSmall') },
+                        { value: 'medium', label: t('profile.fontSizeMedium') },
+                        { value: 'large', label: t('profile.fontSizeLarge') },
+                    ]}
+                    onChange={handleFontSizeChange}
+                />
+            </SettingsSection>
+
+            <SettingsSection
+                title={t('settings.cardSizeMode')}
+                icon={<span className="text-2xl">📐</span>}
+                description={t('settings.cardSizeModeDescription')}
+            >
+                <SettingSelect
+                    label={t('settings.cardSizeMode')}
+                    description={t('settings.selectCardSizeMode')}
+                    value={cardSizeMode}
+                    options={[
+                        { value: 'variable', label: t('settings.cardSizeVariable') },
+                        { value: 'uniform', label: t('settings.cardSizeUniform') },
+                    ]}
+                    onChange={handleCardSizeModeChange}
+                />
+            </SettingsSection>
+        </div>
+    )
+}