style: update loading background to cover full viewport using dynamic units

This commit is contained in:
jxxghp
2026-05-10 22:58:02 +08:00
parent 17a343392c
commit eec1f2d7b3

View File

@@ -92,6 +92,11 @@
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
<style>
html,
body {
background: var(--initial-loader-bg, #fff);
}
#app {
min-block-size: 100%;
-webkit-overflow-scrolling: touch;
@@ -100,11 +105,12 @@
#loading-bg {
position: fixed;
inset: 0;
z-index: 99999;
display: block;
background: var(--initial-loader-bg, #fff);
block-size: 100vh;
inline-size: 100vw;
min-block-size: 100vh;
min-block-size: 100dvh;
transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
}
@@ -359,4 +365,4 @@
<script type="module" src="/src/main.ts"></script>
</body>
</html>
</html>