[bugfix] only play animations when prefers-reduced-motion: no-preference

this can be generalised further i think but for now it does what i need it to do.

CHANGELOG.md

@@ -11,30 +11,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Added documentation for `yarn dev` (#75)
 - Added an .editorconfig (#78)
-- Added a CHANGELOG.md basaed on “Keep a Changelog” (#80)
+- Added a changelog basaed on “Keep a Changelog” (#80)
 
 ### Changed
 
 - Preserve ‘mastodon-settings’ in localStorage (#66)
 - Redesigned the login page (#76)
-- Changed all icons to the Phosphor icon set (#77)
-- Changed AUTHORS.md to reflect fork contributors (#89)
+- Changed all icons with the Phosphor icon set (#77)
 
 ### Fixed
 
 - Updated caniuse-lite browserlist (#82)
 - Fixed various linter issues (#85)
-- Fixed various CSS issues (#100)
 - Updated Prettier to 3.6.2 (#86)
-- Updated Yarn to 4.10.3 (#90)
-- Updated Webpack to 5.102.1 (#83)
-- Updated ESlint to 9.37.0 (#88)
-
-### Removed
-
-- Removed FontAwesome (#99)
-- Removed unused CSS files (#99)
-- Removed various unused assets
 
 ## [0.5.0] - 2025-07-14
 

README.md

@@ -1,6 +1,6 @@
-# Folivora
+# Masto-FE (🦥 flavour)
 
-Folivora is a fork of [Iceshrimp's Masto-FE Standalone](https://iceshrimp.dev/iceshrimp/masto-fe-standalone) repository, which is itself a fork of [Mastodon Glitch Edition](https://github.com/glitch-soc/mastodon), which in turn forks [Mastodon](https://github.com/mastodon/mastodon/). Phew!
+This is a fork of [Iceshrimp's Masto-FE Standalone](https://iceshrimp.dev/iceshrimp/masto-fe-standalone) repository, which is itself a fork of [Mastodon Glitch Edition](https://github.com/glitch-soc/mastodon), which in turn forks [Mastodon](https://github.com/mastodon/mastodon/). Phew!
 
 The goal of this repository is to make it possible to smoothly and intuitively use the Mastodon frontend with a GoToSocial instance as the backend.
 

app/javascript/flavours/glitch/main.jsx

@@ -5,6 +5,7 @@ import Mastodon from "flavours/glitch/containers/mastodon";
 import { me } from "flavours/glitch/initial_state";
 import * as perf from "flavours/glitch/performance";
 import ready from "flavours/glitch/ready";
+import { setReducedMotionBodyClass } from "flavours/glitch/utils/accessibility";
 import { store } from "flavours/glitch/store";
 
 /**
@@ -12,6 +13,7 @@ import { store } from "flavours/glitch/store";
  */
 function main() {
   perf.start("main()");
+  setReducedMotionBodyClass();
 
   return ready(async () => {
     const mountNode = document.getElementById("mastodon");

app/javascript/flavours/glitch/styles/tangerine/status-bar.scss

@@ -1,12 +1,12 @@
 /* 🚥 Status Bar */
-.status-favourite.active svg {
+.no-reduce-motion .status-favourite.active svg {
     animation: bounce 0.4s ease-out;
 }
 
-.status-boost.active svg {
+.no-reduce-motion .status-boost.active svg {
     animation: launch 1.2s ease-in 1;
 }
 
-.status-bookmark.active svg {
+.no-reduce-motion .status-bookmark.active svg {
     animation: bounce-vertical 0.4s ease-out;
 }

app/javascript/flavours/glitch/utils/accessibility.js

@@ -0,0 +1,26 @@
+import ready from "../ready";
+
+ready(() => {
+  setReducedMotionBodyClass();
+});
+
+export function setMediaQueryBodyClass(query, className) {
+  if (query.matches) {
+    document.body.classList.add(className.true);
+    document.body.classList.remove(className.false);
+  } else {
+    document.body.classList.add(className.false);
+    document.body.classList.remove(className.true);
+  }
+}
+
+export function setReducedMotionBodyClass() {
+  const prefersReducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)");
+  const className = {
+    true: "reduce-motion",
+    false: "no-reduce-motion",
+  };
+
+  setMediaQueryBodyClass(prefersReducedMotion, className);
+  prefersReducedMotion.addEventListener("change", () => setReducedMotionBodyClass(prefersReducedMotion));
+}

app/javascript/mastodon/common.js

@@ -1,4 +1,5 @@
 import Rails from "@rails/ujs";
+import "font-awesome/css/font-awesome.css";
 
 export function start() {
   require.context("../images/", true);

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@superseriousbusiness/folivora",
+  "name": "@mastodon/mastodon",
   "license": "AGPL-3.0-or-later",
   "engines": {
     "node": ">=16"
@@ -31,7 +31,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://codeberg.org/superseriousbusiness/masto-fe-standalone.git"
+    "url": "https://github.com/mastodon/mastodon.git"
   },
   "private": true,
   "dependencies": {

public/icons.svg

@@ -283,7 +283,7 @@
     
     <symbol id="lock-open-simple" fill="currentcolor" viewBox="0 0 256 256">
         <path d="M216,96V208a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V96a8,8,0,0,1,8-8H208A8,8,0,0,1,216,96Z" opacity="0.2"></path>
-        <path d="M207.998431,8 C231.042632,8 251.349085,24.3122088 255.838251,46.407134 C256.717967,50.7369471 253.92111,54.9601045 249.591297,55.83982 C245.261484,56.7195356 241.038327,53.922679 240.158611,49.592866 C237.195711,35.0099629 223.489823,24 207.998431,24 C190.325319,24 175.998431,38.326888 175.998431,56 L175.998431,80 L208,80 C216.836556,80 224,87.163444 224,96 L224,208 C224,216.836556 216.836556,224 208,224 L48,224 C39.163444,224 32,216.836556 32,208 L32,96 C32,87.163444 39.163444,80 48,80 L159.998431,80 L159.998431,56 C159.998431,29.490332 181.488763,8 207.998431,8 Z M208,96 L48,96 L48,208 L208,208 L208,96 Z"/>
+        <path d="M48,8 C74.509668,8 96,29.490332 96,56 L95.9994315,80 L208,80 C216.836556,80 224,87.163444 224,96 L224,208 C224,216.836556 216.836556,224 208,224 L48,224 C39.163444,224 32,216.836556 32,208 L32,96 C32,87.163444 39.163444,80 48,80 L79.9994315,80 L80,56 C80,38.5036191 65.9582171,24.2868724 48.5291785,24.0042871 L48,24 C32.5086083,24 18.8027209,35.0099629 15.83982,49.592866 C14.9601045,53.922679 10.7369471,56.7195356 6.40713405,55.83982 C2.077321,54.9601045 -0.719535601,50.7369471 0.160179973,46.407134 C4.64934606,24.3122088 24.9557992,8 48,8 Z M208,96 L48,96 L48,208 L208,208 L208,96 Z"/>
     </symbol>
     
     <symbol id="magnifying-glass" fill="currentcolor" viewBox="0 0 256 256">

public/index.html

@@ -26,7 +26,7 @@
 
     <script src="/packs/js/flavours/glitch/home.js"></script>
 </head>
-<body class='app-body no-reduce-motion system-font'>
+<body class='app-body system-font'>
 <div class='app-holder' data-props='{&quot;locale&quot;:&quot;en&quot;}' id='mastodon'>
 </div>
 </body>