From 9eb7324354660cab73b4bd6d94317a37042c5424 Mon Sep 17 00:00:00 2001
From: Christian Fehmer <cfe@sexy-developer.com>
Date: Fri, 27 Dec 2024 14:01:28 +0100
Subject: [PATCH] rename forceAnimation to ignoreReducedMotion

---
 frontend/src/styles/media-queries.scss |  3 ++-
 frontend/src/ts/test/funbox/funbox.ts  |  6 ++++--
 packages/funbox/src/list.ts            | 10 +++++-----
 packages/funbox/src/types.ts           |  2 +-
 4 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/frontend/src/styles/media-queries.scss b/frontend/src/styles/media-queries.scss
index 70a683e5c83f..cf1cfb4cac40 100644
--- a/frontend/src/styles/media-queries.scss
+++ b/frontend/src/styles/media-queries.scss
@@ -1041,7 +1041,8 @@ body {
 }
 
 @media (prefers-reduced-motion) {
-  body:not(.force-animation) *:not(.fa-spin, #backgroundLoader, .preloader) {
+  body:not(.ignore-reduced-motion)
+    *:not(.fa-spin, #backgroundLoader, .preloader) {
     animation: none !important;
     transition: none !important;
 
diff --git a/frontend/src/ts/test/funbox/funbox.ts b/frontend/src/ts/test/funbox/funbox.ts
index c4f39ce94a51..0a7ea8f67875 100644
--- a/frontend/src/ts/test/funbox/funbox.ts
+++ b/frontend/src/ts/test/funbox/funbox.ts
@@ -217,9 +217,11 @@ async function setFunboxBodyClasses(): Promise<boolean> {
   const currentClasses = $body?.attr("class")?.split(/\s+/) ?? [];
 
   if (
-    getActiveFunboxes().some((it) => it.properties?.includes("forceAnimation"))
+    getActiveFunboxes().some((it) =>
+      it.properties?.includes("ignoreReducedMotion")
+    )
   ) {
-    currentClasses.push("force-animation");
+    currentClasses.push("ignore-reduced-motion");
   }
 
   $body.attr(
diff --git a/packages/funbox/src/list.ts b/packages/funbox/src/list.ts
index 372db4ee77b3..b1084d7048bd 100644
--- a/packages/funbox/src/list.ts
+++ b/packages/funbox/src/list.ts
@@ -37,7 +37,7 @@ const list: Record<FunboxName, FunboxMetadata> = {
     description: "I think I'm gonna be sick.",
     canGetPb: true,
     difficultyLevel: 2,
-    properties: ["hasCssFile", "forceAnimation"],
+    properties: ["hasCssFile", "ignoreReducedMotion"],
   },
   round_round_baby: {
     name: "round_round_baby",
@@ -45,7 +45,7 @@ const list: Record<FunboxName, FunboxMetadata> = {
       "...right round, like a record baby. Right, round round round.",
     canGetPb: true,
     difficultyLevel: 3,
-    properties: ["hasCssFile", "forceAnimation"],
+    properties: ["hasCssFile", "ignoreReducedMotion"],
   },
   simon_says: {
     name: "simon_says",
@@ -77,7 +77,7 @@ const list: Record<FunboxName, FunboxMetadata> = {
       "hasCssFile",
       "noLigatures",
       "conflictsWithSymmetricChars",
-      "forceAnimation",
+      "ignoreReducedMotion",
     ],
     name: "choo_choo",
     description: "All the letters are spinning!",
@@ -143,14 +143,14 @@ const list: Record<FunboxName, FunboxMetadata> = {
     description: "Everybody get down! The words are shaking!",
     canGetPb: true,
     difficultyLevel: 1,
-    properties: ["hasCssFile", "noLigatures", "forceAnimation"],
+    properties: ["hasCssFile", "noLigatures", "ignoreReducedMotion"],
     name: "earthquake",
   },
   space_balls: {
     description: "In a galaxy far far away.",
     canGetPb: true,
     difficultyLevel: 0,
-    properties: ["hasCssFile", "forceAnimation"],
+    properties: ["hasCssFile", "ignoreReducedMotion"],
     name: "space_balls",
   },
   gibberish: {
diff --git a/packages/funbox/src/types.ts b/packages/funbox/src/types.ts
index 9b6391f67902..9e0336aacbe8 100644
--- a/packages/funbox/src/types.ts
+++ b/packages/funbox/src/types.ts
@@ -63,7 +63,7 @@ export type FunboxProperty =
   | "noLigatures"
   | `toPush:${number}`
   | "wordOrder:reverse"
-  | "forceAnimation";
+  | "ignoreReducedMotion";
 
 export type FunboxMetadata = {
   name: FunboxName;