optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[모바일 샌드 팝업] qvc일때 원형으로 짤리는부분 수정

Browse Source 
- qvc에서는 border-radius제거.
 - theme item일때 에러나는부분때문에 옵셔널체이닝 처리.
This commit is contained in:
junghoon86.park
2025-12-15 09:43:22 +09:00
parent 42f58bf10c
commit e97172fad5
2 changed files with 105 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx
View File

@@ -4,75 +4,75 @@ import React, {
useMemo, useMemo,
useRef, useRef,
useState, useState,
} from "react"; } from 'react';
import classNames from "classnames"; import classNames from 'classnames';
import { import {
AsYouTypeFormatter, AsYouTypeFormatter,
PhoneNumberFormat, PhoneNumberFormat,
PhoneNumberUtil, PhoneNumberUtil,
} from "google-libphonenumber"; } from 'google-libphonenumber';
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from 'react-redux';
import { off, on } from "@enact/core/dispatcher"; import { off, on } from '@enact/core/dispatcher';
import spotlight, { Spotlight } from "@enact/spotlight"; import spotlight, { Spotlight } from '@enact/spotlight';
import { SpotlightContainerDecorator } from "@enact/spotlight/SpotlightContainerDecorator"; import { SpotlightContainerDecorator } from '@enact/spotlight/SpotlightContainerDecorator';
import { Spottable } from "@enact/spotlight/Spottable"; import { Spottable } from '@enact/spotlight/Spottable';
import defaultImage from "../../../assets/images/img-thumb-empty-144@3x.png"; import defaultImage from '../../../assets/images/img-thumb-empty-144@3x.png';
import { types } from "../../actions/actionTypes"; import { types } from '../../actions/actionTypes';
import { clearSMS, sendSms } from "../../actions/appDataActions"; import { clearSMS, sendSms } from '../../actions/appDataActions';
import { import {
changeLocalSettings, changeLocalSettings,
setHidePopup, setHidePopup,
setShowPopup, setShowPopup,
} from "../../actions/commonActions"; } from '../../actions/commonActions';
import { import {
clearRegisterDeviceInfo, clearRegisterDeviceInfo,
getDeviceAdditionInfo, getDeviceAdditionInfo,
registerDeviceInfo, registerDeviceInfo,
} from "../../actions/deviceActions"; } from '../../actions/deviceActions';
import { import {
clearCurationCoupon, clearCurationCoupon,
setEventIssueReq, setEventIssueReq,
} from "../../actions/eventActions"; } from '../../actions/eventActions';
import { import {
sendLogShopByMobile, sendLogShopByMobile,
sendLogTotalRecommend, sendLogTotalRecommend,
} from "../../actions/logActions"; } from '../../actions/logActions';
import { import {
ACTIVE_POPUP, ACTIVE_POPUP,
LOG_CONTEXT_NAME, LOG_CONTEXT_NAME,
LOG_MESSAGE_ID, LOG_MESSAGE_ID,
LOG_TP_NO, LOG_TP_NO,
} from "../../utils/Config"; } from '../../utils/Config';
import { import {
$L, $L,
decryptPhoneNumber, decryptPhoneNumber,
encryptPhoneNumber, encryptPhoneNumber,
formatLocalDateTime, formatLocalDateTime,
} from "../../utils/helperMethods"; } from '../../utils/helperMethods';
import CustomImage from "../CustomImage/CustomImage"; import CustomImage from '../CustomImage/CustomImage';
import TButton from "../TButton/TButton"; import TButton from '../TButton/TButton';
import TPopUp from "../TPopUp/TPopUp"; import TPopUp from '../TPopUp/TPopUp';
import HistoryPhoneNumber from "./HistoryPhoneNumber/HistoryPhoneNumber"; import HistoryPhoneNumber from './HistoryPhoneNumber/HistoryPhoneNumber';
import css from "./MobileSendPopUp.module.less"; import css from './MobileSendPopUp.module.less';
import PhoneInputSection from "./PhoneInputSection"; import PhoneInputSection from './PhoneInputSection';
import SMSNumKeyPad from "./SMSNumKeyPad"; import SMSNumKeyPad from './SMSNumKeyPad';
const SECRET_KEY = "fy7BTKuM9eeTQqEC9sF3Iw5qG43Aaip"; const SECRET_KEY = 'fy7BTKuM9eeTQqEC9sF3Iw5qG43Aaip';
const Container = SpotlightContainerDecorator( const Container = SpotlightContainerDecorator(
{ enterTo: "last-focused" }, { enterTo: 'last-focused' },
"div" 'div'
); );
const InputContainer = SpotlightContainerDecorator( const InputContainer = SpotlightContainerDecorator(
{ enterTo: "last-focused" }, { enterTo: 'last-focused' },
"div" 'div'
); );
const SpottableComponent = Spottable("div"); const SpottableComponent = Spottable('div');
export default function MobileSendPopUp({ export default function MobileSendPopUp({
open, open,
@@ -116,39 +116,41 @@ export default function MobileSendPopUp({
const popupVisible = useSelector((state) => state.common.popup.popupVisible); const popupVisible = useSelector((state) => state.common.popup.popupVisible);
const nowMenu = useSelector((state) => state.common.menu.nowMenu); const nowMenu = useSelector((state) => state.common.menu.nowMenu);
const entryMenu = useSelector((state) => state.common.menu.entryMenu); const entryMenu = useSelector((state) => state.common.menu.entryMenu);
const partnerNm = useSelector((state) => state.main.productData?.patncNm);
const [inputDisabled, setInputDisabled] = useState(true); const [inputDisabled, setInputDisabled] = useState(true);
const [mobileNumber, setMobileNumber] = useState(""); const [mobileNumber, setMobileNumber] = useState('');
const [recentSentNumber, setRecentSentNumber] = useState([]); const [recentSentNumber, setRecentSentNumber] = useState([]);
const [keyPadOff, setKeyPadOff] = useState(false); const [keyPadOff, setKeyPadOff] = useState(false);
const [smsRetCode, setSmsRetCode] = useState(undefined); const [smsRetCode, setSmsRetCode] = useState(undefined);
const agreeBtnClickedRef = useRef(false); const agreeBtnClickedRef = useRef(false);
const deviceCountryCode = httpHeader["X-Device-Country"]; const deviceCountryCode = httpHeader['X-Device-Country'];
const mobileSendPopUpSpotlightId = useMemo(() => { const mobileSendPopUpSpotlightId = useMemo(() => {
return !keyPadOff && recentSentNumber.length <= 0 return !keyPadOff && recentSentNumber.length <= 0
? "keypad-number-1" ? 'keypad-number-1'
: "agreeAndSend"; : 'agreeAndSend';
}, [keyPadOff, recentSentNumber]); }, [keyPadOff, recentSentNumber]);
const getMaxNum = useCallback((_deviceCountryCode) => { const getMaxNum = useCallback((_deviceCountryCode) => {
if (_deviceCountryCode === "DE" || _deviceCountryCode === "GB") { if (_deviceCountryCode === 'DE' || _deviceCountryCode === 'GB') {
return 11; return 11;
} else if (_deviceCountryCode === "KR") { } else if (_deviceCountryCode === 'KR') {
return 12; return 12;
} else return 10; } else return 10;
}, []); }, []);
const MSG_SUCCESS_SENT = $L("Text Send to") + " " + mobileNumber; const MSG_SUCCESS_SENT = $L('Text Send to') + ' ' + mobileNumber;
const MSG_SEND_LINK = $L("Send a purchase link for this item via SMS"); const MSG_SEND_LINK = $L('Send a purchase link for this item via SMS');
const handleClickSelect = (_phoneNumber) => { const handleClickSelect = (_phoneNumber) => {
setKeyPadOff((state) => !state); setKeyPadOff((state) => !state);
setMobileNumber(_phoneNumber); setMobileNumber(_phoneNumber);
setTimeout(() => { setTimeout(() => {
Spotlight.focus("keypad-number-1"); Spotlight.focus('keypad-number-1');
}, 0); }, 0);
}; };
@@ -161,9 +163,9 @@ export default function MobileSendPopUp({
const getRawPhoneNumber = useCallback( const getRawPhoneNumber = useCallback(
(key) => { (key) => {
let rawPhoneNumber = `${mobileNumber}${key}`.replace(/\D/g, ""); let rawPhoneNumber = `${mobileNumber}${key}`.replace(/\D/g, '');
if (rawPhoneNumber.length === getMaxNum(deviceCountryCode)) { if (rawPhoneNumber.length === getMaxNum(deviceCountryCode)) {
Spotlight.focus("agreeAndSend"); Spotlight.focus('agreeAndSend');
} }
// 테스트용: 12자리까지 허용 // 테스트용: 12자리까지 허용
if (rawPhoneNumber.length > 12) { if (rawPhoneNumber.length > 12) {
@@ -182,11 +184,11 @@ export default function MobileSendPopUp({
numberProto, numberProto,
PhoneNumberFormat.NATIONAL PhoneNumberFormat.NATIONAL
); );
if (deviceCountryCode === "RU" && rawPhoneNumber.startsWith("8")) { if (deviceCountryCode === 'RU' && rawPhoneNumber.startsWith('8')) {
rawPhoneNumber = rawPhoneNumber.substring(1); rawPhoneNumber = rawPhoneNumber.substring(1);
} }
} else { } else {
let formattedNumber = ""; let formattedNumber = '';
for (let i = 0; i < rawPhoneNumber.length; i++) { for (let i = 0; i < rawPhoneNumber.length; i++) {
formattedNumber = asYouTypeFormatter.inputDigit( formattedNumber = asYouTypeFormatter.inputDigit(
@@ -206,7 +208,7 @@ export default function MobileSendPopUp({
); );
const getBackspaceRawNumber = useCallback(() => { const getBackspaceRawNumber = useCallback(() => {
let rawPhoneNumber = mobileNumber.replace(/\D/g, "").slice(0, -1); let rawPhoneNumber = mobileNumber.replace(/\D/g, '').slice(0, -1);
const phoneUtil = PhoneNumberUtil.getInstance(); const phoneUtil = PhoneNumberUtil.getInstance();
const asYouTypeFormatter = new AsYouTypeFormatter(deviceCountryCode); const asYouTypeFormatter = new AsYouTypeFormatter(deviceCountryCode);
@@ -221,7 +223,7 @@ export default function MobileSendPopUp({
PhoneNumberFormat.NATIONAL PhoneNumberFormat.NATIONAL
); );
} else { } else {
let formattedNumber = ""; let formattedNumber = '';
for (let i = 0; i < rawPhoneNumber.length; i++) { for (let i = 0; i < rawPhoneNumber.length; i++) {
formattedNumber = asYouTypeFormatter.inputDigit( formattedNumber = asYouTypeFormatter.inputDigit(
@@ -242,7 +244,7 @@ export default function MobileSendPopUp({
(ev) => { (ev) => {
if (ev && ev.key >= 0 && ev.key <= 9) { if (ev && ev.key >= 0 && ev.key <= 9) {
getRawPhoneNumber(ev.key); getRawPhoneNumber(ev.key);
} else if (ev.key === "Backspace") { } else if (ev.key === 'Backspace') {
getBackspaceRawNumber(); getBackspaceRawNumber();
} }
}, },
@@ -250,9 +252,9 @@ export default function MobileSendPopUp({
); );
useEffect(() => { useEffect(() => {
on("keydown", handleKeydown); on('keydown', handleKeydown);
return () => { return () => {
off("keydown", handleKeydown); off('keydown', handleKeydown);
}; };
}, [handleKeydown]); }, [handleKeydown]);
@@ -264,7 +266,7 @@ export default function MobileSendPopUp({
useEffect(() => { useEffect(() => {
const timer = setTimeout(() => const timer = setTimeout(() =>
setInputDisabled(mobileSendPopUpSpotlightId === "keypad-number-1") setInputDisabled(mobileSendPopUpSpotlightId === 'keypad-number-1')
); );
return () => clearTimeout(timer); return () => clearTimeout(timer);
@@ -277,16 +279,16 @@ export default function MobileSendPopUp({
setMobileNumber(recentSentNumber[0]); setMobileNumber(recentSentNumber[0]);
} else { } else {
setKeyPadOff(false); setKeyPadOff(false);
setMobileNumber(""); setMobileNumber('');
} }
} }
}, [recentSentNumber]); }, [recentSentNumber]);
const numKeypadClicked = useCallback( const numKeypadClicked = useCallback(
(key) => { (key) => {
if (key === "clear") { if (key === 'clear') {
setMobileNumber(""); setMobileNumber('');
} else if (key == "backspace") { } else if (key == 'backspace') {
getBackspaceRawNumber(); getBackspaceRawNumber();
} else { } else {
getRawPhoneNumber(key); getRawPhoneNumber(key);
@@ -315,7 +317,7 @@ export default function MobileSendPopUp({
}; };
const handleAgreeSendClick = useCallback(() => { const handleAgreeSendClick = useCallback(() => {
let naturalNumber = mobileNumber.replace(/\D/g, ""); let naturalNumber = mobileNumber.replace(/\D/g, '');
// 테스트용: 길이 체크를 더 유연하게 (10자리 또는 11자리 허용) // 테스트용: 길이 체크를 더 유연하게 (10자리 또는 11자리 허용)
if ( if (
@@ -327,8 +329,8 @@ export default function MobileSendPopUp({
return; return;
} }
if (deviceCountryCode === "KR") { if (deviceCountryCode === 'KR') {
naturalNumber = "82" + naturalNumber; naturalNumber = '82' + naturalNumber;
} }
if (recentSentNumber && recentSentNumber.length > 0) { if (recentSentNumber && recentSentNumber.length > 0) {
@@ -394,22 +396,22 @@ export default function MobileSendPopUp({
}; };
// 호텔일 경우 날려야 하는 경우 // 호텔일 경우 날려야 하는 경우
if (smsTpCd === "APP00205") { if (smsTpCd === 'APP00205') {
params = { ...params, hotelId, hotelNm, hotelDtlUrl, curationId }; params = { ...params, hotelId, hotelNm, hotelDtlUrl, curationId };
} }
if (smsTpCd === "APP00204") { if (smsTpCd === 'APP00204') {
params = { ...params, curationId }; params = { ...params, curationId };
} }
dispatch(sendSms(params)); dispatch(sendSms(params));
} }
// EVT00101 & APP00207(welcome) EVT00103 & APP00209 (welcome+Prizes) : smsTpCd 값을 받지 않음 // EVT00101 & APP00207(welcome) EVT00103 & APP00209 (welcome+Prizes) : smsTpCd 값을 받지 않음
if (evntTpCd === "EVT00101" || evntTpCd === "EVT00103") { if (evntTpCd === 'EVT00101' || evntTpCd === 'EVT00103') {
dispatch( dispatch(
registerDeviceInfo({ registerDeviceInfo({
evntTpCd, evntTpCd,
evntId, evntId,
evntApplcnFlag: "Y", evntApplcnFlag: 'Y',
entryMenu: "TermsPop", entryMenu: 'TermsPop',
mbphNo: naturalNumber, mbphNo: naturalNumber,
}) })
); );
@@ -434,7 +436,7 @@ export default function MobileSendPopUp({
onClose(); onClose();
dispatch(setShowPopup(ACTIVE_POPUP.smsPopup)); dispatch(setShowPopup(ACTIVE_POPUP.smsPopup));
setTimeout(() => Spotlight.focus("agreeAndSend")); setTimeout(() => Spotlight.focus('agreeAndSend'));
}, },
[dispatch, smsRetCode] [dispatch, smsRetCode]
); );
@@ -450,7 +452,7 @@ export default function MobileSendPopUp({
curationCouponSuccess === 0 curationCouponSuccess === 0
) { ) {
const logParams = { const logParams = {
status: "send", status: 'send',
nowMenu: nowMenu, nowMenu: nowMenu,
partner: patncNm ?? shopByMobileLogRef?.current?.patncNm, partner: patncNm ?? shopByMobileLogRef?.current?.patncNm,
productId: prdtId ?? shopByMobileLogRef?.current?.prdtId, productId: prdtId ?? shopByMobileLogRef?.current?.prdtId,
@@ -465,8 +467,8 @@ export default function MobileSendPopUp({
...shopByMobileLogRef.current, ...shopByMobileLogRef.current,
locDt: formatLocalDateTime(new Date()), locDt: formatLocalDateTime(new Date()),
logTpNo: LOG_TP_NO.SHOP_BY_MOBILE.AGREE_AND_SEND, logTpNo: LOG_TP_NO.SHOP_BY_MOBILE.AGREE_AND_SEND,
mbphNoFlag: "Y", mbphNoFlag: 'Y',
trmsAgrFlag: "Y", trmsAgrFlag: 'Y',
}; };
dispatch(sendLogShopByMobile(params)); dispatch(sendLogShopByMobile(params));
@@ -497,24 +499,24 @@ export default function MobileSendPopUp({
}, [dispatch]); }, [dispatch]);
const getSmsErrorMsg = useMemo(() => { const getSmsErrorMsg = useMemo(() => {
const SMS_ERROR_502 = $L("The event information has not been registered"); const SMS_ERROR_502 = $L('The event information has not been registered');
const SMS_ERROR_903 = $L("You have exceeded the daily text limit."); const SMS_ERROR_903 = $L('You have exceeded the daily text limit.');
const SMS_ERROR_904 = $L( const SMS_ERROR_904 = $L(
"You have exceeded the text limit for this product." 'You have exceeded the text limit for this product.'
); );
const SMS_ERROR_905 = $L( const SMS_ERROR_905 = $L(
"This number is currently blocked. To receive a message, please send UNSTOP to the number below. 07860 064195" 'This number is currently blocked. To receive a message, please send UNSTOP to the number below. 07860 064195'
); );
const SMS_ERROR_906 = $L("Sorry. This item is sold out."); const SMS_ERROR_906 = $L('Sorry. This item is sold out.');
const SMS_ERROR_600 = $L("This device had received first time coupon."); const SMS_ERROR_600 = $L('This device had received first time coupon.');
const SMS_ERROR_601 = $L("There is no coupon."); const SMS_ERROR_601 = $L('There is no coupon.');
const SMS_ERROR_900 = $L("Failed to send text to {mobileNumber}").replace( const SMS_ERROR_900 = $L('Failed to send text to {mobileNumber}').replace(
"{mobileNumber}", '{mobileNumber}',
mobileNumber mobileNumber
); );
const SMS_ERROR_907 = $L( const SMS_ERROR_907 = $L(
"Only {length} digits is permitted. Please check again" 'Only {length} digits is permitted. Please check again'
).replace("{length}", getMaxNum(deviceCountryCode)); ).replace('{length}', getMaxNum(deviceCountryCode));
switch (smsRetCode) { switch (smsRetCode) {
case 502: case 502:
@@ -542,12 +544,12 @@ export default function MobileSendPopUp({
const getEvntErrorMsg = useMemo(() => { const getEvntErrorMsg = useMemo(() => {
if (curationCouponSuccess === 600) { if (curationCouponSuccess === 600) {
return $L("This device had received first time coupon."); return $L('This device had received first time coupon.');
} else if (curationCouponSuccess === 601) { } else if (curationCouponSuccess === 601) {
return $L("There is no coupon."); return $L('There is no coupon.');
} else { } else {
return $L("Failed to sent text to {mobileNumber}").replace( return $L('Failed to sent text to {mobileNumber}').replace(
"{mobileNumber}", '{mobileNumber}',
mobileNumber mobileNumber
); );
} }
@@ -571,7 +573,7 @@ export default function MobileSendPopUp({
regDeviceInfoRetCode === undefined && regDeviceInfoRetCode === undefined &&
curationCouponSuccess === undefined && ( curationCouponSuccess === undefined && (
<TPopUp <TPopUp
kind={"mobileSendPopup"} kind={'mobileSendPopup'}
className={css.container} className={css.container}
open={open} open={open}
onClose={onClose} onClose={onClose}
@@ -602,7 +604,10 @@ export default function MobileSendPopUp({
<div className={css.headerTopRow}> <div className={css.headerTopRow}>
{brandLogo && ( {brandLogo && (
<img <img
className={css.headerTopRow__brandLogo} className={classNames(
css.headerTopRow__brandLogo,
partnerNm === 'QVC' && css.headerTopRow__brandLogo__qvc
)}
src={brandLogo} src={brandLogo}
alt="Brand" alt="Brand"
/> />
@@ -639,8 +644,8 @@ export default function MobileSendPopUp({
onClick={handleInputClick} onClick={handleInputClick}
spotlightDisabled={inputDisabled} spotlightDisabled={inputDisabled}
> >
{deviceCountryCode && deviceCountryCode === "RU" && ( {deviceCountryCode && deviceCountryCode === 'RU' && (
<span className={css.rucInput}>{"+7 "}</span> <span className={css.rucInput}>{'+7 '}</span>
)} )}
<span>{mobileNumber}</span> <span>{mobileNumber}</span>
</SpottableComponent> </SpottableComponent>
@@ -662,10 +667,10 @@ export default function MobileSendPopUp({
<span <span
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: `${$L( __html: `${$L(
"By clicking Agree and Send button, I agree that LGE may collect and store my cell phone number to send text messages as I requested, for data analysis and for feature-enhancement purposes. By entering my cell phone number, I agree to receive messages from LGE with information on how to purchase the product I selected. Message and data rates may apply." 'By clicking Agree and Send button, I agree that LGE may collect and store my cell phone number to send text messages as I requested, for data analysis and for feature-enhancement purposes. By entering my cell phone number, I agree to receive messages from LGE with information on how to purchase the product I selected. Message and data rates may apply.'
)}`, )}`,
}} }}
className={deviceCountryCode === "RU" && css.instructionRu} className={deviceCountryCode === 'RU' && css.instructionRu}
/> />
)} )}
</div> </div>
@@ -698,11 +703,11 @@ export default function MobileSendPopUp({
<Container className={css.container__btnContainer}> <Container className={css.container__btnContainer}>
<TButton <TButton
onClick={handleAgreeSendClick} onClick={handleAgreeSendClick}
spotlightId={"agreeAndSend"} spotlightId={'agreeAndSend'}
> >
{$L("Agree and Send")} {$L('Agree and Send')}
</TButton> </TButton>
<TButton onClick={onClose}>{$L("Cancel")}</TButton> <TButton onClick={onClose}>{$L('Cancel')}</TButton>
</Container> </Container>
</TPopUp> </TPopUp>
)} )}
@@ -714,7 +719,7 @@ export default function MobileSendPopUp({
text={smsTpCd ? getSmsErrorMsg : getEvntErrorMsg} text={smsTpCd ? getSmsErrorMsg : getEvntErrorMsg}
onClick={_onClose} onClick={_onClose}
hasButton hasButton
button1Text={$L("OK")} button1Text={$L('OK')}
/> />
)} )}
{(smsRetCode === 0 || {(smsRetCode === 0 ||
@@ -727,7 +732,7 @@ export default function MobileSendPopUp({
text={MSG_SUCCESS_SENT} text={MSG_SUCCESS_SENT}
onClick={onClose} onClick={onClose}
hasButton hasButton
button1Text={$L("OK")} button1Text={$L('OK')}
/> />
)} )}
</> </>

15
com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.module.less
View File

@@ -1,5 +1,5 @@
@import "../../style/CommonStyle.module.less"; @import '../../style/CommonStyle.module.less';
@import "../../style/utils.module.less"; @import '../../style/utils.module.less';
/* 🆕 [NEW] Figma 디자인용 타이틀 헤드 스타일 */ /* 🆕 [NEW] Figma 디자인용 타이틀 헤드 스타일 */
.titleHead { .titleHead {
@@ -14,7 +14,7 @@
text-align: left; // center → left text-align: left; // center → left
color: black; color: black;
font-size: 32px; font-size: 32px;
font-family: "LG Smart UI"; font-family: 'LG Smart UI';
font-weight: 700; font-weight: 700;
line-height: 42px; line-height: 42px;
word-wrap: break-word; word-wrap: break-word;
@@ -32,12 +32,15 @@
height: 50px; height: 50px;
margin-right: 15px; // TV 호환: gap 대신 margin 사용 margin-right: 15px; // TV 호환: gap 대신 margin 사용
border-radius: 100%; border-radius: 100%;
&.headerTopRow__brandLogo__qvc {
border-radius: 0;
}
} }
.headerTopRow__productId { .headerTopRow__productId {
color: #808080; color: #808080;
font-size: 24px; font-size: 24px;
font-family: "LG Smart UI"; font-family: 'LG Smart UI';
font-weight: 600; font-weight: 600;
line-height: 18px; line-height: 18px;
word-wrap: break-word; word-wrap: break-word;
@@ -57,7 +60,7 @@
top: 0; top: 0;
z-index: 0; z-index: 0;
content: ""; content: '';
} }
display: flex; display: flex;
> .container__header__productImg, > .container__header__productImg,
@@ -178,7 +181,7 @@
.flex { .flex {
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-wrap:wrap; flex-wrap: wrap;
} }
.instruction { .instruction {
width: 492.5px; // 고정 너비 width: 492.5px; // 고정 너비