Web: Components: fix code-input style and logic

This commit is contained in:
Viktor Fomin 2022-02-03 12:49:27 +03:00
parent 2017efbe07
commit a345b562d3
2 changed files with 10 additions and 2 deletions

View File

@ -34,7 +34,7 @@ const CodeInput = (props) => {
const { key } = e;
const target = e.target;
if (key === "Enter") onEnter();
//if (key === "Enter") onEnter();
if (key === "Backspace") {
if (target.value === "" && target.previousElementSibling !== null) {
@ -46,6 +46,7 @@ const CodeInput = (props) => {
target.value = "";
}
}
onEnter();
};
const handleOnFocus = (e) => {
@ -62,6 +63,7 @@ const CodeInput = (props) => {
}
}
}
onEnter();
e.preventDefault();
};

View File

@ -15,16 +15,18 @@ const InputWrapper = styled.div`
border-radius: 8px;
margin: 0 4px;
text-align: center;
font-size: 2rem;
font-size: 72px;
@media (max-width: 768px) {
height: 76px;
width: 64px;
font-size: 48px;
}
@media (max-width: 414px) {
height: 48px;
width: 40px;
font-size: 32px;
}
&:last-child {
@ -32,6 +34,10 @@ const InputWrapper = styled.div`
}
}
input:focus {
border: 1px solid #3b72a7;
}
hr {
width: 24px;
height: 1px;