Modal Stable / Login View

components/ui/Input/Input.module.css

@@ -0,0 +1,4 @@
+.root {
+  @apply focus:outline-none bg-primary focus:shadow-outline-gray border-none py-2 
+  px-6 w-full appearance-none transition duration-150 ease-in-out placeholder-accents-5 pr-10;
+}

components/ui/Input/Input.tsx

@@ -0,0 +1,25 @@
+import cn from 'classnames'
+import s from './Input.module.css'
+import React, { InputHTMLAttributes } from 'react'
+
+export interface Props extends InputHTMLAttributes<HTMLInputElement> {
+  className?: string
+  onChange?: (...args: any[]) => any
+}
+
+const Input: React.FC<Props> = (props) => {
+  const { className, children, onChange, ...rest } = props
+
+  const rootClassName = cn(s.root, {}, className)
+
+  const handleOnChange = (e: any) => {
+    if (onChange) {
+      onChange(e.target.value)
+    }
+    return null
+  }
+
+  return <input className={rootClassName} onChange={handleOnChange} {...rest} />
+}
+
+export default Input

components/ui/Input/index.ts

@@ -0,0 +1 @@
+export { default } from './Input'