Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
import React from "react";
import useReducedMotion from "./useReducedMotion.js";
export default function App() {
// Get the recuded motion state from our hook.
const reducedMotion = useReducedMotion(false);
return (
<div className="App">
// Set text according the reduced motion setting.
<h1>{reducedMotion ? "Do not animate stuff" : "Animate stuff"}</h1>
// Add a class based on the reduced motion setting.
<div className={"mainclass " + (reducedMotion ? null : "animate")}></div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment