From b8e2dc8252c84ffe11550dce2d38c829d5caad8c Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sat, 22 Mar 2025 13:03:29 +0000
Subject: [PATCH] Fix spacing in CategorySpendingList

Reduce the spacing between lines in the CategorySpendingList component.
---
 src/components/analytics/CategorySpendingList.tsx | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/components/analytics/CategorySpendingList.tsx b/src/components/analytics/CategorySpendingList.tsx
index fabfffe..2cdc3cf 100644
--- a/src/components/analytics/CategorySpendingList.tsx
+++ b/src/components/analytics/CategorySpendingList.tsx
@@ -30,7 +30,7 @@ const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
   const renderCategoryList = () => {
     if (categories.some(cat => cat.current > 0)) {
       return (
-        <div className="space-y-4 px-1 py-4">
+        <div className="space-y-2 px-1 py-2">
           {categories.map((category) => {
             // 카테고리 이름을 직접 표시
             const categoryName = category.title;
@@ -39,11 +39,11 @@ const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
             
             return (
               <div key={categoryName} className="flex items-center justify-between">
-                <div className="flex items-center gap-3">
-                  <div className="w-4 h-4 rounded-full" style={{
+                <div className="flex items-center gap-2">
+                  <div className="w-3 h-3 rounded-full" style={{
                     backgroundColor: getCategoryColor(categoryName) // 일관된 색상 적용
                   }}></div>
-                  <span className="text-sm">
+                  <span className="text-xs">
                     {categoryName}
                     {description && (
                       <span className="text-gray-500 text-xs ml-1">
@@ -53,10 +53,9 @@ const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
                   </span>
                 </div>
                 <div className="text-right">
-                  <p className="font-medium text-sm">
+                  <p className="font-medium text-xs">
                     {formatCurrency(category.current)}
                   </p>
-                  {/* 퍼센트 표시 제거 */}
                 </div>
               </div>
             );
@@ -65,7 +64,7 @@ const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
       );
     } else {
       return (
-        <div className="py-8 text-center text-gray-400">
+        <div className="py-6 text-center text-gray-400">
           <p>아직 지출 내역이 없습니다</p>
         </div>
       );