mirror of
https://github.com/rio-labs/rio.git
synced 2026-01-06 05:09:43 -06:00
59 lines
2.2 KiB
HTML
59 lines
2.2 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>{title}</title>
|
|
<meta name="{meta}" />
|
|
<link
|
|
rel="icon"
|
|
type="image/x-icon"
|
|
href="/rio-base-url-placeholder/rio/favicon.png"
|
|
/>
|
|
<link rel="stylesheet" href="css/style.scss" />
|
|
<script>
|
|
/// Apply the theme's background color. This is done immediately in
|
|
/// the `index.html` to avoid the users getting flashbanged by a
|
|
/// completely white screen while loading.
|
|
const LIGHT_THEME_BACKGROUND_COLOR =
|
|
"{light_theme_background_color}";
|
|
const DARK_THEME_BACKGROUND_COLOR = "{dark_theme_background_color}";
|
|
|
|
let useLightTheme = !window.matchMedia(
|
|
"(prefers-color-scheme: dark)"
|
|
).matches;
|
|
let themeVariables;
|
|
|
|
// Apply the background color and also set a data attribute on the
|
|
// HTML. This will be used by CSS to switch code highlighting
|
|
// themes.
|
|
if (useLightTheme) {
|
|
document.documentElement.style.backgroundColor =
|
|
LIGHT_THEME_BACKGROUND_COLOR;
|
|
document.documentElement.setAttribute("data-theme", "light");
|
|
} else {
|
|
document.documentElement.style.backgroundColor =
|
|
DARK_THEME_BACKGROUND_COLOR;
|
|
document.documentElement.setAttribute("data-theme", "dark");
|
|
}
|
|
</script>
|
|
<script>
|
|
globalThis.SESSION_TOKEN = "{session_token}";
|
|
globalThis.PING_PONG_INTERVAL_SECONDS = "{ping_pong_interval}";
|
|
globalThis.RIO_DEBUG_MODE = "{debug_mode}";
|
|
globalThis.RUNNING_IN_WINDOW = "{running_in_window}";
|
|
globalThis.CHILD_ATTRIBUTE_NAMES = "{child_attribute_names}";
|
|
|
|
// Always end with a slash
|
|
globalThis.RIO_BASE_URL = "/rio-base-url-placeholder/";
|
|
|
|
globalThis.initialMessages = "{initial_messages}";
|
|
</script>
|
|
<script src="code/app.ts" type="module"></script>
|
|
</head>
|
|
|
|
<body class="rio-switcheroo-background">
|
|
<noscript>
|
|
<h1>This website requires JavaScript</h1>
|
|
</noscript>
|
|
</body>
|
|
</html>
|