Files
jsonhero-web/app/components/UrlForm.tsx
T
2022-03-01 09:31:09 +00:00

33 lines
1.1 KiB
TypeScript

import { Form } from "remix";
export type UrlFormProps = {
className?: string;
};
export function UrlForm({ className }: UrlFormProps) {
return (
<Form
method="post"
action="/actions/createFromUrl"
className={`${className}`}
>
<div className="flex">
<input
type="text"
name="jsonUrl"
id="jsonUrl"
className="block flex-grow text-base text-slate-200 placeholder:text-slate-300 bg-slate-800 border border-slate-600 rounded-l-sm py-2 px-3 transition duration-300 focus:ring-indigo-500 focus:border-indigo-500"
placeholder="Got a URL to a JSON file? Paste it in here and we'll take care of the rest."
/>
<button
type="submit"
value="Go"
className="inline-flex items-center justify-center px-4 py-2 border border-transparent font-medium rounded-r-sm text-white bg-lime-500 transition hover:bg-lime-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lime-500"
>
Go
</button>
</div>
</Form>
);
}