Dev paneli Apple hareket diliyle yenilendi; animasyon ve UX düzeltmeleri
All checks were successful
Deploy / deploy (push) Successful in 9m29s
All checks were successful
Deploy / deploy (push) Successful in 9m29s
- Dev paneli: DEV çipinden layoutId morph ile büyüyüp küçülür (kritik sönümlü spring), yarı saydam malzeme (backdrop-blur + saturate), basışta anında scale geri bildirimi, Escape ile kapanış, reduced-motion/transparency desteği - TypingAnimation ve TextLoop: prefers-reduced-motion'da sonsuz döngü durur, ilk metin sabit gösterilir - kt-unblur: reduced-motion'da blur çözülmesi yerine kısa yumuşak belirme - Sihirbaz: reduced-motion'da adım geçişinde height/x anında oturur; adım noktalarında transition-all yerine kapsamlı geçiş özellikleri - Sihirbaz il adımındaki arama kutusu kaldırıldı; tüm iller program sayısına göre sıralı çip olarak listelenir - /giris: spinner yerine kartın iskeletini gösteren route-level Skeleton Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -6,6 +6,7 @@ import { cn } from "@/lib/utils";
|
||||
import {
|
||||
AnimatePresence,
|
||||
motion,
|
||||
useReducedMotion,
|
||||
type Transition,
|
||||
type Variants,
|
||||
} from "motion/react";
|
||||
@@ -36,8 +37,12 @@ export function TextLoop({
|
||||
}: TextLoopProps) {
|
||||
const [currentIndex, setCurrentIndex] = useState(0);
|
||||
const items = Children.toArray(children);
|
||||
// Sürekli dönen dekoratif metin: hareket azaltılsın diyen kullanıcıda
|
||||
// döngü hiç başlamaz, ilk metin sabit kalır.
|
||||
const azMotion = useReducedMotion();
|
||||
|
||||
useEffect(() => {
|
||||
if (azMotion) return;
|
||||
const intervalMs = interval * 1000;
|
||||
const timer = setInterval(() => {
|
||||
setCurrentIndex((current) => {
|
||||
@@ -47,7 +52,7 @@ export function TextLoop({
|
||||
});
|
||||
}, intervalMs);
|
||||
return () => clearInterval(timer);
|
||||
}, [items.length, interval, onIndexChange]);
|
||||
}, [azMotion, items.length, interval, onIndexChange]);
|
||||
|
||||
return (
|
||||
<div className={cn("relative inline-block whitespace-nowrap", className)}>
|
||||
|
||||
Reference in New Issue
Block a user