Fayorg
/
calendrier-avent
mirror of https://github.com/Fayorg/calendrier-avant.git
1
0
Fork 0
Code Activity

everything

This commit is contained in:
timhaller 2023-12-05 21:43:55 +01:00
parent 0c30f3b43a
commit 20d9c0f11a
2 changed files with 27 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
app/results/page.tsx
View File

@ -4,8 +4,19 @@ import {DayCard} from "@components/custom/dayCard";
export default function Results() { export default function Results() {
return ( return (
<div> <div className={"p-12 h-full w-full"}>
<div className={"h-full w-full bg-green-400 grid auto-cols-max auto-rows-max gap-12 content-start"}>
<DayCard day={1} enabled={true} name={"Michal Polka"}/> <DayCard day={1} enabled={true} name={"Michal Polka"}/>
<DayCard day={1} name={"Michal Polka"}/>
<DayCard day={1} enabled={true} name={"Michal Polka"}/>
<DayCard day={1} name={"Michal Polka"}/>
<DayCard day={1} enabled={true} name={"Michal Polka"}/>
<DayCard day={1} name={"Michal Polka"}/>
<DayCard day={1} enabled={true} name={"Michal Polka"}/>
<DayCard day={1} name={"Michal Polka"}/>
<DayCard day={1} enabled={true} name={"Michal Polka"}/>
<DayCard day={1} name={"Michal Polka"}/>
</div>
</div> </div>
) )
} }

28
components/custom/dayCard.tsx
View File

@ -1,6 +1,6 @@
"use client"; "use client";
import { BellRing, Check } from "lucide-react" import { Lock } from "lucide-react"
import { cn } from "@/lib/utils" import { cn } from "@/lib/utils"
import { Button } from "@/components/ui/button" import { Button } from "@/components/ui/button"
@ -18,28 +18,28 @@ type CardProps = React.ComponentProps<typeof Card>
interface DayCardProps extends CardProps { interface DayCardProps extends CardProps {
day: number, day: number,
name: string, name: string,
enabled: boolean enabled?: boolean | false,
oral?: boolean | true,
}
function say() {
alert("Hello")
} }
export function DayCard({ className, ...props }: DayCardProps) { export function DayCard({ className, ...props }: DayCardProps) {
return ( return (
<Card className={cn("w-[300px]", className)} {...props}> <Card className={cn("w-[300px] h-[300px]", className)} {...props} onClick={say}>
<CardContent className="grid gap-4"> <CardContent className="p-4 gap-4 h-full">
{props.enabled ? {props.enabled ?
<div className="rounded-md p-4"> <div className="rounded-md p-4 h-full flex flex-col items-end bg-blue-500">
<h1 className="text-[100px] font-bold bg-red-700">1</h1> <h1 className="text-[100px] font-bold justify-end">1</h1>
<div className="flex flex-col bg-blue-500"> <div className="flex flex-col">
<h2 className="text-2xl font-bold">Michal Polka</h2> <h2 className="text-2xl font-bold">Michal Polka</h2>
<p className="text-xl">Description</p>
</div> </div>
</div> </div>
: :
<div className="rounded-md p-4"> <div className="rounded-md h-full w-full p-4 grid place-content-center">
<h1 className="text-[100px] font-bold bg-red-700">1</h1> <Lock size={200}/>
<div className="flex flex-col bg-blue-500">
<h2 className="text-2xl font-bold">Michal Polka</h2>
<p className="text-xl">Description</p>
</div>
</div> </div>
} }
</CardContent> </CardContent>