Merge branch 'develop' of https://github.com/URECA-PODONG/FrontEnd in…

…to feat/#4
URECA-PODONG · Nov 6, 2024 · 0c62a4b · 0c62a4b
2 parents 4f20e4f + 9f13a61
commit 0c62a4b
Showing 1 changed file with 16 additions and 23 deletions.
diff --git a/src/pages/PaymentPage/Payment.jsx b/src/pages/PaymentPage/Payment.jsx
@@ -160,20 +160,12 @@ const Payment = () => {
             <label>주소</label>
           </AddressLabelWrapper>
           <AddressInputWrapper>
-            <PostSearchContainer placeholder="우편번호" value={zoneCode} readOnly />
+            <PostSearchContainer placeholder="우편번호" value={zoneCode} readOnly style={{ display: 'none' }} />
             <SearchAddressButton onClick={openPostCode}>주소변경</SearchAddressButton>
           </AddressInputWrapper>
           <AddressInputWrapper>
             <StyledInput placeholder="" value={address} onChange={e => setAddress(e.target.value)} required />
           </AddressInputWrapper>
-          <AddressInputWrapper>
-            <StyledInput
-              placeholder=""
-              value={detailedAddress}
-              onChange={e => setDetailedAddress(e.target.value)}
-              required
-            />
-          </AddressInputWrapper>
         </AddressInputGroup>
 
         <DeliveryMethodInputGroup>
@@ -402,14 +394,15 @@ const StyledInput = styled.input`
   border-radius: 5px;
   font-size: 11px;
 `;
+
+const AddressInputWrapper = styled.div`
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  position: relative;
+`;
 
-const SearchAddressButton = styled.button`
-  position: absolute;
-  width: 70px;
-  height: 30px;
-  top: 20px;
-  right: 15px;
-  transform: translateY(-50%);
+  const SearchAddressButton = styled.button`
   background-color: #ffefef;
   color: #ff6e00;
   border: none;
@@ -419,6 +412,7 @@ const SearchAddressButton = styled.button`
   font-weight: bold;
   padding: 5px 10px;
   transition: background-color 0.3s;
+  margin-left: auto;
 
   &:hover {
     background-color: #ffd3d3;
@@ -438,12 +432,15 @@ const DeliveryNoteInputGroup = styled.div`
 `;
 
 const AddressLabelWrapper = styled.div`
-  margin-bottom: 5px;
+  flex-shrink: 0;
   font-weight: bold;
+  margin-right: 10px;
+  display: flex;
+  align-items: center;
 `;
 
 const DeliveryMethodLabelWrapper = styled.div`
-  margin-bottom: 5px;
+  margin-right : auto;
   font-weight: bold;
 `;
 
@@ -452,11 +449,7 @@ const DeliveryNoteLabelWrapper = styled.div`
   font-weight: bold;
 `;
 
-const AddressInputWrapper = styled.div`
-  display: flex;
-  align-items: center;
-  position: relative;
-`;
+
 
 const DeliveryMethodInputWrapper = styled.div`
   display: flex;