import codeExampleTheme from "highlight.js/styles/atom-one-dark.css" ; import { Links , LinksFunction , LiveReload , Meta , Outlet , Scripts , ScrollRestoration , } from "remix" ; import type { MetaFunction } from "remix" ; import { Layout } from "./components/Layout" ; import stylesUrl from "./styles/index.css" ; export const meta = ( ) => { return { title : "New Remix App" } ; } ; export const links = ( ) => [ { rel : "stylesheet" , href : stylesUrl } , { rel : "stylesheet" , href : codeExampleTheme } , ] ; export default function App ( ) { return ( < html lang = "en" > < head > < meta charSet = "utf-8" / > < meta name = "viewport" content = "width=device-width,initial-scale=1" / > < Meta /> < Links / > < /head> < body className = "min-h-screen flex flex-col md:flex-row bg-zinc-800" > < Layout > < Outlet /> < /Layout> < ScrollRestoration / > < Scripts /> { process . env . NODE_ENV === "development" && ( < LiveReload />)} < /body> < /html>); }