feat: 반응형 추가

hyundai-autoever-first-project-team3 · Oct 25, 2024 · 1bd9d1d · 1bd9d1d
1 parent 605d538
commit 1bd9d1d
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 4 deletions.
diff --git a/src/components/mypage/CountCard.jsx b/src/components/mypage/CountCard.jsx
@@ -3,7 +3,7 @@ import React from "react";
 
 const CountCard = ({ title, count, icon }) => {
   return (
-    <div className="flex flex-row border min-h-32 rounded-md p-5 basis-2/6 flex-grow items-center">
+    <div className="flex flex-row border min-h-32 rounded-md p-5 basis-2/6 flex-grow items-center w-full">
       <div className="flex flex-row gap-3 items-start">
         <div className="p-2 bg-blue-100 rounded-md">
           <FontAwesomeIcon

diff --git a/src/components/mypage/MyCard.jsx b/src/components/mypage/MyCard.jsx
@@ -23,7 +23,7 @@ const MyCard = ({
       onClick={onClick}
     >
       <div className="text-xl font-semibold">{title}</div>
-      <div className="text-base text-gray-8 lg:min-h-[200px] line-clamp-2">
+      <div className="text-base text-gray-8 lg:min-h-[100px] line-clamp-2">
         {content}
       </div>
       <div className="flex flex-row gap-5">

diff --git a/src/pages/MyPage.jsx b/src/pages/MyPage.jsx
@@ -43,7 +43,7 @@ const MyPage = () => {
   return (
     <>
       <Header />
-      <PageContainer className="px-2 xl:px-[250px] lg:px-[100px] md:px-5 sm:px-3 pt-3">
+      <PageContainer className="px-2 xl:px-[100px] lg:px-[50px] md:px-5 sm:px-3 pt-3">
         <ProfileSection
           profile={data?.profileImage}
           nickName={data?.nickname}
@@ -83,7 +83,7 @@ const MyPage = () => {
         )}
         {selectedTab === "statistic" && (
           <div className="flex flex-col w-full gap-5 px-2">
-            <div className="flex flex-row items-center w-full gap-3">
+            <div className="flex flex-col w-full gap-3 items-center xl:flex-row  lg:flex-row md:flex-row sm:flex-col">
               <CountCard
                 title="전체 작성글 개수"
                 count={statistics?.tilsCount}