Add steps to test the Web UI and to run go generate. Signed-off-by: Gabriel Adrian Samfira <gsamfira@cloudbasesolutions.com>
105 lines
3.7 KiB
HTML
105 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<!-- Light theme icon -->
|
|
<link rel="icon" href="/ui/favicon-light.png" media="(prefers-color-scheme: light)" id="favicon-light" />
|
|
<!-- Dark theme icon -->
|
|
<link rel="icon" href="/ui/favicon-dark.png" media="(prefers-color-scheme: dark)" id="favicon-dark" />
|
|
<!-- Fallback favicon -->
|
|
<link rel="icon" href="/ui/favicon-light.png" id="favicon-fallback" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<script>
|
|
// Theme management - apply system theme or saved preference
|
|
(function() {
|
|
function applyTheme() {
|
|
const savedTheme = localStorage.getItem('theme');
|
|
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
|
|
// Determine if we should use dark mode
|
|
const useDarkMode = savedTheme === 'dark' ||
|
|
(!savedTheme && prefersDark) ||
|
|
(savedTheme === 'system' && prefersDark);
|
|
|
|
// Apply the theme class to document
|
|
if (useDarkMode) {
|
|
document.documentElement.classList.add('dark');
|
|
} else {
|
|
document.documentElement.classList.remove('dark');
|
|
}
|
|
}
|
|
|
|
function updateFavicon() {
|
|
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
const savedTheme = localStorage.getItem('theme');
|
|
const useDarkMode = savedTheme === 'dark' ||
|
|
(!savedTheme && prefersDark) ||
|
|
(savedTheme === 'system' && prefersDark);
|
|
const fallbackIcon = document.getElementById('favicon-fallback');
|
|
|
|
if (useDarkMode) {
|
|
fallbackIcon.href = '/ui/favicon-dark.png';
|
|
} else {
|
|
fallbackIcon.href = '/ui/favicon-light.png';
|
|
}
|
|
}
|
|
|
|
// Apply theme and favicon on load
|
|
applyTheme();
|
|
updateFavicon();
|
|
|
|
// Listen for system theme changes
|
|
if (window.matchMedia) {
|
|
const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
|
|
const handleChange = function(e) {
|
|
const savedTheme = localStorage.getItem('theme');
|
|
// Only update if using system theme (no saved preference or explicit 'system')
|
|
if (!savedTheme || savedTheme === 'system') {
|
|
applyTheme();
|
|
updateFavicon();
|
|
}
|
|
};
|
|
|
|
// Modern browsers
|
|
if (mediaQuery.addEventListener) {
|
|
mediaQuery.addEventListener('change', handleChange);
|
|
} else {
|
|
// Older browsers
|
|
mediaQuery.addListener(handleChange);
|
|
}
|
|
}
|
|
})();
|
|
</script>
|
|
|
|
<link rel="modulepreload" href="/ui/_app/immutable/entry/start.CkYovgPH.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/chunks/CeO1pnaq.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/chunks/sWNKMed7.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/chunks/CWoVlqr_.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/entry/app.Co7E_6-u.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/chunks/DsnmJJEf.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/chunks/Ccl3fNd2.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/chunks/CCYOsezl.js">
|
|
<link rel="modulepreload" href="/ui/_app/immutable/chunks/_gFYyMUN.js">
|
|
</head>
|
|
<body data-sveltekit-preload-data="hover" class="bg-gray-100 dark:bg-gray-900">
|
|
<div style="display: contents">
|
|
<script>
|
|
{
|
|
__sveltekit_ybnuhm = {
|
|
base: "/ui",
|
|
assets: "/ui"
|
|
};
|
|
|
|
const element = document.currentScript.parentElement;
|
|
|
|
Promise.all([
|
|
import("/ui/_app/immutable/entry/start.CkYovgPH.js"),
|
|
import("/ui/_app/immutable/entry/app.Co7E_6-u.js")
|
|
]).then(([kit, app]) => {
|
|
kit.start(app, element);
|
|
});
|
|
}
|
|
</script>
|
|
</div>
|
|
</body>
|
|
</html>
|