Fonts werden teilweise geladen

This commit is contained in:
2025-08-04 20:04:08 +02:00
parent b701dbe30d
commit d9508cc196
12 changed files with 238 additions and 448 deletions

View File

@@ -39,7 +39,7 @@ const PerformanceOptimizedFontCard = forwardRef(({
});
const handleCopy = useCallback(async () => {
const textToCopy = sStr(transformedText);
const textToCopy = sStr(transformedText?.transformed ?? transformedText);
try {
await navigator.clipboard.writeText(textToCopy);
setCopied(true);
@@ -76,7 +76,7 @@ const PerformanceOptimizedFontCard = forwardRef(({
}, [liked, fontName, onLike]);
const handleShare = useCallback(async () => {
const shareText = `${sStr(transformedText)}\n\nErstellt mit FancyText: ${window.location.href}`;
const shareText = `${sStr(transformedText?.transformed ?? transformedText)}\n\nErstellt mit FancyText: ${window.location.href}`;
if (navigator.share) {
try {
await navigator.share({ title: "Schau dir diese coole Schriftart an! 🔥", text: shareText, url: window.location.href });
@@ -107,7 +107,8 @@ const PerformanceOptimizedFontCard = forwardRef(({
return style;
}, []);
const previewText = sStr(transformedText) || "Hallo Instagram!";
const previewText = sStr(transformedText?.transformed ?? transformedText) || "Hallo Instagram!";
const fontClass = transformedText?.fontClassName ?? "";
return (
<div ref={ref} className="will-change-transform mb-6">
@@ -158,7 +159,7 @@ const PerformanceOptimizedFontCard = forwardRef(({
onKeyDown={(e) => (e.key === "Enter" || e.key === " ") && handleCopy()}
aria-label="Click to copy text"
style={{ ...getFontStyle(fontName), pointerEvents: "auto" }}
className="text-xl sm-text-2xl md-text-3xl mb-4 p-3 sm:p-4 bg-gray-50 rounded-xl text-center select-all text-gray-800 min-h-[70px] sm:min-h-[80px] flex items-center justify-center cursor-pointer hover:bg-gray-100 transition-colors"
className={`text-xl sm-text-2xl md-text-3xl mb-4 p-3 sm:p-4 bg-gray-50 rounded-xl text-center select-all text-gray-800 min-h-[70px] sm:min-h-[80px] flex items-center justify-center cursor-pointer hover:bg-gray-100 transition-colors ${fontClass}`}
>
{previewText}
</div>
@@ -175,7 +176,7 @@ const PerformanceOptimizedFontCard = forwardRef(({
{copied ? (
<><Check className="w-4 h-4 mr-2" /> Copy! </>
) : (
<><Copy className="w-4 h-4 mr-2" /> Start Typing </>
<><Copy className="w-4 h-4 mr-2" /> Copy! </>
)}
</Button>
</div>