Files
kolaytercih/src/components/ui/sonner.tsx
bilalgursen f4df52000b feat(ux): /sonuc'a tek cümlelik cevap, liste durumu ve kilometre taşları
- 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>
2026-09-24 01:23:20 +03:00

55 lines
1.5 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"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 }