ZELLYY/zellyy-finance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add icons to summary cards

Browse Source 
Added icons to the budget, expense, and savings items in the summary cards.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-15 04:25:08 +00:00
parent 0aec4bdb3d
commit a62d2aff25
1 changed files with 13 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/pages/Analytics.tsx
View File

@@ -4,7 +4,7 @@ import NavBar from '@/components/NavBar';
import ExpenseChart from '@/components/ExpenseChart';
import AddTransactionButton from '@/components/AddTransactionButton';
import { BarChart, Bar, XAxis, YAxis, Tooltip, ResponsiveContainer, Legend } from 'recharts';
import { ChevronLeft, ChevronRight } from 'lucide-react';
import { ChevronLeft, ChevronRight, Wallet, CreditCard, PiggyBank } from 'lucide-react';
const Analytics = () => {
const [selectedPeriod, setSelectedPeriod] = useState('이번 달');
@@ -98,7 +98,10 @@ const Analytics = () => {
{/* Summary Cards */}
<div className="grid grid-cols-3 gap-3 mb-8">
<div className="neuro-card">
<p className="text-xs text-gray-500 mb-1">예산</p>
<div className="flex items-center gap-2 mb-1">
<Wallet size={16} className="text-gray-500" />
<p className="text-xs text-gray-500">예산</p>
</div>
<p className="text-sm font-bold text-neuro-income">
{new Intl.NumberFormat('ko-KR', {
style: 'currency',
@@ -109,7 +112,10 @@ const Analytics = () => {
</p>
</div>
<div className="neuro-card">
<p className="text-xs text-gray-500 mb-1">지출</p>
<div className="flex items-center gap-2 mb-1">
<CreditCard size={16} className="text-gray-500" />
<p className="text-xs text-gray-500">지출</p>
</div>
<p className="text-sm font-bold text-neuro-income">
{new Intl.NumberFormat('ko-KR', {
style: 'currency',
@@ -120,7 +126,10 @@ const Analytics = () => {
</p>
</div>
<div className="neuro-card">
<p className="text-xs text-gray-500 mb-1">저축</p>
<div className="flex items-center gap-2 mb-1">
<PiggyBank size={16} className="text-gray-500" />
<p className="text-xs text-gray-500">저축</p>
</div>
<p className="text-sm font-bold text-neuro-income">
{savingsPercentage}%
</p>