fix: using u as in the description (#1106)

* Fixing missing parentheses and using u as in doc above

* added to inital app

Author: Shchvova

apps/svelte.dev/content/tutorial/01-svelte/09-transitions/04-custom-css-transitions/+assets/app-a/src/lib/App.svelte

@@ -6,7 +6,7 @@
 	function spin(node, { duration }) {
 		return {
 			duration,
-			css: (t) => ``
+			css: (t, u) => ``
 		};
 	}
 </script>

apps/svelte.dev/content/tutorial/01-svelte/09-transitions/04-custom-css-transitions/+assets/app-b/src/lib/App.svelte

@@ -7,15 +7,15 @@
 	function spin(node, { duration }) {
 		return {
 			duration,
-			css: (t) => {
+			css: (t, u) => {
 				const eased = elasticOut(t);
 
 				return `
 					transform: scale(${eased}) rotate(${eased * 1080}deg);
 					color: hsl(
 						${Math.trunc(t * 360)},
-						${Math.min(100, 1000 * (1 - t))}%,
-						${Math.min(50, 500 * (1 - t))}%
+						${Math.min(100, 1000 * u)}%,
+						${Math.min(50, 500 * u)}%
 					);`;
 			}
 		};

apps/svelte.dev/content/tutorial/01-svelte/09-transitions/04-custom-css-transitions/index.md

@@ -53,15 +53,15 @@ We can get a lot more creative though. Let's make something truly gratuitous:
 	function spin(node, { duration }) {
 		return {
 			duration,
-			css: t => +++{
+			css: (t, u) => +++{
 				const eased = elasticOut(t);
 
 				return `
 					transform: scale(${eased}) rotate(${eased * 1080}deg);
 					color: hsl(
 						${Math.trunc(t * 360)},
-						${Math.min(100, 1000 * (1 - t))}%,
-						${Math.min(50, 500 * (1 - t))}%
+						${Math.min(100, 1000 * u)}%,
+						${Math.min(50, 500 * u)}%
 					);`
 			}+++
 		};