Skip to content

Commit 14a6c1f

Browse files
committed
refac: favicon
1 parent 0a295ff commit 14a6c1f

File tree

8 files changed

+31
-8
lines changed

8 files changed

+31
-8
lines changed

src/app.html

Lines changed: 31 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,13 @@
22
<html lang="en">
33
<head>
44
<meta charset="utf-8" />
5-
<link rel="icon" type="image/png" href="/favicon/favicon-96x96.png" sizes="96x96" />
6-
<link rel="icon" type="image/svg+xml" href="/favicon/favicon.svg" />
7-
<link rel="shortcut icon" href="/favicon/favicon.ico" />
8-
<link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png" />
5+
<link rel="icon" type="image/png" href="/static/favicon.png" />
6+
<link rel="icon" type="image/png" href="/static/favicon-96x96.png" sizes="96x96" />
7+
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg" />
8+
<link rel="shortcut icon" href="/static/favicon.ico" />
9+
<link rel="apple-touch-icon" sizes="180x180" href="/static/apple-touch-icon.png" />
910
<meta name="apple-mobile-web-app-title" content="Open WebUI" />
11+
1012
<link rel="manifest" href="/manifest.json" />
1113
<meta
1214
name="viewport"
@@ -74,6 +76,31 @@
7476
}
7577
}
7678
});
79+
80+
81+
function setSplashImage() {
82+
const logo = document.getElementById('logo');
83+
const isDarkMode = document.documentElement.classList.contains('dark');
84+
85+
if (isDarkMode) {
86+
const darkImage = new Image();
87+
darkImage.src = '/static/splash-dark.png';
88+
89+
darkImage.onload = () => {
90+
logo.src = '/static/splash-dark.png';
91+
logo.style.filter = ''; // Ensure no inversion is applied if splash-dark.png exists
92+
};
93+
94+
darkImage.onerror = () => {
95+
logo.style.filter = 'invert(1)'; // Invert image if splash-dark.png is missing
96+
};
97+
}
98+
}
99+
100+
// Runs after classes are assigned
101+
window.onload = setSplashImage;
102+
103+
77104
})();
78105
</script>
79106

@@ -176,10 +203,6 @@
176203
background: #000;
177204
}
178205

179-
html.dark #splash-screen img {
180-
filter: invert(1);
181-
}
182-
183206
html.her #splash-screen {
184207
background: #983724;
185208
}
File renamed without changes.
File renamed without changes.

0 commit comments

Comments
 (0)