mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-20 22:49:18 +00:00
refactor: set background colour from content
This commit is contained in:
committed by
Carlos Valente
parent
05d997a52d
commit
eb897a2a23
@@ -10,14 +10,27 @@ export default function ViewLoader({ children }: PropsWithChildren) {
|
|||||||
const { data } = useViewSettings();
|
const { data } = useViewSettings();
|
||||||
const { shouldRender } = useRuntimeStylesheet(data.overrideStyles ? overrideStylesURL : undefined);
|
const { shouldRender } = useRuntimeStylesheet(data.overrideStyles ? overrideStylesURL : undefined);
|
||||||
|
|
||||||
|
// we need to be able to override the background colour with the key param
|
||||||
|
const searchParams = new URLSearchParams(window.location.search);
|
||||||
|
const colourFromParams = searchParams.get('keyColour') ?? '#101010';
|
||||||
|
|
||||||
// eventually we would want to leverage suspense here
|
// eventually we would want to leverage suspense here
|
||||||
// while the feature is not ready, we simply trigger a loader
|
// while the feature is not ready, we simply trigger a loader
|
||||||
// suspense would have the advantage of being triggered also by react-query
|
// suspense would have the advantage of being triggered also by react-query
|
||||||
|
|
||||||
if (!shouldRender) {
|
if (!shouldRender) {
|
||||||
return <Loader />;
|
return (
|
||||||
|
<>
|
||||||
|
<style>{`body { background: var(--background-color-override, ${colourFromParams}); }`}</style>
|
||||||
|
<Loader />
|
||||||
|
</>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
// eslint-disable-next-line react/jsx-no-useless-fragment -- ensuring JSX return
|
return (
|
||||||
return <>{children}</>;
|
<>
|
||||||
|
<style>{`body { background: var(--background-color-override, ${colourFromParams}); }`}</style>
|
||||||
|
{children}
|
||||||
|
</>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user