Merge pull request #751 from KEEPER31337/feature/도서검색_글자_수_넘어가는거_처리_#741

feat : 도서검색 글자수 over 처리
KEEPER31337 · Oct 2, 2023 · 6583a0f · 6583a0f
2 parents 9375258 + 665987e
commit 6583a0f
Showing 1 changed file with 7 additions and 9 deletions.
diff --git a/src/pages/Library/Card/BookCard.tsx b/src/pages/Library/Card/BookCard.tsx
@@ -11,17 +11,15 @@ interface BookCardProps {
 const BookCard = ({ bookInfo, onRequestBook }: BookCardProps) => {
   return (
     <div className="flex h-fit bg-mainBlack p-2">
-      <div className="mr-2 flex h-[120px] w-[85px] bg-middleBlack">
+      <div className="mr-2 flex h-[120px] w-[85px] shrink-0 bg-middleBlack">
         <ServerImg src={bookInfo?.thumbnailPath} alt="library thumbnail" />
       </div>
-      <div className="relative grow p-2">
-        <div>
-          <Typography className="!mb-2 font-semibold">{bookInfo.title}</Typography>
-          <div className="flex space-x-2">
-            <Typography>저자 : {bookInfo.author}</Typography>
-            <span className="text-pointBlue"> | </span>
-            <Typography>권수 : {bookInfo.bookQuantity}</Typography>
-          </div>
+      <div className="relative grow overflow-auto p-2">
+        <Typography className="!mb-2 truncate !font-semibold">{bookInfo.title}</Typography>
+        <div className="flex space-x-2 overflow-auto">
+          <Typography className="truncate">저자 : {bookInfo.author}</Typography>
+          <span className="text-pointBlue"> | </span>
+          <Typography className="shrink-0">권수 : {bookInfo.bookQuantity}</Typography>
         </div>
 
         <div className="absolute bottom-0 right-0">