generated from worldcoin/minikit-react-template
-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #59 from evgongora/feat/multiple-pages
feat: multiple changes
- Loading branch information
Showing
13 changed files
with
331 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,104 @@ | ||
| "use client"; | ||
|
|
||
| import { Input } from "@/components/ui/input"; | ||
| import { FilledButton } from "@/components/ui/FilledButton"; | ||
| import { useState } from "react"; | ||
|
|
||
| export default function Register() { | ||
| const [formData, setFormData] = useState({ | ||
| name: "", | ||
| lastName: "", | ||
| email: "", | ||
| age: "", | ||
| subscription: false | ||
| }); | ||
|
|
||
| const handleSubmit = (e: React.FormEvent) => { | ||
| e.preventDefault(); | ||
| console.log(formData); | ||
| }; | ||
|
|
||
| return ( | ||
| <div className="flex flex-col items-center"> | ||
| <div className="relative w-screen h-[354px] -mt-4"> | ||
| <div className="w-screen absolute top-0 bg-white rounded-b-[65px] shadow-[inset_-5px_-5px_25px_0px_rgba(134,152,183,1.00),inset_5px_5px_25px_0px_rgba(248,248,246,1.00)]" /> | ||
| <div className="w-screen h-full px-[34px] pt-[104px] pb-[70px] absolute top-0 bg-[#2c5154] rounded-b-[65px] shadow-[21px_38px_64.69999694824219px_3px_rgba(0,0,0,0.25)] overflow-hidden"> | ||
| <div className="max-w-md mx-auto"> | ||
| <h1 className="text-white text-[50px] font-medium font-spaceGrotesk leading-[50px]"> | ||
| Let's get to know a little bit about you... | ||
| </h1> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div className="w-full max-w-md p-4 mt-4"> | ||
| <p className="text-center text-[#232931] text-base font-normal mb-8"> | ||
| Please fill up the following spaces to begin. | ||
| </p> | ||
|
|
||
| <form onSubmit={handleSubmit} className="space-y-6"> | ||
| <div className="space-y-2"> | ||
| <label className="text-[#232931] text-base">Name</label> | ||
| <Input | ||
| type="text" | ||
| value={formData.name} | ||
| onChange={(e) => setFormData({ ...formData, name: e.target.value })} | ||
| className="h-[30px] bg-[#d9d9d9] rounded-[20px] border-0" | ||
| /> | ||
| </div> | ||
|
|
||
| <div className="space-y-2"> | ||
| <label className="text-[#232931] text-base">Last Name</label> | ||
| <Input | ||
| type="text" | ||
| value={formData.lastName} | ||
| onChange={(e) => setFormData({ ...formData, lastName: e.target.value })} | ||
| className="h-[30px] bg-[#d9d9d9] rounded-[20px] border-0" | ||
| /> | ||
| </div> | ||
|
|
||
| <div className="space-y-2"> | ||
| <label className="text-[#232931] text-base">Email</label> | ||
| <Input | ||
| type="email" | ||
| value={formData.email} | ||
| onChange={(e) => setFormData({ ...formData, email: e.target.value })} | ||
| className="h-[30px] bg-[#d9d9d9] rounded-[20px] border-0" | ||
| /> | ||
| </div> | ||
|
|
||
| <div className="space-y-2"> | ||
| <label className="text-[#232931] text-base">Age</label> | ||
| <Input | ||
| type="number" | ||
| value={formData.age} | ||
| onChange={(e) => setFormData({ ...formData, age: e.target.value })} | ||
| className="h-[30px] bg-[#d9d9d9] rounded-[20px] border-0" | ||
| /> | ||
| </div> | ||
|
|
||
| <div className="flex items-center gap-3"> | ||
| <input | ||
| type="checkbox" | ||
| checked={formData.subscription} | ||
| onChange={(e) => setFormData({ ...formData, subscription: e.target.checked })} | ||
| className="w-5 h-5 rounded-full bg-[#d9d9d9]" | ||
| /> | ||
| <label className="text-[#232931] text-base"> | ||
| I would like to receive updates and insights. | ||
| </label> | ||
| </div> | ||
|
|
||
| <FilledButton | ||
| variant="default" | ||
| size="sm" | ||
| className="w-[109px] h-9 bg-[#e36c59] mx-auto" | ||
| type="submit" | ||
| > | ||
| Enter | ||
| </FilledButton> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| "use client"; | ||
|
|
||
| import { useSearchParams, useRouter } from "next/navigation"; | ||
| import { FilledButton } from "@/components/ui/FilledButton"; | ||
|
|
||
| export default function Welcome() { | ||
| const searchParams = useSearchParams(); | ||
| const router = useRouter(); | ||
| const name = searchParams.get("name") || "User"; | ||
|
|
||
| return ( | ||
| <div className="flex flex-col items-center"> | ||
| <div className="relative w-screen min-h-screen bg-[#2c5154]"> | ||
| <div className="w-full max-w-md mx-auto px-[34px] pt-[162px]"> | ||
| <h1 className="text-white text-[45px] font-medium font-spaceGrotesk leading-[50px] mb-8"> | ||
| Welcome {name}! | ||
| </h1> | ||
| <p className="text-white text-[45px] font-medium font-spaceGrotesk leading-[50px]"> | ||
| Your journey toward understanding your true self begins here. | ||
| <br /><br /> | ||
| Let's unlock your potential together! | ||
| </p> | ||
| </div> | ||
|
|
||
| <div className="fixed bottom-12 right-8"> | ||
| <FilledButton | ||
| variant="default" | ||
| size="sm" | ||
| className="w-[132px] h-9 bg-[#e36c59] text-[#eeeeee] text-base font-bold" | ||
| onClick={() => router.push("/")} | ||
| > | ||
| Get Started | ||
| </FilledButton> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
Oops, something went wrong.