Refactor budget card component

Moves the title above the card and updates the progress display.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-08 08:16:15 +00:00
parent 753865b875
commit f3edb2d0a3

View File

@@ -1,3 +1,4 @@
import React, { useState } from 'react';
import NavBar from '@/components/NavBar';
import BudgetCard from '@/components/BudgetCard';
@@ -82,7 +83,8 @@ const Index = () => {
</div>
</header>
{/* 예산 카드 - 탭 추가 */}
{/* 목표 진행 상황 - 제목을 카드 위로 이동 */}
<h2 className="text-lg font-semibold mb-3"> </h2>
<div className="neuro-card mb-6 overflow-hidden">
<Tabs defaultValue="daily" value={selectedTab} onValueChange={setSelectedTab} className="w-full">
<TabsList className="grid grid-cols-3 mb-4 bg-transparent">
@@ -100,8 +102,6 @@ const Index = () => {
<TabsContent value="daily" className="space-y-4 mt-0">
<div className="space-y-4">
<div>
<h3 className="text-sm font-medium text-gray-600 mb-1"> </h3>
<div className="flex items-center justify-between mb-2">
<p className="text-lg font-semibold">{formatCurrency(budgetData.daily.spentAmount)}</p>
<p className="text-sm text-gray-500">/ {formatCurrency(budgetData.daily.targetAmount)}</p>
@@ -135,8 +135,6 @@ const Index = () => {
<TabsContent value="weekly" className="space-y-4 mt-0">
<div className="space-y-4">
<div>
<h3 className="text-sm font-medium text-gray-600 mb-1"> </h3>
<div className="flex items-center justify-between mb-2">
<p className="text-lg font-semibold">{formatCurrency(budgetData.weekly.spentAmount)}</p>
<p className="text-sm text-gray-500">/ {formatCurrency(budgetData.weekly.targetAmount)}</p>
@@ -170,8 +168,6 @@ const Index = () => {
<TabsContent value="monthly" className="space-y-4 mt-0">
<div className="space-y-4">
<div>
<h3 className="text-sm font-medium text-gray-600 mb-1"> </h3>
<div className="flex items-center justify-between mb-2">
<p className="text-lg font-semibold">{formatCurrency(budgetData.monthly.spentAmount)}</p>
<p className="text-sm text-gray-500">/ {formatCurrency(budgetData.monthly.targetAmount)}</p>