[MobileSendPopUp] SHOPTIME-2631

- inputContainer 분리
This commit is contained in:
jiwon93.son
2024-07-01 16:32:01 +09:00
parent ad6e9ef2da
commit 7ba2b1cf04
2 changed files with 17 additions and 7 deletions

View File

@@ -9,7 +9,7 @@ import {
import { useDispatch, useSelector } from "react-redux";
import { off, on } from "@enact/core/dispatcher";
import { Spotlight } from "@enact/spotlight";
import spotlight, { Spotlight } from "@enact/spotlight";
import { SpotlightContainerDecorator } from "@enact/spotlight/SpotlightContainerDecorator";
import { Spottable } from "@enact/spotlight/Spottable";
@@ -45,6 +45,11 @@ const Container = SpotlightContainerDecorator(
"div"
);
const InputContainer = SpotlightContainerDecorator(
{ enterTo: "last-focused" },
"div"
);
const SpottableComponent = Spottable("div");
export default function MobileSendPopUp({
@@ -250,6 +255,7 @@ export default function MobileSendPopUp({
},
})
);
spotlight.focus();
}
};
@@ -530,7 +536,7 @@ export default function MobileSendPopUp({
</div>
<div className={css.smsArea}>
<div className={css.smsContainer}>
<Container className={css.smsNumLayer}>
<InputContainer className={css.smsNumLayer}>
<SpottableComponent
className={css.inputNum}
onClick={handleInputClick}
@@ -538,16 +544,20 @@ export default function MobileSendPopUp({
>
{mobileNumber}
</SpottableComponent>
</InputContainer>
{keyPadOff ? (
<Container>
<HistoryPhoneNumber
handleClickSelect={handleClickSelect}
handleDelete={handleDelete}
recentSentNumber={recentSentNumber}
/>
) : (
<SMSNumKeyPad onKeyDown={numKeypadClicked} />
)}
</Container>
) : (
<Container>
<SMSNumKeyPad onKeyDown={numKeypadClicked} />
</Container>
)}
</div>
<div className={css.instruction}>
<span>

View File

@@ -76,7 +76,7 @@
.smsContainer {
width: 571px;
flex: none;
.flex(@justifyCenter: space-between, @alignCenter: flex-start);
.flex(@justifyCenter: space-between, @alignCenter: flex-start,@direction:column);
.inputNum {
position: relative;
padding: 18px 5px 18px 20px;