Skip to content

GitLab

Switch branch/tag
Find file Normal viewHistoryPermalink
app.html 2.84 KB
Newer Older
Timothy J. Baek's avatar
chat feature added  
Timothy J. Baek committed
1
2
3
4
5 
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
Timothy J. Baek's avatar
fix: manifest.json issue  
Timothy J. Baek committed
6 
		<link rel="manifest" href="%sveltekit.assets%/manifest.json" crossorigin="use-credentials" />
Timothy J. Baek's avatar
Update app.html  
Timothy J. Baek committed
7 
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
tracer123's avatar
Update app.html  
tracer123 committed
8 
		<meta name="robots" content="noindex,nofollow" />
Timothy J. Baek's avatar
feat: browser search engine support  
Timothy J. Baek committed
9
10
11
12
13
14 
		<link
			rel="search"
			type="application/opensearchdescription+xml"
			title="Open WebUI"
			href="/opensearch.xml"
		/>
Timothy J. Baek's avatar
feat: python code execution  
Timothy J. Baek committed
15
Timothy J. Baek's avatar
feat: light mode support  
Timothy J. Baek committed
16
17 
		<script>
			// On page load or when changing themes, best to add inline in `head` to avoid FOUC
Danny Liu's avatar
use IIFE in app.html to prevent FOUC  
Danny Liu committed
18 
			(() => {
Timothy J. Baek's avatar
fix: theme issue  
Timothy J. Baek committed
19 
				if (localStorage?.theme && localStorage?.theme.includes('oled')) {
Danny Liu's avatar
Update theme options and persist OLED dark theme if selected  
Danny Liu committed
20 
					document.documentElement.style.setProperty('--color-gray-900', '#000000');
Danny Liu's avatar
dynamically adjust --color-gray-950 value for OLED black sidebar  
Danny Liu committed
21 
					document.documentElement.style.setProperty('--color-gray-950', '#000000');
Danny Liu's avatar
Update theme options and persist OLED dark theme if selected  
Danny Liu committed
22 
					document.documentElement.classList.add('dark');
Timothy J. Baek's avatar
fix: theme issue  
Timothy J. Baek committed
23 
				} else if (
Danny Liu's avatar
use IIFE in app.html to prevent FOUC  
Danny Liu committed
24
25
26
27
28
29
30
31
32
33
34 
					localStorage.theme === 'light' ||
					(!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: light)').matches)
				) {
					document.documentElement.classList.add('light');
				} else if (localStorage.theme && localStorage.theme !== 'system') {
					localStorage.theme.split(' ').forEach((e) => {
						document.documentElement.classList.add(e);
					});
				} else if (localStorage.theme && localStorage.theme === 'system') {
					systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
					document.documentElement.classList.add(systemTheme ? 'dark' : 'light');
Danny Liu's avatar
run prettier  
Danny Liu committed
35 
				} else {
Danny Liu's avatar
use IIFE in app.html to prevent FOUC  
Danny Liu committed
36
37 
					document.documentElement.classList.add('dark');
				}
Danny Liu's avatar
add event listener in app.html to handle system theme changes  
Danny Liu committed
38
Danny Liu's avatar
use IIFE in app.html to prevent FOUC  
Danny Liu committed
39
40
41
42
43
44
45
46
47 
				window.matchMedia('(prefers-color-scheme: dark)').addListener((e) => {
					if (localStorage.theme === 'system') {
						if (e.matches) {
							document.documentElement.classList.add('dark');
							document.documentElement.classList.remove('light');
						} else {
							document.documentElement.classList.add('light');
							document.documentElement.classList.remove('dark');
						}
Danny Liu's avatar
add event listener in app.html to handle system theme changes  
Danny Liu committed
48 
					}
Danny Liu's avatar
run prettier  
Danny Liu committed
49 
				});
Danny Liu's avatar
use IIFE in app.html to prevent FOUC  
Danny Liu committed
50 
			})();
Timothy J. Baek's avatar
feat: light mode support  
Timothy J. Baek committed
51
52 
		</script>
Timothy J. Baek's avatar
Update app.html  
Timothy J. Baek committed
53
54 
		<title>Open WebUI</title>
Timothy J. Baek's avatar
chat feature added  
Timothy J. Baek committed
55
56
57
58 
		%sveltekit.head%
	</head>
	<body data-sveltekit-preload-data="hover">
		<div style="display: contents">%sveltekit.body%</div>
Timothy J. Baek's avatar
feat: splash screen support  
Timothy J. Baek committed
59
Timothy J. Baek's avatar
refac: splash screen  
Timothy J. Baek committed
60
61 
		<div
			id="splash-screen"
Timothy J. Baek's avatar
feat: dark splash screen  
Timothy J. Baek committed
62 
			style="position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 100%"
Timothy J. Baek's avatar
refac: splash screen  
Timothy J. Baek committed
63
64
65
66
67
68
69
70
71
72
73
74 
		>
			<style type="text/css" nonce="">
				html {
					overflow-y: scroll !important;
				}
			</style>

			<img
				style="
					position: absolute;
					width: 6rem;
					height: 6rem;
Timothy J. Baek's avatar
Update app.html  
Timothy J. Baek committed
75 
					top: 46%;
Timothy J. Baek's avatar
refac: splash screen  
Timothy J. Baek committed
76
77
78
79
80
81
82
83
84 
					left: 50%;
					margin: -40px 0 0 -40px;
				"
				src="/logo.svg"
			/>

			<!-- <span style="position: absolute; bottom: 32px; left: 50%; margin: -36px 0 0 -36px">
				Footer content
			</span> -->
Timothy J. Baek's avatar
feat: splash screen support  
Timothy J. Baek committed
85 
		</div>
Timothy J. Baek's avatar
chat feature added  
Timothy J. Baek committed
86
87 
	</body>
</html>
Timothy J. Baek's avatar
feat: dark splash screen  
Timothy J. Baek committed
88
89
90
91
92
93
94
95
96
97
98
99
100 

<style type="text/css" nonce="">
	#splash-screen {
		background: #fff;
	}
	html.dark #splash-screen {
		background: #000;
	}

	html.dark #splash-screen img {
		filter: invert(1);
	}
</style>