fix: grid크기 수정

Author: spearStr

frontend/src/components/main/MainLiveSection.tsx

@@ -16,7 +16,7 @@ const MainLiveSection = ({ title }: MainLiveSectionProps) => {
   const { data: liveData } = useRecentLive();
 
   const { info, appendInfo } = liveData;
-  const displayedData = textStatus === VIDEO_VIEW.FOLD ? [...info, ...appendInfo] : info;
+  const displayedData = [...info, ...appendInfo];
 
   const handleTextChange = () => {
     setTextStatus(textStatus === VIDEO_VIEW.MORE_VIEW ? VIDEO_VIEW.FOLD : VIDEO_VIEW.MORE_VIEW);

frontend/src/components/main/MainReplaySection.tsx

@@ -16,7 +16,7 @@ const MainReplaySection = ({ title }: MainReplaySectionProps) => {
   const { data: replayData } = useRecentReplay();
 
   const { info, appendInfo } = replayData;
-  const displayedData = textStatus === VIDEO_VIEW.FOLD ? [...info, ...appendInfo] : info;
+  const displayedData = [...info, ...appendInfo];
 
   const handleTextChange = () => {
     setTextStatus(textStatus === VIDEO_VIEW.MORE_VIEW ? VIDEO_VIEW.FOLD : VIDEO_VIEW.MORE_VIEW);
@@ -66,19 +66,22 @@ const MainSectionContentList = styled.div<{ $textStatus: string }>`
 
   grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
   overflow: ${({ $textStatus }) => ($textStatus === VIDEO_VIEW.MORE_VIEW ? 'hidden' : 'visible')};
-  max-height: ${({ $textStatus }) => ($textStatus === VIDEO_VIEW.MORE_VIEW ? 'calc(2 * (320px + 30px) - 30px)' : 'none')};
+  max-height: ${({ $textStatus }) =>
+    $textStatus === VIDEO_VIEW.MORE_VIEW ? 'calc(2 * (320px + 30px) - 30px)' : 'none'};
 
   > div {
     max-width: 100%;
   }
 
   @media (max-width: 1700px) {
     grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
-    max-height: ${({ $textStatus }) => ($textStatus === VIDEO_VIEW.MORE_VIEW ? 'calc(2 * (320px + 30px) - 30px)' : 'none')};
+    max-height: ${({ $textStatus }) =>
+      $textStatus === VIDEO_VIEW.MORE_VIEW ? 'calc(2 * (320px + 30px) - 30px)' : 'none'};
   }
 
   @media (max-width: 1500px) {
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-    max-height: ${({ $textStatus }) => ($textStatus === VIDEO_VIEW.MORE_VIEW ? 'calc(2 * (300px + 30px) - 30px)' : 'none')};
+    max-height: ${({ $textStatus }) =>
+      $textStatus === VIDEO_VIEW.MORE_VIEW ? 'calc(2 * (300px + 30px) - 30px)' : 'none'};
   }
 `;