verified otp and made curry underline to straight line

This commit was merged in pull request #66.
This commit is contained in:
victorAnumudu
2023-02-27 14:44:52 +01:00
parent 77be53424a
commit 62fe0dabec
4 changed files with 156 additions and 10 deletions
@@ -1,6 +1,6 @@
import React, { useEffect } from "react";
export default function Otp() {
export default function Otp({handleChange, value}) {
useEffect(() => {
const otp = document.querySelector("#otp-inputs");
// eslint-disable-next-line no-restricted-syntax
@@ -25,6 +25,9 @@ export default function Otp() {
type="text"
maxLength={1}
id="otp"
name='value_one'
value={value.value_one}
onChange={handleChange}
/>
</div>
<div className="input-wrapper border border-light-purple dark:border-[#5356fb29] sm:w-14 sm:h-14 w-12 h-12 rounded-[50px] overflow-hidden relative ">
@@ -33,6 +36,9 @@ export default function Otp() {
type="text"
maxLength={1}
id="otp"
name='value_two'
value={value.value_two}
onChange={handleChange}
/>
</div>
<div className="input-wrapper border border-light-purple dark:border-[#5356fb29] sm:w-14 sm:h-14 w-12 h-12 rounded-[50px] overflow-hidden relative ">
@@ -41,6 +47,9 @@ export default function Otp() {
type="text"
maxLength={1}
id="otp"
name='value_three'
value={value.value_three}
onChange={handleChange}
/>
</div>
<div className="input-wrapper border border-light-purple dark:border-[#5356fb29] sm:w-14 sm:h-14 w-12 h-12 rounded-[50px] overflow-hidden relative ">
@@ -49,6 +58,9 @@ export default function Otp() {
type="text"
maxLength={1}
id="otp"
name='value_four'
value={value.value_four}
onChange={handleChange}
/>
</div>
<div className="input-wrapper border border-light-purple dark:border-[#5356fb29] sm:w-14 sm:h-14 w-12 h-12 rounded-[50px] overflow-hidden relative ">
@@ -57,6 +69,9 @@ export default function Otp() {
type="text"
maxLength={1}
id="otp"
name='value_five'
value={value.value_five}
onChange={handleChange}
/>
</div>
<div className="input-wrapper border border-light-purple dark:border-[#5356fb29] sm:w-14 sm:h-14 w-12 h-12 rounded-[50px] overflow-hidden relative ">
@@ -65,6 +80,9 @@ export default function Otp() {
type="text"
maxLength={1}
id="otp"
name='value_six'
value={value.value_six}
onChange={handleChange}
/>
</div>
</div>