diff --git a/docs/tasarim/DESIGN.md b/docs/tasarim/DESIGN.md index 9aa6c2e..d7fc22d 100644 --- a/docs/tasarim/DESIGN.md +++ b/docs/tasarim/DESIGN.md @@ -718,6 +718,11 @@ yok** (Bilal, 24 Eyl 2026: kaldırıldı); `FUNNEL_METINLERI` yalnız arama penc içindeki düğmeye imleç/odak gelince 24 kare birden dolar; dokunmada basılan kare ve komşuları nabız atar (`kt-piksel-nabiz`). Hareketi azalt: dolu, durağan. Renk her zaman `PikselListeAciklama` metniyle. +- Piksel tablosunun arkası boş kalır (Bilal, 24 Eyl 2026: "arkasına çok piksel yığılmış"): + telefon/tablette liste üstte ortada, dokunun boş bandında; `lg`'de liste sağ sütunda olduğu + için doku yalnız sol %16'da ve seyrek (`PikselZemin bosBant={[0.16, 1]} yogunluk={0.7}`). + Kural genel: bir kreatif ya da iri sayı piksel zeminin üstüne geliyorsa `bosBant` ile o + bölge boşaltılır; doku ile kreatif üst üste binmez. - Bu yüzey **sayfada bir kez** ve yalnız kapanışta durur; ara paneller ve çekmece mavi banttır. Yeni bir kreatif fikri (veriyi piksele çeviren, imlece tepki veren) önce burada denenir. - Çekmece başlığında denenen "gerçek liste" pikseli (12×2, her kare tercihin riski) **kaldırıldı**: diff --git a/src/components/piksel-cta-yuzeyi.tsx b/src/components/piksel-cta-yuzeyi.tsx index be3fe43..b72c633 100644 --- a/src/components/piksel-cta-yuzeyi.tsx +++ b/src/components/piksel-cta-yuzeyi.tsx @@ -13,6 +13,9 @@ import { PikselListe, PikselListeAciklama } from "@/components/piksel-liste"; * düğmeye ya da linke imleç/odak gelince 24 kare birden dolar — "listen * böyle hazır olur". Yazılıp silinen satır yok (Bilal, 24 Eyl 2026). */ +// Geniş ekranda doku yalnız genişliğin ilk %16'sında (metnin sol boşluğu) +const SOL_KENAR: [number, number] = [0.16, 1]; + export function PikselCtaYuzeyi({ children, className, @@ -39,7 +42,18 @@ export function PikselCtaYuzeyi({ className, )} > - + {/* Telefon/tablet: liste üstte ortada, dokunun boş bandında. Geniş + ekranda liste sağ sütunda — orası tamamen boş kalır, doku yalnız + sol kenarda ve seyrek (Bilal, 24 Eyl 2026: "tablonun arkasına çok + piksel yığılmış"). */} + +
{children} diff --git a/src/components/piksel-zemin.tsx b/src/components/piksel-zemin.tsx index 74fbc96..d0523eb 100644 --- a/src/components/piksel-zemin.tsx +++ b/src/components/piksel-zemin.tsx @@ -15,11 +15,17 @@ import { cn } from "@/lib/utils"; export function PikselZemin({ seed = 7, ton = "acik", + bosBant, + yogunluk, className, }: { /** Aynı ekrandaki iki yüzey farklı desen alsın */ seed?: number; ton?: "acik" | "koyu"; + /** Boş bırakılacak yatay bant (varsayılan orta %22–78); bkz. PixelMasonry */ + bosBant?: [number, number]; + /** Doluluk çarpanı */ + yogunluk?: number; /** Dikey taşma payı vb. (varsayılan `-inset-y-6`) */ className?: string; }) { @@ -32,7 +38,7 @@ export function PikselZemin({ className, )} > - +
); } diff --git a/src/components/pixel-decor.tsx b/src/components/pixel-decor.tsx index 3af316f..e0f23ea 100644 --- a/src/components/pixel-decor.tsx +++ b/src/components/pixel-decor.tsx @@ -80,11 +80,21 @@ function pixelRect( * (§1.1 "doğal duruş"). Durağan zemin: imleç ısı fırçasına katılmaz * (Bilal, 24 Eyl 2026: "üzerine gelindiğinde bir şey olmasın"). */ +// Varsayılan boş bant modül sabiti: her render'da yeni dizi olup useMemo'yu +// boşa düşürmesin (rendering-hoist-jsx) +const BOS_BANT_VARSAYILAN: [number, number] = [0.22, 0.78]; + export function PixelMasonry({ seed = 7, + bosBant = BOS_BANT_VARSAYILAN, + yogunluk = 1, className, }: { seed?: number; + /** Genişliğin bu oranları arasındaki bant boş kalır (içerik orada) */ + bosBant?: [number, number]; + /** Doluluk çarpanı; 1 varsayılan, 0.6 seyrek */ + yogunluk?: number; className?: string; }) { const COLS = 42; @@ -96,8 +106,8 @@ export function PixelMasonry({ const cx = (COLS - 1) / 2; const cy = (ROWS - 1) / 2; const maxD = Math.sqrt(cx * cx + cy * cy); - const BAND_MIN = COLS * 0.22; - const BAND_MAX = COLS * 0.78; + const BAND_MIN = COLS * bosBant[0]; + const BAND_MAX = COLS * bosBant[1]; const sonuc: ReactNode[] = []; let accentIdx = 0; @@ -145,10 +155,10 @@ export function PixelMasonry({ if (mcx > BAND_MIN && mcx < BAND_MAX) continue; // Kenarlara doğru artan doluluk const d = Math.sqrt((mcx - cx) ** 2 + (oy + MAKRO / 2 - cy) ** 2) / maxD; - const density = 0.3 + 0.6 * d * d; + const density = (0.3 + 0.6 * d * d) * yogunluk; if (hash(mx, my, seed) > density) { // Boş makro hücrede ara sıra tek küçük piksel: doku kopmasın - if (hash(mx, my, seed + 3) < 0.25) { + if (hash(mx, my, seed + 3) < 0.25 * yogunluk) { const px = ox + Math.floor(hash(mx, my, seed + 4) * MAKRO); const py = oy + Math.floor(hash(mx, my, seed + 5) * MAKRO); sonuc.push(kare(px, py, 1, `k-${mx}-${my}`, false)); @@ -171,7 +181,7 @@ export function PixelMasonry({ } } return sonuc; - }, [seed]); + }, [seed, bosBant, yogunluk]); return (