From e747b216694d8ba826b425fc9abee580f28116a4 Mon Sep 17 00:00:00 2001
From: yoooooojin <ujin4903@sookmyung.ac.kr>
Date: Mon, 27 Jul 2026 02:00:01 +0900
Subject: [PATCH 1/3] =?UTF-8?q?feat:=20=EC=95=8C=EB=A6=BC=20=EC=BB=B4?=
 =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=83=9D=EC=84=B1=20(api=20?=
 =?UTF-8?q?=EC=97=B0=EB=8F=99)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/NotificationBell.tsx | 58 ++++++++++++++++++++++
 1 file changed, 58 insertions(+)
 create mode 100644 src/components/common/NotificationBell.tsx

diff --git a/src/components/common/NotificationBell.tsx b/src/components/common/NotificationBell.tsx
new file mode 100644
index 0000000..c91ecea
--- /dev/null
+++ b/src/components/common/NotificationBell.tsx
@@ -0,0 +1,58 @@
+import { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { ICONS } from '@/constants/icons';
+import { IconButton } from '@/components/common/IconButton';
+
+export const NotificationBell = () => {
+  const navigate = useNavigate();
+  const [unreadCount, setUnreadCount] = useState<number>(0);
+
+  useEffect(() => {
+    const fetchUnreadCount = async () => {
+      try {
+        const token = localStorage.getItem('accessToken');
+        const response = await fetch(
+          'https://swapclass.duckdns.org/api/notifications/unread-count',
+          {
+            method: 'GET',
+            headers: {
+              'Content-Type': 'application/json',
+              Authorization: `Bearer ${token}`,
+            },
+          },
+        );
+
+        const result = await response.json();
+
+        // 💡 백엔드 응답(result.success)이 성공이고, data 객체가 존재할 때
+        if (result.success && result.data) {
+          // result.data가 { "typeA": 1, "typeB": 2 } 형태이므로,
+          // Object.values로 숫자 배열([1, 2])만 뽑아낸 뒤 모두 더해줍니다.
+          const totalCount = Object.values(result.data).reduce(
+            (sum: number, current: any) => sum + (Number(current) || 0),
+            0,
+          );
+
+          setUnreadCount(totalCount);
+        }
+      } catch (error) {
+        console.error('알림 개수 조회 실패:', error);
+      }
+    };
+
+    fetchUnreadCount();
+  }, []);
+
+  return (
+    <div
+      className="relative cursor-pointer mt-1"
+      onClick={() => navigate('/alert')}
+    >
+      <IconButton icon={ICONS.BELL} />
+
+      {unreadCount > 0 && (
+        <div className="absolute top-1.5 left-1.5 w-1.5 h-1.5 bg-point-red rounded-full" />
+      )}
+    </div>
+  );
+};

From 63d55c0a06fe0bd585d8f926ee5485cfa94275c5 Mon Sep 17 00:00:00 2001
From: yoooooojin <ujin4903@sookmyung.ac.kr>
Date: Mon, 27 Jul 2026 02:04:04 +0900
Subject: [PATCH 2/3] =?UTF-8?q?fix:=20=EB=B9=A8=EA=B0=84=20=EC=A0=90=20?=
 =?UTF-8?q?=EC=9C=84=EC=B9=98,=20=ED=81=AC=EA=B8=B0=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/NotificationBell.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/common/NotificationBell.tsx b/src/components/common/NotificationBell.tsx
index c91ecea..6bdb7b1 100644
--- a/src/components/common/NotificationBell.tsx
+++ b/src/components/common/NotificationBell.tsx
@@ -51,7 +51,7 @@ export const NotificationBell = () => {
       <IconButton icon={ICONS.BELL} />
 
       {unreadCount > 0 && (
-        <div className="absolute top-1.5 left-1.5 w-1.5 h-1.5 bg-point-red rounded-full" />
+        <div className="absolute top-2.5 left-1.5 w-1 h-1 bg-point-red rounded-full" />
       )}
     </div>
   );

From 1b17561d4de62d1191d734e330979127f03e33ae Mon Sep 17 00:00:00 2001
From: yoooooojin <ujin4903@sookmyung.ac.kr>
Date: Sat, 1 Aug 2026 02:30:05 +0900
Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=EB=B0=B0=EC=A7=80=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/Badge.tsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/common/Badge.tsx b/src/components/common/Badge.tsx
index 4fbdf72..3be7909 100644
--- a/src/components/common/Badge.tsx
+++ b/src/components/common/Badge.tsx
@@ -9,7 +9,11 @@ interface BadgeProps {
     | 'lightPink'
     | 'lightYellow'
     | 'outlineGray'
-    | 'outlineBlue';
+    | 'outlineBlue'
+    | 'lightRed'
+    | 'grayOutline'
+    | 'bluesolid'
+    | 'lightBlueOutline';
   className?: string; // 추가적인 여백(ml-2) 등을 줄 때 사용
 }
 
@@ -21,12 +25,13 @@ const badgeVariants = {
   lightYellow: 'bg-yellow-main text-[#CA8A04] border border-[#FEF08A]', // 연노랑 바탕 + 노랑 글씨 (교양필수)
   outlineBlue: 'bg-white border border-brand-lightBlue text-brand-lightBlue', // 흰 바탕 + 파란 테두리 + 파란 글씨 (요청받은 게시글)
   outlineGray: 'bg-white border border-gray-300 text-gray-600', // 흰 바탕 + 회색 테두리
-  lightRed: 'bg-red-100 text-red-100 border text-gray-600',
-  grayOutline: 'bg-gray-200 text-zinc-900 text-xs border border-slate-400 ', // 교양필수
+  lightRed:
+    'bg-red-100 text-zinc-900 border text-gray-600 border-neutral-400 font-normal ',
+  grayOutline: 'bg-gray-200 text-zinc-900 text-sm border border-slate-400 ', // 교양필수
   bluesolid:
     'bg-brand-lightBlue text-white text-xs font-light border border-slate-500 font-normal', // 졸업요건
   lightBlueOutline:
-    'bg-blue-100 text-zinc-900 border text-xs border-brand-lightBlue ', //전공필수
+    'bg-brand-soft text-zinc-900 border text-gray-600 text-xs border-neutral-400 font-normal', //전공필수
 };
 
 export const Badge = ({