Merge pull request #109 from flareseek/feat/link

feat: 타임테이블 링크 추가
flareseek · Sep 23, 2024 · c109431 · c109431
2 parents 8f0b1fe + 8377251
commit c109431
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 4 deletions.
diff --git a/src/pages/Timetable/.css.ts b/src/pages/Timetable/.css.ts
@@ -94,6 +94,13 @@ export const timeTableDescription = style({
   },
 });
 
+export const timeTableLink = style({
+  color: vars.color.blue2,
+  textDecoration: "none",
+  marginLeft: "5px",
+  fontFamily: vars.font.pretendardRegular,
+});
+
 export const timeTableTime = style({
   fontSize: "0.9rem",
   fontWeight: "bold",

diff --git a/src/pages/Timetable/index.tsx b/src/pages/Timetable/index.tsx
@@ -83,7 +83,19 @@ const TimeTableItem: React.FC<{
     <div className={`${styles.timeTableItem}`} ref={status === "current" ? refCallback : null}>
       <h2 className={styles.timeTableTitle}>{timeTable.title}</h2>
       {timeTable.descriptionShow && (
-        <p className={styles.timeTableDescription}>{timeTable.description}</p>
+        <p className={styles.timeTableDescription}>
+          {timeTable.description}
+          {timeTable.link && (
+            <a
+              className={styles.timeTableLink}
+              href={timeTable.link.url}
+              target="_blank"
+              rel="noreferrer"
+            >
+              {timeTable.link.text}
+            </a>
+          )}
+        </p>
       )}
       <p className={styles.timeTableTime}>
         {timeTable.startTime.getMonth() + 1}/{timeTable.startTime.getDate()} |{" "}

diff --git a/src/pages/Timetable/timeTableInfo.ts b/src/pages/Timetable/timeTableInfo.ts
@@ -388,11 +388,15 @@ export const timeTableInfo: timeTableInfoProps[] = [
   },
   {
     title: "재학생 우선 입장",
-    description: "재학생 우선 입장 시간 (자세한 안내는 인스타그램 참조)",
+    description: "재학생 우선 입장 시간",
     descriptionShow: true,
     date: new Date("2024-09-23"),
     startTime: new Date("2024-09-23 17:00"),
     endTime: new Date("2024-09-23 17:50"),
+    link: {
+      text: "(자세히보기)",
+      url: "https://www.instagram.com/p/DAFpPQ_SQyL",
+    },
   },
   {
     title: "전체 입장",
@@ -404,11 +408,15 @@ export const timeTableInfo: timeTableInfoProps[] = [
   },
   {
     title: "재학생 우선 입장",
-    description: "재학생 우선 입장 시간 (자세한 안내는 인스타그램 참조)",
+    description: "재학생 우선 입장 시간",
     descriptionShow: true,
     date: new Date("2024-09-24"),
     startTime: new Date("2024-09-24 17:00"),
     endTime: new Date("2024-09-24 17:50"),
+    link: {
+      text: "(자세히보기)",
+      url: "https://www.instagram.com/p/DAFpPQ_SQyL",
+    },
   },
   {
     title: "전체 입장",
@@ -420,11 +428,15 @@ export const timeTableInfo: timeTableInfoProps[] = [
   },
   {
     title: "재학생 우선 입장",
-    description: "재학생 우선 입장 시간 (자세한 안내는 인스타그램 참조)",
+    description: "재학생 우선 입장 시간",
     descriptionShow: true,
     date: new Date("2024-09-25"),
     startTime: new Date("2024-09-25 17:00"),
     endTime: new Date("2024-09-25 17:50"),
+    link: {
+      text: "(자세히보기)",
+      url: "https://www.instagram.com/p/DAFpPQ_SQyL",
+    },
   },
   {
     title: "전체 입장",

diff --git a/src/shared/types/timeTable.ts b/src/shared/types/timeTable.ts
@@ -8,6 +8,7 @@ export interface timeTableInfoProps {
   date: Date;
   startTime: Date;
   endTime: Date;
+  link?: { text: string; url: string };
 }
 
 export interface timeTableFilterProps {