refac: splash screen
This commit is contained in:
		
							parent
							
								
									975e078f4d
								
							
						
					
					
						commit
						9ef843d492
					
				
							
								
								
									
										36
									
								
								src/app.html
								
								
								
								
							
							
						
						
									
										36
									
								
								src/app.html
								
								
								
								
							|  | @ -50,15 +50,39 @@ | |||
| 	<body data-sveltekit-preload-data="hover"> | ||||
| 		<div style="display: contents">%sveltekit.body%</div> | ||||
| 
 | ||||
| 		<div id="splash-screen" style="min-height: 100vh; height: 100dvh; display: flex"> | ||||
| 			<div style="margin: auto"> | ||||
| 		<div | ||||
| 			id="splash-screen" | ||||
| 			style=" | ||||
| 				position: fixed; | ||||
| 				z-index: 100; | ||||
| 				background: #fff; | ||||
| 				top: 0; | ||||
| 				left: 0; | ||||
| 				width: 100%; | ||||
| 				height: 100%; | ||||
| 			" | ||||
| 		> | ||||
| 			<style type="text/css" nonce=""> | ||||
| 				html { | ||||
| 					overflow-y: scroll !important; | ||||
| 				} | ||||
| 			</style> | ||||
| 
 | ||||
| 			<img | ||||
| 				style=" | ||||
| 					position: absolute; | ||||
| 					width: 6rem; | ||||
| 					height: 6rem; | ||||
| 					top: 45%; | ||||
| 					left: 50%; | ||||
| 					margin: -40px 0 0 -40px; | ||||
| 				" | ||||
| 				src="/logo.svg" | ||||
| 					alt="logo" | ||||
| 					style="width: 6rem; height: 6rem; margin-bottom: 2rem" | ||||
| 					draggable="false" | ||||
| 			/> | ||||
| 			</div> | ||||
| 
 | ||||
| 			<!-- <span style="position: absolute; bottom: 32px; left: 50%; margin: -36px 0 0 -36px"> | ||||
| 				Footer content | ||||
| 			</span> --> | ||||
| 		</div> | ||||
| 	</body> | ||||
| </html> | ||||
|  |  | |||
|  | @ -20,8 +20,6 @@ | |||
| 	let loaded = false; | ||||
| 
 | ||||
| 	onMount(async () => { | ||||
| 		document.getElementById('splash-screen')?.remove(); | ||||
| 
 | ||||
| 		theme.set(localStorage.theme); | ||||
| 		// Check Backend Status | ||||
| 		const backendConfig = await getBackendConfig(); | ||||
|  | @ -64,6 +62,8 @@ | |||
| 		} | ||||
| 
 | ||||
| 		await tick(); | ||||
| 
 | ||||
| 		document.getElementById('splash-screen')?.remove(); | ||||
| 		loaded = true; | ||||
| 	}); | ||||
| </script> | ||||
|  | @ -80,17 +80,6 @@ | |||
| 
 | ||||
| {#if loaded} | ||||
| 	<slot /> | ||||
| {:else} | ||||
| 	<div class=" min-h-screen h-[100dvh] flex"> | ||||
| 		<div class="m-auto"> | ||||
| 			<img | ||||
| 				src="/logo.svg" | ||||
| 				alt="logo" | ||||
| 				class=" size-24 rounded-full border-[1px] border-gray-200 dark:border-none mx-auto mb-8" | ||||
| 				draggable="false" | ||||
| 			/> | ||||
| 		</div> | ||||
| 	</div> | ||||
| {/if} | ||||
| 
 | ||||
| <Toaster richColors position="top-center" /> | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue