zuma/Tapage
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity

Add custom questions + change theme + remove webcam from photo question

Browse source
This commit is contained in:
Lucien Astié 2024-08-10 10:26:00 +02:00
parent 28e1a0c4f8
commit cea7a5bc9d
6 changed files with 225 additions and 139 deletions
Download patch file Download diff file Expand all files Collapse all files

12
app/page.tsx
View file

@ -16,6 +16,7 @@ export default function Home() {
const webcamRef = useRef()
const modal = useRef()
const inputName = useRef()
const inputProfilePicRef = useRef()
function setUsername() {
setName(inputName.current.value)
@ -65,7 +66,7 @@ export default function Home() {
}, [])
return (
<main data-theme="light" className="flex min-h-screen flex-col items-center space-y-16 p-24">
<main data-theme="cupcake" className="flex min-h-screen flex-col items-center space-y-16 p-24">
<dialog ref={modal} className="modal">
<div className="modal-box flex flex-col space-y-4">
<div className="avatar flex flex-col items-center space-y-4">
@ -79,10 +80,11 @@ export default function Home() {
</>
}
{ !showWebcam &&
<>
<div className="flex flex-row space-x-4">
<button className="btn btn-primary" onClick={() => {setShowWebcam(true)}}>Use Webcam</button>
<input type="file" onChange={(e) => {getBase64OfImage(e.target.files[0], (data) => setAndStoreAvatar(data))}} className="file-input w-full max-w-xs"/>
</>
<button className="btn btn-primary" onClick={() => inputProfilePicRef.current.click() }>Select image</button>
<input ref={inputProfilePicRef} type="file" onChange={(e) => {getBase64OfImage(e.target.files[0], (data) => setAndStoreAvatar(data))}} className="hidden"/>
</div>
}
</div>
<label className="form-control w-full">
@ -102,7 +104,7 @@ export default function Home() {
</div>
</div>
</dialog>
<h1 className="text-3xl">Bazaar</h1>
<h1 className="text-6xl font-bold">✨ Tapage ✨</h1>
<div className="flex flex-col space-y-4 items-center">
<div className="avatar">
<div className="w-24 rounded">