From 3b90e7396d187bdd65c201ccc3e06df05fd41480 Mon Sep 17 00:00:00 2001 From: "gpt-engineer-app[bot]" <159125892+gpt-engineer-app[bot]@users.noreply.github.com> Date: Fri, 21 Mar 2025 12:06:53 +0000 Subject: [PATCH] Reverted to edit edt-0b69430e-05e6-40e3-9ee2-b28a21c97d9a: "Adjust font sizes Reduce font sizes in several components for better readability and UI consistency." --- src/components/ExpenseChart.tsx | 36 +++------------- src/components/SimpleAvatar.tsx | 41 ------------------- .../analytics/CategorySpendingList.tsx | 2 +- 3 files changed, 7 insertions(+), 72 deletions(-) diff --git a/src/components/ExpenseChart.tsx b/src/components/ExpenseChart.tsx index 135ce03..401f91a 100644 --- a/src/components/ExpenseChart.tsx +++ b/src/components/ExpenseChart.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { PieChart, Pie, Cell, ResponsiveContainer, Label } from 'recharts'; +import { PieChart, Pie, Cell, ResponsiveContainer } from 'recharts'; import { getCategoryColor } from '@/utils/categoryColorUtils'; interface ExpenseData { @@ -17,7 +17,7 @@ const ExpenseChart: React.FC = ({ data }) => { return (
- + = ({ data }) => { paddingAngle={5} dataKey="value" labelLine={true} - label={({ name, percent, x, y }) => { - // 좌표 조정으로 레이블 위치 최적화 - const radius = 90; // 레이블을 더 바깥쪽으로 배치 - const centerX = parseInt(x.toString()); - const centerY = parseInt(y.toString()); - - // 차트 중심으로부터의 각도 계산 - const angle = Math.atan2(centerY - 100, centerX - 100); - - // 레이블을 원 바깥으로 배치 - const labelX = 100 + Math.cos(angle) * radius; - const labelY = 100 + Math.sin(angle) * radius; - - return ( - - 100 ? "start" : "end"} - dominantBaseline="central" - fontSize={12} - > - {`${name} ${(percent * 100).toFixed(0)}%`} - - - ); - }} + label={({ name, percent }) => ( + `${name} ${(percent * 100).toFixed(0)}%` + )} + fontSize={12} > {data.map((entry, index) => ( diff --git a/src/components/SimpleAvatar.tsx b/src/components/SimpleAvatar.tsx index d86aa91..e69de29 100644 --- a/src/components/SimpleAvatar.tsx +++ b/src/components/SimpleAvatar.tsx @@ -1,41 +0,0 @@ - -import React from 'react'; - -interface SimpleAvatarProps { - src?: string; - name: string; - size?: 'sm' | 'md' | 'lg'; - className?: string; -} - -const SimpleAvatar: React.FC = ({ - src, - name, - size = 'md', - className = '' -}) => { - const initials = name - .split(' ') - .map(part => part.charAt(0)) - .join('') - .toUpperCase() - .substring(0, 2); - - const sizeClasses = { - sm: 'w-8 h-8 text-xs', - md: 'w-10 h-10 text-sm', - lg: 'w-12 h-12 text-base' - }; - - return ( -
- {src ? ( - {name} - ) : ( - {initials} - )} -
- ); -}; - -export default SimpleAvatar; diff --git a/src/components/analytics/CategorySpendingList.tsx b/src/components/analytics/CategorySpendingList.tsx index 4019456..3db340c 100644 --- a/src/components/analytics/CategorySpendingList.tsx +++ b/src/components/analytics/CategorySpendingList.tsx @@ -27,7 +27,7 @@ const CategorySpendingList: React.FC = ({ return (
{categories.some(cat => cat.current > 0) ? ( -
+
{categories.map((category) => { // 카테고리 이름을 직접 표시 const categoryName = category.title;