fix(tasarim): CTA arka planındaki masonry pikseller durağan — imleçle ısınmaz
All checks were successful
Deploy / deploy (push) Successful in 4m28s
All checks were successful
Deploy / deploy (push) Successful in 4m28s
Bilal'in isteği (24 Eyl 2026): CTA'ların arkasındaki pikseller üzerine gelindiğinde bir şey olmasın. PixelMasonry ısı fırçasına kaydolmuyor (data-px yok, usePixelHeat yok); yalnız seyrek turuncu vurgu kareleri kendi kendine nefes alıyor. DESIGN.md §10.8 güncellendi. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
@@ -679,7 +679,9 @@ karar.
|
|||||||
(`text-white`, `slate-300` değil). Piksel dokusu `PixelMasonry` (Bilal, 24 Eyl 2026: "arka
|
(`text-white`, `slate-300` değil). Piksel dokusu `PixelMasonry` (Bilal, 24 Eyl 2026: "arka
|
||||||
planda büyüklü küçüklü, masonry şeklinde"): 1–3 hücrelik kareler 3×3'lük makro hücrelere
|
planda büyüklü küçüklü, masonry şeklinde"): 1–3 hücrelik kareler 3×3'lük makro hücrelere
|
||||||
kaymış düşer, çakışmaz ama hizaya girmez; orta bant (%22–78) boş, kenarlara doğru yoğun; iri
|
kaymış düşer, çakışmaz ama hizaya girmez; orta bant (%22–78) boş, kenarlara doğru yoğun; iri
|
||||||
kare daha silik; imleç yaklaşınca turuncuya ısınır (`usePixelHeat`). Kap `relative isolate
|
kare daha silik; **durağan** — imleç ısı fırçasına katılmaz, üzerine gelince hiçbir şey
|
||||||
|
olmaz (Bilal, 24 Eyl 2026); yalnız seyrek turuncu vurgu kareleri kendi kendine yavaşça nefes
|
||||||
|
alır. Kap `relative isolate
|
||||||
overflow-hidden`, doku `-inset-y-6 -z-10`. Eşit ızgaralı eski `PixelField` kaldırıldı.
|
overflow-hidden`, doku `-inset-y-6 -z-10`. Eşit ızgaralı eski `PixelField` kaldırıldı.
|
||||||
- Tek turuncu buton, metin önce ok sonda (§4.1). Telefonda alt alta ve tam genişlik; `sm`'de
|
- Tek turuncu buton, metin önce ok sonda (§4.1). Telefonda alt alta ve tam genişlik; `sm`'de
|
||||||
yan yana, buton sağda.
|
yan yana, buton sağda.
|
||||||
|
|||||||
@@ -77,7 +77,8 @@ function pixelRect(
|
|||||||
* şeklinde"). İçeriğin oturduğu orta bant boş kalır; kareler kenarlara doğru
|
* şeklinde"). İçeriğin oturduğu orta bant boş kalır; kareler kenarlara doğru
|
||||||
* yoğunlaşır. 3×3 hücrelik makro hücrelere 1–3 hücrelik tek kare düşer ve
|
* yoğunlaşır. 3×3 hücrelik makro hücrelere 1–3 hücrelik tek kare düşer ve
|
||||||
* makro hücre içinde kaydırılır: kareler çakışmaz ama hizaya da girmez
|
* makro hücre içinde kaydırılır: kareler çakışmaz ama hizaya da girmez
|
||||||
* (§1.1 "doğal duruş"). Her kare imleç ısı fırçasına katılır.
|
* (§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").
|
||||||
*/
|
*/
|
||||||
export function PixelMasonry({
|
export function PixelMasonry({
|
||||||
seed = 7,
|
seed = 7,
|
||||||
@@ -86,9 +87,6 @@ export function PixelMasonry({
|
|||||||
seed?: number;
|
seed?: number;
|
||||||
className?: string;
|
className?: string;
|
||||||
}) {
|
}) {
|
||||||
const svgRef = useRef<SVGSVGElement>(null);
|
|
||||||
usePixelHeat(svgRef, { radius: 44 });
|
|
||||||
|
|
||||||
const COLS = 42;
|
const COLS = 42;
|
||||||
const ROWS = 12;
|
const ROWS = 12;
|
||||||
const MAKRO = 3;
|
const MAKRO = 3;
|
||||||
@@ -135,16 +133,7 @@ export function PixelMasonry({
|
|||||||
// İri kare daha silik: yazının yanında bağırmasın
|
// İri kare daha silik: yazının yanında bağırmasın
|
||||||
const op = opacityFor(x, y) * (n === 1 ? 1 : n === 2 ? 0.8 : 0.6);
|
const op = opacityFor(x, y) * (n === 1 ? 1 : n === 2 ? 0.8 : 0.6);
|
||||||
return (
|
return (
|
||||||
<rect
|
<rect key={key} {...shared} fill="currentColor" fillOpacity={op} />
|
||||||
key={key}
|
|
||||||
{...shared}
|
|
||||||
data-px=""
|
|
||||||
data-cx={x * CELL + (n * CELL) / 2}
|
|
||||||
data-cy={y * CELL + (n * CELL) / 2}
|
|
||||||
data-op={op}
|
|
||||||
fill="currentColor"
|
|
||||||
fillOpacity={op}
|
|
||||||
/>
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -186,7 +175,6 @@ export function PixelMasonry({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<svg
|
<svg
|
||||||
ref={svgRef}
|
|
||||||
viewBox={`0 0 ${COLS * CELL} ${ROWS * CELL}`}
|
viewBox={`0 0 ${COLS * CELL} ${ROWS * CELL}`}
|
||||||
preserveAspectRatio="xMidYMid slice"
|
preserveAspectRatio="xMidYMid slice"
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
|||||||
Reference in New Issue
Block a user