From b57b16acbc3df9df45a806a23dc7bc30ecd9f5e2 Mon Sep 17 00:00:00 2001
From: "Hyunmin Woo (Hanul)" <woohm404@gmail.com>
Date: Mon, 27 Nov 2023 20:28:09 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=EC=8B=9C=EA=B0=84=ED=91=9C=20?=
 =?UTF-8?q?=EA=B0=95=EC=9D=98=EB=AA=85=20&=20=EA=B0=95=EC=9D=98=EC=8B=A4?=
 =?UTF-8?q?=20=EC=9E=98=EB=A6=BC=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0?=
 =?UTF-8?q?=20(#93)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/app/components/Timetable.tsx          | 24 ++++++++++++-------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/apps/friends-react-native/src/app/components/Timetable.tsx b/apps/friends-react-native/src/app/components/Timetable.tsx
index d4e1ce1..8dc73f1 100644
--- a/apps/friends-react-native/src/app/components/Timetable.tsx
+++ b/apps/friends-react-native/src/app/components/Timetable.tsx
@@ -37,18 +37,24 @@ export const Timetable = memo(({ timetable, style, palette }: Props) => {
               {currentDayClasses.map((c) => {
                 const { bg, fg } = timetableViewService.getLessonColor(c.lesson, palette);
                 const place = c.place.trim();
+                const top = DAY_LABEL_HEIGHT + ((c.startMinute - startHour * 60) / 60) * hourHeight - 1;
+                const cellHeight = ((c.endMinute - c.startMinute) / 60) * hourHeight;
+
+                const classLines = (cellHeight - (place ? 16 : 0)) / 12;
+
                 return (
                   <View
                     key={`${c.day} ${c.startMinute} ${c.endMinute}`}
-                    style={{
-                      ...styles.classCell,
-                      top: DAY_LABEL_HEIGHT + ((c.startMinute - startHour * 60) / 60) * hourHeight - 1,
-                      height: ((c.endMinute - c.startMinute) / 60) * hourHeight,
-                      backgroundColor: bg,
-                    }}
+                    style={{ ...styles.classCell, top, height: cellHeight, backgroundColor: bg }}
                   >
-                    <Typography style={{ ...styles.classTitle, color: fg }}>{c.lesson.courseTitle}</Typography>
-                    {place && <Typography style={{ ...styles.classPlace, color: fg }}>{place}</Typography>}
+                    <Typography numberOfLines={classLines} style={{ ...styles.classTitle, color: fg }}>
+                      {c.lesson.courseTitle}
+                    </Typography>
+                    {place && (
+                      <Typography numberOfLines={1} style={{ ...styles.classPlace, color: fg }}>
+                        {place}
+                      </Typography>
+                    )}
                   </View>
                 );
               })}
@@ -130,7 +136,7 @@ const styles = StyleSheet.create({
 
   labelFont: { fontSize: 12, textAlign: 'center' },
 
-  classTitle: { fontSize: 10, fontWeight: '500', textAlign: 'center' },
+  classTitle: { fontSize: 11, fontWeight: '500', textAlign: 'center' },
   classPlace: { fontSize: 10, fontWeight: '700', textAlign: 'center' },
   classCell: {
     padding: 4,