IlyaSobolev/DocSpace-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Components: fix code-input style and logic

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/asc-web-components/code-input/index.js
View File

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

8
packages/asc-web-components/code-input/styled-code-input.js
View File

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