Feature/fix event name input (#92)

* [fix] Adjust styles for back button and input layout * [chore] Apply Prettier formatting * [HOTFIX] Fix Stabilize input form width and back button size * [fix] Adjust event name input and delete button styles * [fix] Update page.tsx
Team-pingping · Nov 28, 2024 · 624c3b9 · 624c3b9
1 parent 98aaaea
commit 624c3b9
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 13 deletions.
diff --git a/fe/src/app/eventcreate-page/components/EventNameInput.tsx b/fe/src/app/eventcreate-page/components/EventNameInput.tsx
@@ -77,14 +77,21 @@ function EventNameInput({
           <button
             type="button"
             onClick={handleClear}
-            className="w-5 h-5 cursor-pointer"
+            className="relative flex justify-center items-center"
+            style={{
+              width: "18px",
+              height: "18px",
+              minWidth: "18px",
+              minHeight: "18px",
+            }}
             aria-label="이름 삭제"
           >
             <Image
               src="/svg/delete.svg"
               alt="삭제 아이콘"
-              width={24}
-              height={24}
+              width={18}
+              height={18}
+              className="object-contain"
             />
           </button>
         )}

diff --git a/fe/src/app/eventcreate-page/components/LocationInput.tsx b/fe/src/app/eventcreate-page/components/LocationInput.tsx
@@ -35,8 +35,8 @@ function LocationInput({
         <Image
           src="/images/Search.svg"
           alt="돋보기 아이콘"
-          width={24}
-          height={24}
+          width={20}
+          height={20}
           className="mr-3"
         />
         <input

diff --git a/fe/src/app/eventcreate-page/components/SearchResultsItem.tsx b/fe/src/app/eventcreate-page/components/SearchResultsItem.tsx
@@ -59,8 +59,8 @@ function SearchResultItem({
         <Image
           src="/svg/LocationPin.svg"
           alt="위치 핀"
-          width={24}
-          height={24}
+          width={18}
+          height={22}
         />
       </div>
       <div className="text-base font-medium font-['Pretendard'] text-gray-800 leading-none truncate pt-1">

diff --git a/fe/src/app/eventcreate-page/location-search/page.tsx b/fe/src/app/eventcreate-page/location-search/page.tsx
@@ -92,7 +92,6 @@ function LocationSearch() {
   return (
     <div className="flex flex-col items-center">
       <header className="fixed top-0 left-1/2 transform -translate-x-1/2 w-[360px] h-[56px] bg-white flex items-center px-4 z-10">
-        {/* 뒤로가기 버튼 */}
         <div className="flex items-center">
           <button
             type="button"
@@ -103,7 +102,7 @@ function LocationSearch() {
               height: "24px",
               minWidth: "24px",
               minHeight: "24px",
-            }} // 크기 고정
+            }}
           >
             <Image
               src="/images/ArrowBack.svg"
@@ -115,15 +114,14 @@ function LocationSearch() {
           </button>
         </div>
 
-        {/* 입력 폼 */}
-        <div className="flex items-center w-full h-[48px] px-4 bg-[#f7f7f7] rounded-lg ml-2">
+        <div className="flex items-center w-[292px] h-[48px] px-4 bg-[#f7f7f7] rounded-lg ml-2">
           <input
             type="text"
             ref={inputRef}
             value={location}
             onChange={handleSearch}
             placeholder="장소를 입력해주세요"
-            className="bg-transparent border-none flex-grow text-[#2c2c2c] text-base font-medium font-['Pretendard'] leading-normal outline-none"
+            className="bg-transparent border-none w-full text-[#2c2c2c] text-base font-medium font-['Pretendard'] leading-normal outline-none"
           />
           {location && (
             <div
@@ -135,7 +133,7 @@ function LocationSearch() {
                 height: "18px",
                 minWidth: "18px",
                 minHeight: "18px",
-              }} // 삭제 버튼 크기 고정
+              }}
               onClick={handleClearLocation}
               onKeyDown={(e) => {
                 if (e.key === "Enter") handleClearLocation();