Fix: 마이페이지 강의 그리드 수정 / 수강생 등록 이름이 너무 긴 경우 overflow hidden 처리

This commit is contained in:
정기영 2024-08-13 17:08:09 +09:00
parent 9b3c177f9d
commit 657029c0a9
3 changed files with 10 additions and 1 deletions

View File

@ -26,7 +26,7 @@ export default function LectureEnroll({ userName, enrollid, onDelete, enrolled =
return ( return (
<div className={styles.enrollLink}> <div className={styles.enrollLink}>
<span>{userName}</span> <span className={styles.userName}>{userName}</span>
<div className={styles.buttonWrapper}> <div className={styles.buttonWrapper}>
{!enrolled && ( {!enrolled && (
<button <button

View File

@ -14,6 +14,7 @@
.buttonWrapper { .buttonWrapper {
display: flex; display: flex;
flex-shrink: 0;
gap: 8px; gap: 8px;
} }
@ -46,3 +47,10 @@
border-color: var(--error-color); border-color: var(--error-color);
color: var(--error-color); color: var(--error-color);
} }
.userName {
word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

View File

@ -25,6 +25,7 @@
min-width: 0; min-width: 0;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap;
} }
.thumbnail { .thumbnail {