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> | |
</div> | |
); | |
} | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment