fix: fixing bprogressbar styling and best practice

This commit is contained in:
pahmiudahgede 2025-07-06 21:00:00 +07:00
parent d6edf470b2
commit 71d7a06a8e
1 changed files with 16 additions and 4 deletions

View File

@ -55,6 +55,7 @@ export default function AppWithProviders() {
export function App() { export function App() {
const data = useLoaderData<typeof loader>(); const data = useLoaderData<typeof loader>();
const [theme] = useTheme(); const [theme] = useTheme();
return ( return (
<html lang="id" className={clsx(theme)}> <html lang="id" className={clsx(theme)}>
<head> <head>
@ -65,12 +66,23 @@ export function App() {
<Links /> <Links />
</head> </head>
<body> <body>
<ProgressProvider startOnLoad> <ProgressProvider
color={theme === "dark" ? "#10b981" : "#059669"}
options={{
showSpinner: false,
speed: 300,
minimum: 0.08,
easing: "ease",
positionUsing: "",
template:
'<div class="bar" role="bar"><div class="peg"></div></div>'
}}
>
<Outlet />
</ProgressProvider>
<ScrollRestoration /> <ScrollRestoration />
<Scripts /> <Scripts />
<LiveReload /> <LiveReload />
<Outlet />
</ProgressProvider>
</body> </body>
</html> </html>
); );