5,
diff --git a/apps/marketing/src/components/(marketing)/hero.tsx b/apps/marketing/src/components/(marketing)/hero.tsx
index a024a4f75..4ff8fbcc2 100644
--- a/apps/marketing/src/components/(marketing)/hero.tsx
+++ b/apps/marketing/src/components/(marketing)/hero.tsx
@@ -134,7 +134,7 @@ export const Hero = ({ className, ...props }: HeroProps) => {
variants={HeroTitleVariants}
initial="initial"
animate="animate"
- className="border-primary bg-background hover:bg-muted mx-auto mt-8 w-60 rounded-xl border transition duration-300"
+ className="border-primary bg-background hover:bg-muted mx-auto mt-8 w-60 rounded-xl border transition-colors duration-300"
>
diff --git a/packages/lib/client-only/hooks/use-element-scale-size.ts b/packages/lib/client-only/hooks/use-element-scale-size.ts
index 3e9b34b3f..1c8ab320e 100644
--- a/packages/lib/client-only/hooks/use-element-scale-size.ts
+++ b/packages/lib/client-only/hooks/use-element-scale-size.ts
@@ -60,26 +60,17 @@ export const calculateTextScaleSize = (
*/
export function useElementScaleSize(
container: { width: number; height: number },
- child: RefObject,
+ text: string,
fontSize: number,
fontFamily: string,
) {
const [scalingFactor, setScalingFactor] = useState(1);
useEffect(() => {
- if (!child.current) {
- return;
- }
-
- const scaleSize = calculateTextScaleSize(
- container,
- child.current.innerText,
- `${fontSize}px`,
- fontFamily,
- );
+ const scaleSize = calculateTextScaleSize(container, text, `${fontSize}px`, fontFamily);
setScalingFactor(scaleSize);
- }, [child, container, fontFamily, fontSize]);
+ }, [text, container, fontFamily, fontSize]);
return scalingFactor;
}
diff --git a/packages/ui/components/signing-card.tsx b/packages/ui/components/signing-card.tsx
index 24a6b6e28..3c65ba9dc 100644
--- a/packages/ui/components/signing-card.tsx
+++ b/packages/ui/components/signing-card.tsx
@@ -56,7 +56,7 @@ export const SigningCard3D = ({ className, name, signingCelebrationImage }: Sign
const sheenGradient = useMotionTemplate`linear-gradient(
30deg,
transparent,
- rgba(var(--sheen-color) / ${trackMouse ? sheenOpacity : 0}) ${sheenPosition}%,
+ rgba(var(--sheen-color) / ${sheenOpacity}) ${sheenPosition}%,
transparent)`;
const cardRef = useRef(null);
@@ -98,10 +98,12 @@ export const SigningCard3D = ({ className, name, signingCelebrationImage }: Sign
void animate(cardX, 0, { duration: 2, ease: 'backInOut' });
void animate(cardY, 0, { duration: 2, ease: 'backInOut' });
+ void animate(sheenOpacity, 0, { duration: 2, ease: 'backInOut' });
+
setTrackMouse(false);
}, 1000);
},
- [cardX, cardY, cardCenterPosition, trackMouse],
+ [cardX, cardY, cardCenterPosition, trackMouse, sheenOpacity],
);
useEffect(() => {
@@ -126,7 +128,6 @@ export const SigningCard3D = ({ className, name, signingCelebrationImage }: Sign
transformStyle: 'preserve-3d',
rotateX,
rotateY,
- // willChange: 'transform background-image',
}}
>
diff --git a/packages/ui/primitives/document-flow/single-player-mode-fields.tsx b/packages/ui/primitives/document-flow/single-player-mode-fields.tsx
index 022b05d60..90fcda862 100644
--- a/packages/ui/primitives/document-flow/single-player-mode-fields.tsx
+++ b/packages/ui/primitives/document-flow/single-player-mode-fields.tsx
@@ -145,7 +145,7 @@ export function SinglePlayerModeCustomTextField({
height,
width,
},
- $paragraphEl,
+ field.customText,
maxFontSize,
fontVariableValue,
);