design: 강사/학생 홈 디자인 수정

frontend/src/components/ClassCard/ClassCard.module.css

@@ -19,3 +19,7 @@
   stroke: var(--text-color);
   box-sizing: border-box;
 }
+
+img.thumbnail {
+  border: 1px solid var(--border-color);
+}

frontend/src/pages/LearningLecturesPage/LearningLecturesPage.jsx

@@ -5,21 +5,26 @@ import { useMyLectures } from '../../hooks/api/useMyLectures';
 export default function LearningLecturesPage() {
   const { data } = useMyLectures();
   const onGoingClasses = data?.data ?? [];
+  const hasOnGoingClasses = onGoingClasses.length > 0;
 
   return (
     <section>
       <h2 className={styles.title}>수강중인 강의</h2>
       <div className={styles.grid}>
-        {onGoingClasses.map?.((lecture) => (
-          <Link
-            key={lecture.id}
-            to={`/lecture/${lecture.id}`}
-            className={styles.card}
-          >
-            <div className={styles.thumbnail} />
-            <div>{lecture.title}</div>
-          </Link>
-        ))}
+        {hasOnGoingClasses ? (
+          onGoingClasses.map?.((lecture) => (
+            <Link
+              key={lecture.id}
+              to={`/lecture/${lecture.id}`}
+              className={styles.card}
+            >
+              <div className={styles.thumbnail} />
+              <div>{lecture.title}</div>
+            </Link>
+          ))
+        ) : (
+          <div className={styles.empty}>수강중인 강의가 없습니다.</div>
+        )}
       </div>
     </section>
   );

frontend/src/pages/StudentHomePage/StudentHomePage.jsx

@@ -1,3 +1,4 @@
+import styles from './StudentHomePage.module.css';
 import { ClassCard } from '../../components/ClassCard';
 import { ClassGrid } from '../../components/ClassGrid';
 import { MaxWidthLayout } from '../../components/Layout';
@@ -7,6 +8,7 @@ import { useMyLectures } from '../../hooks/api/useMyLectures';
 export default function StudentHomePage() {
   const { data: myLectures } = useMyLectures();
   const onGoingClasses = myLectures?.data ?? [];
+  const hasOnGoingClasses = onGoingClasses.length > 0;
 
   const { data: allLectures } = useLectures();
   const allClasses = allLectures?.data ?? [];
@@ -14,15 +16,19 @@ export default function StudentHomePage() {
   return (
     <MaxWidthLayout>
       <ClassGrid title="수강중인 강의">
-        {onGoingClasses.map?.((lecture) => (
-          <ClassCard
-            key={lecture.id}
-            path={`/lecture/${lecture.id}`}
-            img={lecture.image}
-          >
-            {lecture.title}
-          </ClassCard>
-        ))}
+        {hasOnGoingClasses ? (
+          onGoingClasses.map?.((lecture) => (
+            <ClassCard
+              key={lecture.id}
+              path={`/lecture/${lecture.id}`}
+              img={lecture.image}
+            >
+              {lecture.title}
+            </ClassCard>
+          ))
+        ) : (
+          <div className={styles.msg}>수강중인 강의가 없어요.</div>
+        )}
       </ClassGrid>
       <ClassGrid title="전체 강의">
         {allClasses.map?.((lecture) => (

frontend/src/pages/StudentHomePage/StudentHomePage.module.css

@@ -0,0 +1,10 @@
+.msg {
+  grid-column: 1 / -1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 40px 0;
+  color: var(--text-color-tertiary);
+  font-size: 20px;
+  line-height: 1.2;
+}

frontend/src/pages/TeacherHomePage/TeacherHomePage.module.css

@@ -5,6 +5,8 @@
   align-items: center;
   gap: 20px;
   margin-bottom: 32px;
+  width: 295px;
+  height: 220px;
   background-color: var(--background);
   color: var(--text-color);
   stroke: var(--text-color);
@@ -19,3 +21,14 @@
     background-color: var(--background-secondary);
   }
 }
+
+.msg {
+  grid-column: 1 / -1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 40px 0;
+  color: var(--text-color-tertiary);
+  font-size: 20px;
+  line-height: 1.2;
+}