Create FloatingLabelInput for scenario variables (#68)

* Create FloatingLabelInput

* Fix prettier

* Simplify changes

src/pages/_app.tsx

@@ -2,11 +2,10 @@ import { type Session } from "next-auth";
 import { SessionProvider } from "next-auth/react";
 import { type AppType } from "next/app";
 import { api } from "~/utils/api";
-import { ChakraProvider } from "@chakra-ui/react";
-import theme from "~/utils/theme";
 import Favicon from "~/components/Favicon";
 import "~/utils/analytics";
 import Head from "next/head";
+import { ChakraThemeProvider } from "~/theme/ChakraThemeProvider";
 
 const MyApp: AppType<{ session: Session | null }> = ({
   Component,
@@ -22,9 +21,9 @@ const MyApp: AppType<{ session: Session | null }> = ({
       </Head>
       <SessionProvider session={session}>
         <Favicon />
-        <ChakraProvider theme={theme}>
+        <ChakraThemeProvider>
           <Component {...pageProps} />
-        </ChakraProvider>
+        </ChakraThemeProvider>
       </SessionProvider>
     </>
   );