diff --git a/README.md b/README.md index 697f0b6..b334695 100644 --- a/README.md +++ b/README.md @@ -85,8 +85,7 @@ ## 🌳 κ΅¬ν˜„ View ### 🌿 μƒν’ˆκ΅¬λ§€ View -KakaoTalk_20241130_004952323 - +KakaoTalk_20241130_004952323 ### 🌿 주문상세 View ![FireShot Capture 002 - AliExpress Korea - AND SOPT 35 - localhost](https://github.com/user-attachments/assets/fd11e1e0-f4f9-43ba-b050-e31964d88058) diff --git a/src/components/header/orderHeader/OrderHeaderStyle.ts b/src/components/header/orderHeader/OrderHeaderStyle.ts index c2b4ef7..f3367c1 100644 --- a/src/components/header/orderHeader/OrderHeaderStyle.ts +++ b/src/components/header/orderHeader/OrderHeaderStyle.ts @@ -2,8 +2,9 @@ import { Theme, css } from '@emotion/react'; export const headerStyle = (theme: Theme) => css` display: flex; + gap: 78rem; align-items: center; - justify-content: space-between; + justify-content: center; width: 100%; height: 5.4rem; padding: 0.9rem 5.2rem; diff --git a/src/components/header/productHeader/ProductHeader.tsx b/src/components/header/productHeader/ProductHeader.tsx index 009481b..57ef2a0 100644 --- a/src/components/header/productHeader/ProductHeader.tsx +++ b/src/components/header/productHeader/ProductHeader.tsx @@ -71,48 +71,50 @@ const ProductHeader = () => { {/* μœ ν‹Έλ¦¬ν‹° μ„Ήμ…˜ */} {/* μ•± λ‹€μš΄λ‘œλ“œ */} -
- -
-

AliExpress

-

μ•± λ‹€μš΄λ‘œλ“œ

-
-
- - {/* κ΅­κ°€ 및 톡화 */} -
- -
+
+
+
-

KO/

-

KRW

+

AliExpress

+

μ•± λ‹€μš΄λ‘œλ“œ

- -
-
+ - {/* μ‚¬μš©μž 계정 */} -
togglePopup('info')}> - -
-
-

ν™˜μ˜ν•©λ‹ˆλ‹€!/

-

둜그인/νšŒμ›κ°€μž…

+ {/* κ΅­κ°€ 및 톡화 */} +
+ +
+
+

KO/

+

KRW

+
+
- -
- {/* μΉ΄ν…Œκ³ λ¦¬ νŒμ—… */} - {activePopup === 'info' && } -
+ - {/* μž₯λ°”κ΅¬λ‹ˆ */} -
- -
-

0

-

μž₯λ°”κ΅¬λ‹ˆ

-
-
+ {/* μ‚¬μš©μž 계정 */} +
togglePopup('info')}> + +
+
+

ν™˜μ˜ν•©λ‹ˆλ‹€!/

+

둜그인/νšŒμ›κ°€μž…

+
+ +
+ {/* μΉ΄ν…Œκ³ λ¦¬ νŒμ—… */} + {activePopup === 'info' && } +
+ + {/* μž₯λ°”κ΅¬λ‹ˆ */} +
+ +
+

0

+

μž₯λ°”κ΅¬λ‹ˆ

+
+
+ ); }; diff --git a/src/components/header/productHeader/ProductHeaderStyle.ts b/src/components/header/productHeader/ProductHeaderStyle.ts index 938275b..47ca821 100644 --- a/src/components/header/productHeader/ProductHeaderStyle.ts +++ b/src/components/header/productHeader/ProductHeaderStyle.ts @@ -7,10 +7,10 @@ export const relativeStyle = css` export const headerStyle = (theme: Theme) => css` display: flex; gap: 1.6rem; - justify-content: space-between; + justify-content: center; width: 100vw; height: 5.4rem; - padding: 0.5rem 5.6rem 0.5rem 2.6rem; + padding: 0.5rem 5.6rem; background-color: ${theme.colors.gray10};