fix: wrap language buttons in settings to prevent overflow

This commit is contained in:
Maurice
2026-03-29 01:05:40 +01:00
parent ecf7433980
commit 1d57eacfa4
+4 -4
View File
@@ -265,7 +265,7 @@ export default function SettingsPage(): React.ReactElement {
{/* Sprache */} {/* Sprache */}
<div> <div>
<label className="block text-sm font-medium mb-2" style={{ color: 'var(--text-secondary)' }}>{t('settings.language')}</label> <label className="block text-sm font-medium mb-2" style={{ color: 'var(--text-secondary)' }}>{t('settings.language')}</label>
<div className="flex gap-3"> <div className="flex flex-wrap gap-2">
{[ {[
{ value: 'de', label: 'Deutsch' }, { value: 'de', label: 'Deutsch' },
{ value: 'en', label: 'English' }, { value: 'en', label: 'English' },
@@ -282,9 +282,9 @@ export default function SettingsPage(): React.ReactElement {
catch (e: unknown) { toast.error(e instanceof Error ? e.message : 'Error') } catch (e: unknown) { toast.error(e instanceof Error ? e.message : 'Error') }
}} }}
style={{ style={{
display: 'flex', alignItems: 'center', gap: 8, display: 'flex', alignItems: 'center', gap: 6,
padding: '10px 20px', borderRadius: 10, cursor: 'pointer', padding: '8px 14px', borderRadius: 10, cursor: 'pointer',
fontFamily: 'inherit', fontSize: 14, fontWeight: 500, fontFamily: 'inherit', fontSize: 13, fontWeight: 500,
border: settings.language === opt.value ? '2px solid var(--text-primary)' : '2px solid var(--border-primary)', border: settings.language === opt.value ? '2px solid var(--text-primary)' : '2px solid var(--border-primary)',
background: settings.language === opt.value ? 'var(--bg-hover)' : 'var(--bg-card)', background: settings.language === opt.value ? 'var(--bg-hover)' : 'var(--bg-card)',
color: 'var(--text-primary)', color: 'var(--text-primary)',