fix(registry): match Tahoe notification motion

This commit is contained in:
Miguel Ángel
2026-05-24 01:19:24 -04:00
parent 4819d84786
commit b37236ed97
@@ -1175,18 +1175,18 @@
}
}
function drawNotification(ctx) {
drawGlassPanel(ctx, 1002, 62, 390, 96, 28);
drawRoundedImage(ctx, macToastIcon, 1022, 84, 44, 44, 12);
function drawNotification(ctx, x, y) {
drawGlassPanel(ctx, x, y, 390, 96, 28);
drawRoundedImage(ctx, macToastIcon, x + 20, y + 22, 44, 44, 12);
ctx.fillStyle = "rgba(10,34,62,0.96)";
ctx.font = "900 18px Inter, system-ui, sans-serif";
ctx.fillText("Messages", 1082, 88);
ctx.fillText("Messages", x + 80, y + 26);
ctx.font = "800 12px Inter, system-ui, sans-serif";
ctx.fillStyle = "rgba(10,34,62,0.58)";
ctx.fillText("now", 1178, 90);
ctx.fillText("now", x + 176, y + 28);
ctx.font = "800 13px Inter, system-ui, sans-serif";
ctx.fillStyle = "rgba(10,34,62,0.78)";
ctx.fillText("Liquid Glass preview is ready for review.", 1082, 116);
ctx.fillText("Liquid Glass preview is ready for review.", x + 80, y + 54);
}
function drawDock(ctx) {
@@ -1211,13 +1211,10 @@
drawDesktopWidgets(ctx);
drawFinderWindow(ctx);
ctx.textBaseline = "top";
var toastProgress = Math.max(0, Math.min(1, S.macToast * 1.15));
if (toastProgress > 0.01) {
if (S.macToastOpacity > 0.01) {
ctx.save();
ctx.globalAlpha = toastProgress;
ctx.translate(0, (1 - toastProgress) * -34);
ctx.filter = "blur(" + (1 - toastProgress) * 4 + "px)";
drawNotification(ctx);
ctx.globalAlpha = S.macToastOpacity;
drawNotification(ctx, S.macToastX, S.macToastY);
ctx.restore();
}
drawDock(ctx);
@@ -1372,7 +1369,9 @@
cardReveal: 0,
titleFade: 0,
counter: 0,
macToast: 0,
macToastOpacity: 0,
macToastX: 1464,
macToastY: 62,
macPanel: 0,
p: 0,
};
@@ -1399,14 +1398,9 @@
var macControl = document.getElementById("mac-control");
var macMedia = document.getElementById("mac-media");
if (macToast) {
macToast.style.opacity = Math.min(1, S.macToast * 1.15);
macToast.style.transform =
"translateY(" +
(1 - S.macToast) * -34 +
"px) scale(" +
(0.965 + S.macToast * 0.035) +
")";
macToast.style.filter = "blur(" + (1 - S.macToast) * 4 + "px)";
macToast.style.opacity = S.macToastOpacity;
macToast.style.transform = "translateX(" + (S.macToastX - 1002) + "px)";
macToast.style.filter = "none";
}
if (macControl) {
macControl.style.opacity = 0.5 + S.macPanel * 0.5;
@@ -1467,7 +1461,12 @@
tl.to(S, { counter: 43, duration: 2, ease: driftEase }, 0.5);
// Cards stagger in (0→1 reveals all cards sequentially)
tl.to(S, { cardReveal: 1, duration: 3, ease: breatheEase }, 0.8);
tl.to(S, { macToast: 1, macPanel: 1, duration: 1.1, ease: breatheEase }, 0.45);
tl.set(S, { macToastX: 1464, macToastY: 62, macToastOpacity: 0 }, 0);
tl.to(S, { macToastX: 988, macToastOpacity: 1, duration: 0.38, ease: "power3.out" }, 0.45);
tl.to(S, { macToastX: 1002, duration: 0.16, ease: "power2.out" }, 0.83);
tl.to(S, { macToastY: 72, duration: 0.18, ease: "power2.out" }, 4.25);
tl.to(S, { macToastY: 62, duration: 0.22, ease: "power2.out" }, 4.43);
tl.to(S, { macPanel: 1, duration: 1.1, ease: breatheEase }, 0.45);
</script>
</body>
</html>