From 3394e2e04ac5dbedc9d424ec57acccbe9c89fb9e Mon Sep 17 00:00:00 2001 From: bilalgursen Date: Thu, 24 Sep 2026 12:43:28 +0300 Subject: [PATCH] =?UTF-8?q?fix(tasarim):=20toast=20a=C3=A7=C4=B1klamas?= =?UTF-8?q?=C4=B1=20okunmuyordu=20=E2=80=94=20tema=20light'a=20sabit,=20me?= =?UTF-8?q?tin=20ve=20d=C3=BC=C4=9Fme=20tasar=C4=B1m=20dilinde?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Bilal (24 Eyl 2026): "İlk programın listende · 1/24" toast'unun açıklaması okunmuyor. Sebep: sonner temayı next-themes'ten alıyor, sistem koyu temadayken açıklama beyaza yakın griye dönüyor, zemin beyaz kalıyordu. Üründe karanlık mod yok; tema light'a sabitlendi. Başlık slate-900 semibold, açıklama slate-600, aksiyon düğmesi koyu hap (h-9 rounded-full). DESIGN.md §4.16. Co-Authored-By: Claude Fable 5.1 --- docs/tasarim/DESIGN.md | 8 ++++++++ src/app/globals.css | 28 ++++++++++++++++++++++++++++ src/components/ui/sonner.tsx | 11 +++++++---- 3 files changed, 43 insertions(+), 4 deletions(-) diff --git a/docs/tasarim/DESIGN.md b/docs/tasarim/DESIGN.md index dbbc5df..a467ff8 100644 --- a/docs/tasarim/DESIGN.md +++ b/docs/tasarim/DESIGN.md @@ -423,6 +423,14 @@ tablosu bu sabitleri kullanır, sınıfı elle yazmaz. - Tür çipi devlet/vakıf için de aynı slate çip; vakıf violet değildir (§2.2). - Tablo başlığı `h-12 text-sm font-semibold text-slate-500`; hücre dolgusu `py-4 pl-4 sm:pl-5`. +### 4.16 Bildirim (toast) — `src/components/ui/sonner.tsx` + `globals.css` +Tema **light'a sabit** (karanlık mod yok, §1.2): sistem koyu temadayken sonner açıklamayı beyaza +yakın griye çevirip beyaz zeminde okunmaz ediyordu (Bilal, 24 Eyl 2026: "toast açıklaması +okunmuyor"). Kutu `rounded-2xl border-slate-200`; başlık `font-semibold text-slate-900`; açıklama +`text-slate-600`; aksiyon düğmesi üst çubuktaki koyu hap (`h-9 rounded-full bg-slate-900` beyaz +yazı, hover `slate-700`). Metin §10.4: ne oldu + ne yapılacak; kilometre taşı toast'ları +(`program-ekle-butonu.tsx`) tek cümle açıklama + tek aksiyon taşır. + ## 5. Yerleşim ### 5.1 Genel diff --git a/src/app/globals.css b/src/app/globals.css index 2ba1976..b36c592 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -321,3 +321,31 @@ .kt-piksel-nabiz { animation: kt-piksel-nabiz 0.42s cubic-bezier(0.23, 1, 0.32, 1); } + +/* Bildirim (toast, sonner) — DESIGN.md §4.16. Başlık ve açıklama slate + tonlarında okunur; aksiyon düğmesi üst çubuktaki koyu hap dilinde. + ".toaster" öneki şart: sonner kendi stilini çalışma anında enjekte eder, + aynı özgüllükteki kural onun altında kalır. */ +.toaster [data-sonner-toast][data-styled="true"] { + border-radius: 1rem; + border-color: var(--color-slate-200); +} +.toaster [data-sonner-toast][data-styled="true"] [data-title] { + font-weight: 600; + color: var(--color-slate-900); +} +.toaster [data-sonner-toast][data-styled="true"] [data-description] { + color: var(--color-slate-600); +} +.toaster [data-sonner-toast][data-styled="true"] [data-button] { + height: 2.25rem; + padding-inline: 0.875rem; + border-radius: 9999px; + font-size: 0.875rem; + font-weight: 600; + color: #fff; + background: var(--color-slate-900); +} +.toaster [data-sonner-toast][data-styled="true"] [data-button]:hover { + background: var(--color-slate-700); +} diff --git a/src/components/ui/sonner.tsx b/src/components/ui/sonner.tsx index ce25f68..9f41ec3 100644 --- a/src/components/ui/sonner.tsx +++ b/src/components/ui/sonner.tsx @@ -1,15 +1,18 @@ "use client" -import { useTheme } from "next-themes" import { Toaster as Sonner, type ToasterProps } from "sonner" import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon } from "lucide-react" +/** + * Bildirimler (DESIGN.md §4.16). Tema "light"e sabit: üründe karanlık mod + * yok (§1.2); sistem koyu temadayken sonner açıklamayı beyaza yakın griye + * çevirip beyaz zeminde okunmaz hâle getiriyordu (Bilal, 24 Eyl 2026: + * "toast açıklaması okunmuyor"). Metin ve buton renkleri globals.css'te. + */ const Toaster = ({ ...props }: ToasterProps) => { - const { theme = "system" } = useTheme() - return (