Visual edit in Lovable

Edited UI in Lovable

src/pages/Analytics.tsx

@@ -14,13 +14,13 @@ import SummaryCards from '@/components/analytics/SummaryCards';
 import MonthlyComparisonChart from '@/components/analytics/MonthlyComparisonChart';
 import CategorySpendingList from '@/components/analytics/CategorySpendingList';
 import PaymentMethodChart from '@/components/analytics/PaymentMethodChart';
-
 const Analytics = () => {
   const [selectedPeriod, setSelectedPeriod] = useState('이번 달');
   const {
     budgetData,
     getCategorySpending,
-    getPaymentMethodStats,  // 새로 추가된 메서드
+    getPaymentMethodStats,
+    // 새로 추가된 메서드
     transactions
   } = useBudget();
   const isMobile = useIsMobile();
@@ -143,22 +143,16 @@ const Analytics = () => {
         </div>
         
         {/* Category Pie Chart - 왼쪽 여백 조정 */}
-        <h2 className="text-lg font-semibold mb-3">카테고리별 지출</h2>
+        <h2 className="text-lg font-semibold mb-3">카테고리 비율</h2>
         <div className="w-full mb-8">
-          {expenseData.some(item => item.value > 0) ? 
-            <ExpenseChart data={expenseData} /> : 
-            <div className="neuro-card h-52 w-full flex items-center justify-center text-gray-400">
+          {expenseData.some(item => item.value > 0) ? <ExpenseChart data={expenseData} /> : <div className="neuro-card h-52 w-full flex items-center justify-center text-gray-400">
               <p>데이터가 없습니다</p>
-            </div>
-          }
+            </div>}
         </div>
         
         {/* 결제 방법 차트 추가 */}
         <h2 className="text-lg font-semibold mb-3">결제 방법별 지출</h2>
-        <PaymentMethodChart 
-          data={paymentMethodData} 
-          isEmpty={!hasPaymentData}
-        />
+        <PaymentMethodChart data={paymentMethodData} isEmpty={!hasPaymentData} />
         
         {/* Top Spending Categories */}
         <h2 className="text-lg font-semibold mb-3 mt-6">주요 지출 카테고리</h2>