30 lines
872 B
TypeScript
30 lines
872 B
TypeScript
|
import React from "react";
|
||
|
|
|
||
|
|
interface InputProps {
|
||
|
|
id: string;
|
||
|
|
onChange: any;
|
||
|
|
value: string;
|
||
|
|
label: string;
|
||
|
|
type?: string;
|
||
|
|
}
|
||
|
|
|
||
|
|
const Input: React.FC<InputProps> = ({
|
||
|
|
id,
|
||
|
|
onChange,
|
||
|
|
value,
|
||
|
|
label,
|
||
|
|
type
|
||
|
|
}) => {
|
||
|
|
return (
|
||
|
|
<div className="relative">
|
||
|
|
<input type={type} onChange={onChange} value={value} id={id} className="block rounded-md px-6 pt-6 pb-1 w-full text-md text-white bg-neutral-700 appearance-none focus:outline focus:ring-0 peer"
|
||
|
|
placeholder=" "
|
||
|
|
/>
|
||
|
|
<label className="absolute text-md text-zinc-400 duration-150 transform -translate-y-3 scale-75 top-4 z-10 origin-[0] left-6 peer-placeholder-show:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-3" htmlFor={id}>
|
||
|
|
{label}
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Input;
|