fix: overflow-y-auto 로 수정 및 ul 태그 제거

nodak-v2 · Jul 14, 2024 · ce36906 · ce36906
1 parent 852e16a
commit ce36906
Show file tree

Hide file tree

Showing 6 changed files with 73 additions and 83 deletions.
diff --git a/src/app/(post)/result/[postId]/page.tsx b/src/app/(post)/result/[postId]/page.tsx
@@ -23,15 +23,13 @@ const ResultPage = () => {
   return (
     <>
       <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
-        <>
-          <div className='flex h-full grow flex-col gap-4 overflow-y-auto'>
-            <div className='flex flex-col gap-[36px]'>
-              <PostingMain />
-              <PostingButton />
-            </div>
-            <CommentList />
+        <div className='flex h-full grow flex-col gap-4 overflow-y-auto'>
+          <div className='flex flex-col gap-[36px]'>
+            <PostingMain />
+            <PostingButton />
           </div>
-        </>
+          <CommentList />
+        </div>
       </PullToRefresh>
       <CommentFormModal />
     </>

diff --git a/src/app/(post)/search/page.tsx b/src/app/(post)/search/page.tsx
@@ -53,25 +53,23 @@ const SearchPostPage = () => {
       {keyword !== '' && (
         <>
           <ChipContainer currentChannel={channel} defaultPath='/search' />
-          <main className='flex h-full grow flex-col overflow-y-scroll'>
-            <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
-              <ul>
-                {posts.length ? (
-                  posts.map((post, index) => (
-                    <Link
-                      href={`/result/${post.postId}`}
-                      key={`${index}-${post.voteTitle}`}
-                    >
-                      <PostItem post={post} />
-                    </Link>
-                  ))
-                ) : (
-                  <EmptyPage href='/createPost' text='작성 글이 없습니다.' />
-                )}
-                <div ref={scrollRef} />
-              </ul>
-            </PullToRefresh>
-          </main>
+          <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
+            <main className='flex h-full grow flex-col overflow-y-auto'>
+              {posts.length ? (
+                posts.map((post, index) => (
+                  <Link
+                    href={`/result/${post.postId}`}
+                    key={`${index}-${post.voteTitle}`}
+                  >
+                    <PostItem post={post} />
+                  </Link>
+                ))
+              ) : (
+                <EmptyPage href='/createPost' text='작성 글이 없습니다.' />
+              )}
+              <div ref={scrollRef} />
+            </main>
+          </PullToRefresh>
         </>
       )}
     </>

diff --git a/src/app/notification/page.tsx b/src/app/notification/page.tsx
@@ -42,7 +42,7 @@ const Notification = () => {
       <TopBar.Container>
         <p className='font-h2-sm'>알림</p>
       </TopBar.Container>
-      <main className='grow overflow-y-scroll'>
+      <main className='grow overflow-y-auto'>
         {ALARM_DUMMY.length === 0 ? (
           <div className='flex h-full flex-col items-center justify-center gap-2 text-white'>
             <Icon id='warning' aria-label='알림이 없습니다.' size={64} />

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -43,26 +43,24 @@ const Main = () => {
         </Link>
       </TopBar.Container>
       <ChipContainer currentChannel={channel} />
-      <main className='flex h-full grow flex-col overflow-y-scroll'>
-        <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
-          <ul>
-            {posts.length ? (
-              posts.map((post, index) => (
-                <Link
-                  href={`/result/${post.postId}`}
-                  key={`${index}-${post.voteTitle}`}
-                >
-                  <PostItem post={post} />
-                </Link>
-              ))
-            ) : (
-              <EmptyPage href='/createPost' text='작성 글이 없습니다.' />
-            )}
-          </ul>
-        </PullToRefresh>
+      <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
+        <main className='flex h-full grow flex-col overflow-y-auto'>
+          {posts.length ? (
+            posts.map((post, index) => (
+              <Link
+                href={`/result/${post.postId}`}
+                key={`${index}-${post.voteTitle}`}
+              >
+                <PostItem post={post} />
+              </Link>
+            ))
+          ) : (
+            <EmptyPage href='/createPost' text='작성 글이 없습니다.' />
+          )}
 
-        <div ref={scrollRef} />
-      </main>
+          <div ref={scrollRef} />
+        </main>
+      </PullToRefresh>
       <GNB />
     </>
   );

diff --git a/src/app/users/[userId]/_components/PostingList.tsx b/src/app/users/[userId]/_components/PostingList.tsx
@@ -21,24 +21,22 @@ const Posting = () => {
   return (
     <div className='flex h-full flex-col'>
       <span className='font-h4-sm px-4 text-gray-accent3'>작성 글</span>
-      <div className='flex grow flex-col'>
-        <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
-          <ul>
-            {posts.length ? (
-              posts.map((post, index) => (
-                <Link
-                  href={`/result/${post.postId}`}
-                  key={`${index}-${post.voteTitle}`}
-                >
-                  <PostItem post={post} isNickname={false} />
-                </Link>
-              ))
-            ) : (
-              <EmptyPage text={NO_POSTING_TEXT} />
-            )}
-          </ul>
-        </PullToRefresh>
-      </div>
+      <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
+        <div className='flex grow flex-col overflow-y-auto'>
+          {posts.length ? (
+            posts.map((post, index) => (
+              <Link
+                href={`/result/${post.postId}`}
+                key={`${index}-${post.voteTitle}`}
+              >
+                <PostItem post={post} isNickname={false} />
+              </Link>
+            ))
+          ) : (
+            <EmptyPage text={NO_POSTING_TEXT} />
+          )}
+        </div>
+      </PullToRefresh>
     </div>
   );
 };

diff --git a/src/app/users/profile/(posting)/_components/PostingList/index.tsx b/src/app/users/profile/(posting)/_components/PostingList/index.tsx
@@ -22,24 +22,22 @@ const PostingList = ({
   };
 
   return (
-    <div className='flex h-full flex-col'>
-      <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
-        <ul>
-          {posts.length ? (
-            posts.map((post, index) => (
-              <Link
-                href={`/result/${post.postId}`}
-                key={`${index}-${post.voteTitle}`}
-              >
-                <PostItem post={post} isNickname={isNickname} />
-              </Link>
-            ))
-          ) : (
-            <EmptyPage text={text} />
-          )}
-        </ul>
-      </PullToRefresh>
-    </div>
+    <PullToRefresh onRefresh={handleRefresh} pullingContent=''>
+      <div className='flex h-full flex-col overflow-y-auto'>
+        {posts.length ? (
+          posts.map((post, index) => (
+            <Link
+              href={`/result/${post.postId}`}
+              key={`${index}-${post.voteTitle}`}
+            >
+              <PostItem post={post} isNickname={isNickname} />
+            </Link>
+          ))
+        ) : (
+          <EmptyPage text={text} />
+        )}
+      </div>
+    </PullToRefresh>
   );
 };