- Sayfanın h1'i yoktu: "Sıralamanla açılan programlar" + "85.000. sıradasın (Sayısal). 4.760 program sana açık" başlığı en üstte; tadımlık altında (375 px'te hâlâ ilk ekranda, 474 px) - Başlık altında liste durumu: boşsa + ipucu, doluysa "Listende 3/24 program · 21 yer kaldı" düğmesi çekmeceyi açar - + ile ilk programda ve 24/24'te tek seferlik sakin onay; liste doluyken ne yapılacağını söyleyen mesaj - Bildirimler 16 px başlık, okunur açıklama, sitenin köşesiyle - Başlık ve tablo aynı sorguyu React cache ile paylaşıyor Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
55 lines
1.5 KiB
TypeScript
55 lines
1.5 KiB
TypeScript
"use client"
|
||
|
||
import { useTheme } from "next-themes"
|
||
import { Toaster as Sonner, type ToasterProps } from "sonner"
|
||
import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon } from "lucide-react"
|
||
|
||
const Toaster = ({ ...props }: ToasterProps) => {
|
||
const { theme = "system" } = useTheme()
|
||
|
||
return (
|
||
<Sonner
|
||
theme={theme as ToasterProps["theme"]}
|
||
className="toaster group"
|
||
icons={{
|
||
success: (
|
||
<CircleCheckIcon className="size-4" />
|
||
),
|
||
info: (
|
||
<InfoIcon className="size-4" />
|
||
),
|
||
warning: (
|
||
<TriangleAlertIcon className="size-4" />
|
||
),
|
||
error: (
|
||
<OctagonXIcon className="size-4" />
|
||
),
|
||
loading: (
|
||
<span className="block size-2.5 animate-pulse rounded-full bg-current" />
|
||
),
|
||
}}
|
||
style={
|
||
{
|
||
"--normal-bg": "var(--popover)",
|
||
"--normal-text": "var(--popover-foreground)",
|
||
"--normal-border": "var(--border)",
|
||
"--border-radius": "var(--radius)",
|
||
} as React.CSSProperties
|
||
}
|
||
toastOptions={{
|
||
// Şişko ve sade (DESIGN.md §10): başlık 16 px, açıklama okunur
|
||
// koyulukta; kutu sitenin kart köşesiyle aynı.
|
||
classNames: {
|
||
toast: "cn-toast !rounded-2xl !border-slate-200 !p-4 !shadow-lg",
|
||
title: "!text-base !font-semibold !text-slate-900",
|
||
description: "!text-sm !leading-relaxed !text-slate-600",
|
||
icon: "!text-primary",
|
||
},
|
||
}}
|
||
{...props}
|
||
/>
|
||
)
|
||
}
|
||
|
||
export { Toaster }
|