Develop

apps/nowait-user/src/pages/order/addMenu/AddMenuPage.tsx

@@ -45,7 +45,7 @@ const AddMenuPage = () => {
 
   return (
     <div className="flex flex-col min-h-dvh bg-white">
-      <div className="flex flex-col flex-grow px-5">
+      <div className="flex flex-col grow px-5">
         <h1 className="-mx-5 h-[246px] object-cover">
           <img
             className="w-full h-full object-cover"
@@ -63,7 +63,7 @@ const AddMenuPage = () => {
         </div>
       </div>
       {/* 메뉴 가격 및 수량 컨트롤 */}
-      <div className="fixed bottom-[112px] w-full max-w-[430px] min-w-[320px]  bg-white">
+      <div className="fixed bottom-28 w-full max-w-[430px] min-w-[320px]  bg-white">
         <div className="w-full flex justify-between items-center px-5">
           <h1 className="text-[24px] font-semibold">
             <NumberFlow value={menu!.price * quantity} suffix="원" />

apps/nowait-user/src/pages/order/home/StorePage.tsx

@@ -38,8 +38,8 @@ const StorePage = () => {
   console.log(menus, "asd");
   return (
     <div>
-      <div className={`flex flex-col flex-grow min-h-dvh pt-7.5 ${cart && cart.length > 0 ? "pb-[116px]" : ""} px-5`}>
-        <div className="flex-grow">
+      <div className={`flex flex-col grow min-h-dvh pt-7.5 ${cart && cart.length > 0 ? "pb-[116px]" : ""} px-5`}>
+        <div className="grow">
           <StoreHeader storeName={menus?.storeName} isLoading={isLoading} />
           <SectionDivider />
           <MenuList

apps/nowait-user/src/pages/order/home/components/StoreHeader.tsx

@@ -16,14 +16,14 @@ const StoreHeader = ({
         {!isLoading ? (
           <h1 className="text-headline-24-bold mb-1.5">{storeName}</h1>
         ) : (
-          <h1 className="w-[230px] h-[24px] mb-1.5 bg-black-20 rounded-[4px]"></h1>
+          <h1 className="w-[230px] h-6 mb-1.5 bg-black-20 rounded-sm"></h1>
         )}
 
         <h2 className="text-16-medium text-black-70">{tableId}번 테이블</h2>
       </div>
       <button
         onClick={() => navigate(`/${storeId}/orderDetails`)}
-        className="text-14-semibold bg-black-20 py-2 px-2.5 rounded-[8px] text-black-70 cursor-pointer"
+        className="text-14-semibold bg-black-20 py-2 px-2.5 rounded-lg text-black-70 cursor-pointer"
       >
         주문내역
       </button>

apps/nowait-user/src/pages/order/orderDetails/OrderDetailsPage.tsx

@@ -37,7 +37,7 @@ const OrderDetailsPage = () => {
   return (
     <div>
       <BackOnlyHeader />
-      <div className="bg-black-15 min-h-screen py-[64px] px-5">
+      <div className="bg-black-15 min-h-screen py-16 px-5">
         <h1 className="text-headline-22-bold mb-[23px] text-black-90">
           주문내역 <span className="text-primary">{orderDetails.length}건</span>
         </h1>
@@ -61,7 +61,7 @@ const OrderDetailsPage = () => {
                     {order.createdAt}
                   </p>
                 </div>
-                <ul className="border-b-1 border-[#ececec] pb-5 mb-5">
+                <ul className="border-b border-[#ececec] pb-5 mb-5">
                   {order.items?.map((item: OrderDetailsType) => {
                     return (
                       <li

apps/nowait-user/src/pages/order/orderList/OrderListPage.tsx

@@ -62,7 +62,7 @@ const OrderListPage = () => {
   return (
     <div>
       <BackHeader title="장바구니" />
-      <section className="flex flex-col flex-grow min-h-[calc(100dvh-164px)] pt-7 px-5 mt-[48px]">
+      <section className="flex flex-col grow min-h-[calc(100dvh-164px)] pt-7 px-5 mt-12">
         <h1 className="text-headline-22-bold mb-5">
           주문 총 <span className="text-primary">{cart.length}건</span>
         </h1>
@@ -132,7 +132,7 @@ const OrderListPage = () => {
               onClick={(e) => e.stopPropagation()}
               className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 min-w-[calc(100%-35px)] max-w-[430px] bg-white rounded-[20px] px-[22px] pt-[30px] pb-[22px]"
             >
-              <h1 className="text-title-20-bold text-black-90 text-center mb-[20px] break-keep">
+              <h1 className="text-title-20-bold text-black-90 text-center mb-5 break-keep">
                 현재{" "}
                 {soldOutMenus?.map((menu: CartType, idx: number) => (
                   <span key={menu.menuId}>

apps/nowait-user/src/pages/order/orderList/components/CartItem.tsx

@@ -24,7 +24,7 @@ const CartItem = ({ id, name, originPrice, price, quantity }: PropsType) => {
     >
       <div className="w-full p-5">
         <div className="flex justify-between items-start">
-          <div className="max-w-[12.5rem]">
+          <div className="max-w-50">
             <h1 className="text-title-18-semibold text-black-90 text-ellipsis line-clamp-2">
               {name}
             </h1>

apps/nowait-user/src/pages/order/remittance/RemittancePage.tsx

@@ -72,7 +72,7 @@ const RemittancePage = () => {
   };
   console.log(remittance);
   return (
-    <div className="flex flex-col flex-grow mt-[48px] mb-[116px]">
+    <div className="flex flex-col grow mt-12 mb-[116px]">
       <BackHeader title="주문하기" />
       <section className="px-5">
         <OrderSummary cart={cart} />

apps/nowait-user/src/pages/order/remittance/components/OrderSummary.tsx

@@ -37,7 +37,7 @@ const OrderSummary = ({ cart }: PropsType) => {
                 className="flex justify-between items-center pb-5"
                 key={item.menuId}
               >
-                <div className="max-w-[224px]">
+                <div className="max-w-56">
                   <h1 className="text-16-medium text-black-80 mb-1 text-ellipsis line-clamp-2">
                     {item.name}
                   </h1>
@@ -52,7 +52,7 @@ const OrderSummary = ({ cart }: PropsType) => {
                   </div>
                 </div>
                 <img
-                  className="w-[76px] h-[76px] rounded-[12px] object-cover"
+                  className="w-[76px] h-[76px] rounded-xl object-cover"
                   src={item?.image || defaultMenuImageSm}
                   alt="음식 메뉴 이미지"
                 />

apps/nowait-user/src/pages/order/remittance/components/PayerInput.tsx

@@ -31,7 +31,7 @@ const PayerInput = ({
           </h2>
         </div>
         <input
-          className="w-full text-16-medium bg-black-10 rounded-[12px] placeholder-black-55 py-3.5 px-4 outline-none text-black-80"
+          className="w-full text-16-medium bg-black-10 rounded-xl placeholder-black-55 py-3.5 px-4 outline-none text-black-80"
           placeholder="입금자명 입력"
           value={value}
           onChange={(e) => setValue(e.target.value)}

apps/nowait-user/src/pages/order/remittance/components/Radio.tsx

@@ -41,7 +41,7 @@ const Radio = ({
           className="peer sr-only"
         />
         <div className="w-[18px] h-[18px] rounded-full border border-[#CCCCCC] flex items-center justify-center peer-checked:border-black transition" />
-        <div className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10 w-[10px] h-[10px] rounded-full bg-transparent peer-checked:bg-black transition" />
+        <div className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10 w-2.5 h-2.5 rounded-full bg-transparent peer-checked:bg-black transition" />
       </div>
     </label>
   );

apps/nowait-user/src/pages/order/remittance/components/RemitOptionsSkeleton.tsx

@@ -16,7 +16,7 @@ const RemitOptionsSkeleton = () => {
             return (
               <div
                 key={i}
-                className="w-full h-[21px] bg-black-25 rounded-[4px]"
+                className="w-full h-[21px] bg-black-25 rounded-sm"
               ></div>
             );
           })}

apps/nowait-user/src/pages/waiting/WaitingSummary/WaitingSummaryPage.tsx

@@ -65,21 +65,21 @@ const WaitingSummaryPage = () => {
         <BackOnlyHeader />
         <div className="flex flex-col flex-1">
           <div className="px-5 mt-[74px]">
-            <h1 className="text-headline-24-bold mb-[40px]">
+            <h1 className="text-headline-24-bold mb-10">
               현재 <span className="text-primary">{store?.waitingCount}</span>
               팀이
               <br />
               대기하고 있어요
             </h1>
-            <div className="p-5.5 rounded-[16px] bg-black-10 mb-[30px]">
+            <div className="p-5.5 rounded-2xl bg-black-10 mb-[30px]">
               <div className="flex justify-between items-start mb-2.5 ">
                 <p className="text-16-semibold text-black-50">부스</p>
                 <div className="max-w-[205px] text-16-medium text-black-90 text-right break-keep">
                   <p className="inline">{store?.name} / </p>
                   <span
                     className={`${
                       store!.departmentName.length > 14 ? "block" : "inline"
-                    } w-[100%] truncate`}
+                    } w-full truncate`}
                   >
                     {store?.departmentName}
                   </span>
@@ -91,16 +91,16 @@ const WaitingSummaryPage = () => {
               </div>
             </div>
           </div>
-          <div className="bg-black-10 px-5 py-[30px] flex-grow">
-            <h1 className="text-title-14-semibold text-black-80 mb-[12px]">
+          <div className="bg-black-10 px-5 py-[30px] grow">
+            <h1 className="text-title-14-semibold text-black-80 mb-3">
               대기 등록 전 꼭 확인해주세요
             </h1>
             <ul>
               {WAITING_GUIDE.map((guide, i) => {
                 return (
                   <li
                     key={i}
-                    className="text-[14px] text-regular text-black-60 mb-[12px] whitespace-pre-line break-keep list-disc ml-[24px]"
+                    className="text-[14px] text-regular text-black-60 mb-3 whitespace-pre-line break-keep list-disc ml-6"
                   >
                     {guide.description}
                   </li>
@@ -126,7 +126,7 @@ const WaitingSummaryPage = () => {
             onClick={() => modal.close()}
           >
             <div className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 min-w-[calc(100%-40px)] max-w-[430px] bg-white rounded-[20px] px-[22px] pt-[30px] pb-[22px]">
-              <h1 className="text-title-20-bold text-black-90 text-center mb-[20px] break-keep">
+              <h1 className="text-title-20-bold text-black-90 text-center mb-5 break-keep">
                 주점 웨이팅은 <br />
                 {MAX_RESERVATIONS}개까지 가능 합니다
               </h1>

apps/nowait-user/src/pages/waiting/bookmark/components/BookmarkListItem.tsx

@@ -33,7 +33,7 @@ const BookmarkListItem = ({
   );
 
   const [isBookmarked, setIsBookmarked] = useState(true);
-  
+
   const handleBookmarkButton = async () => {
     const prev = isBookmarked;
     setIsBookmarked(!isBookmarked);
@@ -60,7 +60,7 @@ const BookmarkListItem = ({
             alt="북마크한 주점 메인 이미지"
           />
           {waitingCount !== 0 && (
-            <p className="absolute top-[12px] right-[12px] text-primary bg-[#ffe9df] px-2 py-[7px] font-bold text-[12px] rounded-[6px]">
+            <p className="absolute top-3 right-3 text-primary bg-[#ffe9df] px-2 py-[7px] font-bold text-[12px] rounded-md">
               대기 {waitingCount}팀
             </p>
           )}

apps/nowait-user/src/pages/waiting/bookmark/components/BookmarkListItemSkeleton.tsx

@@ -8,10 +8,10 @@ const BookmarkListItemSkeleton = () => {
             <div className="w-full h-[195px] rounded-[14px] bg-black-20" />
             <div className="flex items-start justify-between py-3">
               <div className="flex items-center gap-2.5">
-                <div className="w-[40px] h-[40px] rounded-full bg-black-20" />
+                <div className="w-10 h-10 rounded-full bg-black-20" />
                 <div className="flex flex-col justify-between gap-2">
-                  <h1 className="w-[194px] h-[18px] rounded-[4px] bg-black-20"></h1>
-                  <h2 className="w-[146px] h-[16px] rounded-[4px] bg-black-20"></h2>
+                  <h1 className="w-[194px] h-[18px] rounded-sm bg-black-20"></h1>
+                  <h2 className="w-[146px] h-4 rounded-sm bg-black-20"></h2>
                 </div>
               </div>
             </div>

apps/nowait-user/src/pages/waiting/boothMap/MapManagePage.tsx

@@ -73,7 +73,7 @@ const MapManagePage = () => {
           })}
         </NaverMap>
       </MapDiv>
-      <div className="flex gap-1 fixed left-1/2 bottom-[10px] -translate-x-1/2 w-full z-50 px-[10px]">
+      <div className="flex gap-1 fixed left-1/2 bottom-2.5 -translate-x-1/2 w-full z-50 px-2.5">
         <Button className="text-15-medium" onClick={() => setStatus(true)}>
           시작
         </Button>

apps/nowait-user/src/pages/waiting/boothMap/components/BoothDetail.tsx

@@ -42,9 +42,9 @@ const BoothDetail = ({ booth }: PropsType) => {
       transition={{ duration: 0.3, ease: "easeInOut" }}
       className="fixed bottom-[30px] left-1/2 -translate-x-1/2 w-[calc(100%-32px)] bg-white rounded-[20px] z-30"
     >
-      <div className="pt-[20px] pb-[16px] px-[20px]">
+      <div className="pt-5 pb-4 px-5">
         <div className="flex items-start justify-between">
-          <div className="mb-[16px]">
+          <div className="mb-4">
             <h1 className="text-title-20-semibold text-black-90 mb-1">
               {name}
             </h1>
@@ -54,13 +54,15 @@ const BoothDetail = ({ booth }: PropsType) => {
             <BookmarkIcon isBookmarked={isBookmarked} />
           </button>
         </div>
-        <p className="flex items-center text-16-regular text-black-80 mb-[20px]">
+        <p className="flex items-center text-16-regular text-black-80 mb-5">
           <span className="w-[18px] flex justify-center mr-1.5">
             <Clock />
           </span>
           {waitingCount === 0 ? "대기없음" : `대기 ${waitingCount}명`}
         </p>
-        <Button onClick={() => navigate(`/store/${publicCode}`)}>상세 보기</Button>
+        <Button onClick={() => navigate(`/store/${publicCode}`)}>
+          상세 보기
+        </Button>
       </div>
     </motion.div>
   );

apps/nowait-user/src/pages/waiting/boothMap/components/BoothList.tsx

@@ -55,7 +55,7 @@ const BoothList = React.memo(({
       className="fixed -bottom-[615px] left-0 w-full bg-white rounded-t-[36px] z-30"
     >
       <div>
-        <p className="w-[40px] h-[4px] rounded-full bg-black-30 mx-auto mt-2.5 mb-[26px]"></p>
+        <p className="w-10 h-1 rounded-full bg-black-30 mx-auto mt-2.5 mb-[26px]"></p>
         <div className="px-5">
           <div className="mb-[30px]">
             <h1 className="text-title-20-semibold mb-1">부스 리스트</h1>

apps/nowait-user/src/pages/waiting/boothMap/components/BoothListItem.tsx

@@ -54,7 +54,7 @@ const BoothListItem = ({
             alt="북마크한 주점 메인 이미지"
           />
           {waitingCount !== 0 && (
-            <p className="absolute top-[12px] right-[12px] text-primary bg-[#ffe9df] px-2 py-[7px] font-bold text-[12px] rounded-[6px]">
+            <p className="absolute top-3 right-3 text-primary bg-[#ffe9df] px-2 py-[7px] font-bold text-[12px] rounded-md">
               대기 {waitingCount}팀
             </p>
           )}
@@ -76,7 +76,7 @@ const BoothListItem = ({
           </Link>
         </div>
         <button
-          className="!opacity-100 !cursor-pointer mr-[5px]"
+          className="opacity-100! cursor-pointer! mr-[5px]"
           onClick={handleBookmarkButton}
         >
           <BookmarkIcon isBookmarked={isBookmarked} />

apps/nowait-user/src/pages/waiting/boothMap/components/MapHeader.tsx

@@ -90,7 +90,7 @@ const HomeHeader = React.memo(() => {
             >
               <div className="max-w-[430px] min-w-[360px] w-full h-svh bg-white mx-auto flex flex-col">
                 {/* 고정된 헤더 */}
-                <div className="flex justify-between items-center pt-4 px-5 flex-shrink-0">
+                <div className="flex justify-between items-center pt-4 px-5 shrink-0">
                   <button
                     onClick={() => {
                       closeMenu();

apps/nowait-user/src/pages/waiting/boothMap/components/mapControls/CompassButton.tsx

@@ -62,7 +62,7 @@ const CompassButton = ({
   };
   return (
     <button
-      className={`relative z-30 p-[6px] rounded-[2px]  transition-colors ${
+      className={`relative z-30 p-1.5 rounded-xs  transition-colors ${
         isCompassMode ? "bg-[#FF4103]" : "bg-white"
       }`}
       onClick={handleClick}

apps/nowait-user/src/pages/waiting/boothMap/components/mapControls/MapControls.tsx

@@ -14,13 +14,13 @@ const MapControlButtons = ({
   const modal = useModal();
 
   return (
-    <div className="absolute left-[4px] top-[60px] flex flex-col gap-1">
+    <div className="absolute left-1 top-[60px] flex flex-col gap-1">
       <div className="relative left-0 top-0 z-30 w-full flex gap-1">
         <button
           onClick={() => {
             modal.open();
           }}
-          className="bg-white p-[6px] rounded-[2px]"
+          className="bg-white p-1.5 rounded-xs"
         >
           <University width="22px" height="22px" />
         </button>

apps/nowait-user/src/pages/waiting/boothMap/components/mapControls/UniversityListModal.tsx

@@ -13,7 +13,7 @@ const UniversityListModal = ({
     <div className="fixed inset-0 z-50 bg-black/50" onClick={onClose}>
       <ul
         onClick={(e) => e.stopPropagation()}
-        className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 min-w-[calc(100%-35px)] max-w-[430px] bg-white rounded-[20px] px-[8px] py-[8px]"
+        className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 min-w-[calc(100%-35px)] max-w-[430px] bg-white rounded-[20px] px-2 py-2"
       >
         {UNIVERSITY.map((university) => (
           <li

apps/nowait-user/src/pages/waiting/storeDetail/StoreDetailPage.tsx

@@ -69,7 +69,7 @@ const StoreDetailPage = () => {
         {/* 주점 배너 이미지 */}
         <CommonSwiper slideImages={store?.bannerImages || []}></CommonSwiper>
         {/* 학과 정보 섹션 */}
-        <section className="border-b-1 border-[#f4f4f4]">
+        <section className="border-b border-[#f4f4f4]">
           <div className="flex justify-between items-center py-[21px]">
             <div className="flex flex-col justify-between gap-[3px]">
               <p className="text-14-regular text-black-70">
@@ -86,14 +86,14 @@ const StoreDetailPage = () => {
           {/* 주점 대기팀 인원 수 */}
           {store?.waitingCount !== 0 && (
             <div className="pb-5">
-              <p className="inline-block text-[12px] font-bold rounded-[6px] px-2 py-[7px] bg-[#ffeedf] text-[#ff5e07]">
+              <p className="inline-block text-[12px] font-bold rounded-md px-2 py-[7px] bg-[#ffeedf] text-[#ff5e07]">
                 대기 {store?.waitingCount}팀
               </p>
             </div>
           )}
         </section>
         {/* 주점 정보(위치,운영 시간, 공지사항) */}
-        <section className="pt-5 pb-[28px]">
+        <section className="pt-5 pb-7">
           <div className="mb-6">
             <p className="flex items-center mb-1.5 text-16-regular text-black-80">
               <span className="w-[18px] flex justify-center  mr-1.5">

apps/nowait-user/src/pages/waiting/storeNotice/StoreNoticePage.tsx

@@ -7,13 +7,13 @@ const StoreNoticePage = () => {
   return (
     <div>
       <BackHeader title="공지사항" />
-      <section className="px-5 py-[30px] mt-[48px]">
+      <section className="px-5 py-[30px] mt-12">
         <h1 className="text-title-18-bold text-black-90 mb-4 break-keep">
           {title}
         </h1>
         <p
           dangerouslySetInnerHTML={{ __html: content }}
-          className="text-16-regular text-black-80 !leading-[160%] break-keep"
+          className="text-16-regular text-black-80 leading-[160%]! break-keep"
         ></p>
       </section>
     </div>