adds hover styles to header button

klalicki · Dec 16, 2023 · b8f1a40 · b8f1a40
1 parent e352263
commit b8f1a40
Showing 1 changed file with 3 additions and 2 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,6 +1,7 @@
 import { FileLoader } from "./components/FileLoader/FileLoader";
 import { RecipeViewerWrapper } from "./components/RecipeViewerWrapper/RecipeViewerWrapper";
 // import { TargetScaleSetter } from "./components/TargetScaleSetter/TargetScaleSetter";
+
 import { ScalerWrapper } from "./context/ScalerContext";
 import "@mantine/core/styles.css";
 import "@mantine/dropzone/styles.css";
@@ -9,9 +10,9 @@ const App = () => {
   return (
     <div className="flex flex-col items-center">
       <ScalerWrapper>
-        <header className="w-full bg-red-500 p-2 text-white flex justify-between items-center ">
+        <header className="w-full bg-red-500 p-2 text-white flex justify-between items-center">
           <h2 className=" text-xl font-bold">Bakers Mode &gt; Viewer</h2>
-          <button className="font-bold px-2 py-1 border-white  border-2 rounded-md">
+          <button className="font-bold px-2 py-1 border-white  border-2 rounded-md  hover:bg-white hover:text-red-500">
             Load Sample Recipe (not implemented yet)
           </button>
         </header>