mirror of
https://github.com/open-webui/open-webui.git
synced 2025-12-12 20:35:19 +00:00
refac: splash screen
This commit is contained in:
parent
40fc1a1f95
commit
1cc15e6470
1 changed files with 10 additions and 32 deletions
42
src/app.html
42
src/app.html
|
|
@ -33,6 +33,7 @@
|
|||
</script>
|
||||
|
||||
<script>
|
||||
|
||||
// On page load or when changing themes, best to add inline in `head` to avoid FOUC
|
||||
(() => {
|
||||
const metaThemeColorTag = document.querySelector('meta[name="theme-color"]');
|
||||
|
|
@ -77,28 +78,17 @@
|
|||
}
|
||||
}
|
||||
});
|
||||
const isDarkMode = document.documentElement.classList.contains('dark');
|
||||
|
||||
function setSplashImage() {
|
||||
const logo = document.getElementById('logo');
|
||||
const isDarkMode = document.documentElement.classList.contains('dark');
|
||||
const logo = document.createElement('img');
|
||||
logo.id = 'logo';
|
||||
logo.style = "position: absolute; width: auto; height: 6rem; top: 44%; left: 50%; transform: translateX(-50%); display:block;";
|
||||
logo.src = isDarkMode ? '/static/splash-dark.png' : '/static/splash.png';
|
||||
|
||||
if (isDarkMode) {
|
||||
const darkImage = new Image();
|
||||
darkImage.src = '/static/splash-dark.png';
|
||||
|
||||
darkImage.onload = () => {
|
||||
logo.src = '/static/splash-dark.png';
|
||||
logo.style.filter = ''; // Ensure no inversion is applied if splash-dark.png exists
|
||||
};
|
||||
|
||||
darkImage.onerror = () => {
|
||||
logo.style.filter = 'invert(1)'; // Invert image if splash-dark.png is missing
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// Runs after classes are assigned
|
||||
window.onload = setSplashImage;
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const splash = document.getElementById('splash-screen');
|
||||
if (splash) splash.prepend(logo);
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
|
||||
|
|
@ -120,18 +110,6 @@
|
|||
}
|
||||
</style>
|
||||
|
||||
<img
|
||||
id="logo"
|
||||
style="
|
||||
position: absolute;
|
||||
width: auto;
|
||||
height: 6rem;
|
||||
top: 44%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
"
|
||||
src="/static/splash.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
style="
|
||||
|
|
|
|||
Loading…
Reference in a new issue