admin/shimmer-finance-ai-companion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor: Global Theme System and Finance Modules Redesign

Browse Source
This commit is contained in:
CycroftX
2026-02-16 00:09:52 +05:30
parent 58fe801eab
commit 557accf0c2
51 changed files with 3076 additions and 1147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/components/features/Profile.tsx
View File

@@ -5,6 +5,7 @@ import { Switch } from '@/components/ui/switch';
import { Label } from '@/components/ui/label';
import { Separator } from '@/components/ui/separator';
import { Badge } from '@/components/ui/badge';
import { useTheme } from '@/context/ThemeContext';
import {
User,
ShieldCheck,
@@ -15,10 +16,12 @@ import {
Trash2,
LogOut,
CheckCircle,
Building
Building,
Sparkles
} from 'lucide-react';
export const Profile = () => {
const { theme, setTheme } = useTheme();
const [isShariaEnabled, setIsShariaEnabled] = useState(false);
const [notifications, setNotifications] = useState(true);
const [currency, setCurrency] = useState('AED');
@@ -137,6 +140,40 @@ export const Profile = () => {
</div>
</GlassCard>
{/* Appearance & Themes */}
<GlassCard className="p-6 space-y-6">
<div className="flex items-center gap-3 mb-4">
<div className="p-2 bg-pink-100 rounded-lg text-pink-600">
<Sparkles className="w-5 h-5" />
</div>
<h3 className="text-lg font-semibold">Appearance</h3>
</div>
<div className="grid grid-cols-2 gap-3">
{['default', 'dubai', 'minimal', 'nature'].map((themeName) => (
<button
key={themeName}
onClick={() => setTheme(themeName as any)}
className={`relative h-20 rounded-xl overflow-hidden border-2 transition-all ${theme === themeName ? 'border-blue-600 shadow-md scale-[1.02]' : 'border-transparent hover:scale-[1.02]'}`}
>
{themeName === 'default' && <div className="absolute inset-0 bg-gradient-to-br from-purple-100 to-blue-100" />}
{themeName === 'dubai' && <img src="https://images.unsplash.com/photo-1512453979798-5ea9ba6a80f4?q=80&w=300&auto=format&fit=crop" className="absolute inset-0 w-full h-full object-cover" />}
{themeName === 'minimal' && <img src="https://images.unsplash.com/photo-1550684848-fac1c5b4e853?q=80&w=300&auto=format&fit=crop" className="absolute inset-0 w-full h-full object-cover" />}
{themeName === 'nature' && <img src="https://images.unsplash.com/photo-1470071459604-3b5ec3a7fe05?q=80&w=300&auto=format&fit=crop" className="absolute inset-0 w-full h-full object-cover" />}
<div className="absolute inset-0 bg-black/20 flex items-center justify-center">
<span className="text-white font-medium text-xs capitalized drop-shadow-md capitalize">{themeName}</span>
</div>
{theme === themeName && (
<div className="absolute top-1 right-1 bg-blue-600 rounded-full p-0.5">
<CheckCircle className="w-3 h-3 text-white" />
</div>
)}
</button>
))}
</div>
</GlassCard>
{/* Data Privacy (UAE PDPL) */}
<GlassCard className="p-6 space-y-6 border-red-100/50">
<div className="flex items-center gap-3 mb-4">