Arrelin/family_budget
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixes

Browse Source
This commit is contained in:
arrelin
2026-01-23 17:01:47 +03:00
parent b18f69ea62
commit 471da855bf
11 changed files with 194 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
frontend/src/pages/Profile.tsx
View File

@@ -20,13 +20,13 @@ import {
X,
} from 'lucide-react';
const THEMES: { id: Theme; name: string; gradient: string }[] = [
{ id: 'light', name: 'Light', gradient: 'bg-gradient-to-r from-gray-100 to-gray-200' },
{ id: 'dark', name: 'Dark', gradient: 'bg-gradient-to-r from-gray-800 to-gray-900' },
{ id: 'sunset', name: 'Sunset', gradient: 'bg-gradient-to-r from-orange-400 to-pink-500' },
{ id: 'ocean', name: 'Ocean', gradient: 'bg-gradient-to-r from-blue-400 to-cyan-500' },
{ id: 'forest', name: 'Forest', gradient: 'bg-gradient-to-r from-green-400 to-teal-500' },
{ id: 'purple', name: 'Purple', gradient: 'bg-gradient-to-r from-purple-500 to-pink-500' },
const THEMES: { id: Theme; gradient: string }[] = [
{ id: 'light', gradient: 'bg-gradient-to-r from-gray-100 to-gray-200' },
{ id: 'dark', gradient: 'bg-gradient-to-r from-black to-gray-900' },
{ id: 'sunset', gradient: 'bg-gradient-to-r from-orange-400 to-pink-500' },
{ id: 'ocean', gradient: 'bg-gradient-to-r from-blue-400 to-cyan-500' },
{ id: 'forest', gradient: 'bg-gradient-to-r from-green-400 to-teal-500' },
{ id: 'purple', gradient: 'bg-gradient-to-r from-purple-500 to-pink-500' },
];
export default function Profile() {
@@ -140,7 +140,7 @@ export default function Profile() {
<div className="space-y-6">
<div className="glass-effect rounded-2xl shadow-lg p-6">
<div className="flex items-center gap-3 mb-4">
<div className="p-2 bg-gradient-to-br from-blue-500 to-purple-500 text-white rounded-xl">
<div className="p-2 category-icon text-white rounded-xl">
<UserIcon className="w-6 h-6" />
</div>
<h2 className="text-xl font-bold text-gray-800">{t('profile.info')}</h2>
@@ -160,7 +160,7 @@ export default function Profile() {
{selectedFamily && (
<div className="glass-effect rounded-2xl shadow-lg p-6">
<div className="flex items-center gap-3 mb-4">
<div className="p-2 bg-gradient-to-br from-green-500 to-teal-500 text-white rounded-xl">
<div className="p-2 btn-success text-white rounded-xl">
<Users className="w-6 h-6" />
</div>
<h2 className="text-xl font-bold text-gray-800">{t('profile.family')}</h2>
@@ -220,7 +220,7 @@ export default function Profile() {
className={`flex items-center justify-between p-3 rounded-xl ${member.id === user?.id ? 'bg-purple-50 border border-purple-200' : 'bg-gray-50'}`}
>
<div className="flex items-center gap-2">
<div className="w-8 h-8 bg-gradient-to-br from-purple-400 to-blue-400 rounded-full flex items-center justify-center text-white text-sm font-medium">
<div className="w-8 h-8 category-icon rounded-full flex items-center justify-center text-white text-sm font-medium">
{(member.username || member.email || '?')[0].toUpperCase()}
</div>
<span className="font-medium text-gray-800">
@@ -247,7 +247,7 @@ export default function Profile() {
<div className="glass-effect rounded-2xl shadow-lg p-6">
<div className="flex items-center gap-3 mb-4">
<div className="p-2 bg-gradient-to-br from-purple-500 to-pink-500 text-white rounded-xl">
<div className="p-2 btn-primary text-white rounded-xl">
<Settings className="w-6 h-6" />
</div>
<h2 className="text-xl font-bold text-gray-800">{t('profile.settings')}</h2>
@@ -264,7 +264,7 @@ export default function Profile() {
onClick={() => handleLocaleChange('ru')}
className={`flex-1 py-3 px-4 rounded-xl font-medium transition-all ${
preferences.locale === 'ru'
? 'bg-purple-500 text-white shadow-lg'
? 'btn-primary text-white shadow-lg'
: 'bg-gray-100 text-gray-700 hover:bg-gray-200'
}`}
>
@@ -276,7 +276,7 @@ export default function Profile() {
onClick={() => handleLocaleChange('en')}
className={`flex-1 py-3 px-4 rounded-xl font-medium transition-all ${
preferences.locale === 'en'
? 'bg-purple-500 text-white shadow-lg'
? 'btn-primary text-white shadow-lg'
: 'bg-gray-100 text-gray-700 hover:bg-gray-200'
}`}
>
@@ -304,7 +304,7 @@ export default function Profile() {
}`}
>
<div className={`h-12 rounded-lg ${theme.gradient}`} />
<span className="text-xs text-gray-600 mt-1 block">{theme.name}</span>
<span className="text-xs text-gray-600 mt-1 block">{t(`profile.themes.${theme.id}`)}</span>
{preferences.theme === theme.id && (
<div className="absolute top-2 right-2 w-5 h-5 bg-white rounded-full flex items-center justify-center shadow">
<Check className="w-3 h-3 text-purple-600" />
@@ -320,7 +320,7 @@ export default function Profile() {
{selectedFamily && (
<div className="glass-effect rounded-2xl shadow-lg p-6 border-2 border-red-200">
<div className="flex items-center gap-3 mb-4">
<div className="p-2 bg-gradient-to-br from-red-500 to-orange-500 text-white rounded-xl">
<div className="p-2 btn-danger text-white rounded-xl">
<AlertTriangle className="w-6 h-6" />
</div>
<h2 className="text-xl font-bold text-gray-800">{t('profile.dangerZone')}</h2>
@@ -331,7 +331,7 @@ export default function Profile() {
<button
onClick={handleLeaveFamily}
disabled={leavingFamily}
className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-red-500 hover:bg-red-600 text-white rounded-xl transition-all font-semibold disabled:opacity-50"
className="w-full flex items-center justify-center gap-2 px-6 py-3 btn-danger text-white rounded-xl transition-all font-semibold disabled:opacity-50"
>
{leavingFamily ? (
<>