diff --git a/README.md b/README.md
index 0153aa9..383cb1c 100644
--- a/README.md
+++ b/README.md
@@ -126,6 +126,7 @@ Each hostname is the key of an object, which has following keys:
* `background`: The background image in light mode
* `backgroundDark`: The background image in dark mode
Each of these keys must be an URL to an image file.
+If none of the hostnames matches, the special hostname `*` will be used as a fallback.
An example `customImages` object looks like this:
@@ -143,6 +144,11 @@ Each hostname is the key of an object, which has following keys:
"logoLight": "anotherUrl.to/light/logo.png",
"icon": "anotherUrl.to/light/icon.svg"
},
+ "*": {
+ "logo": "defaultUrl.to/logo.png",
+ "logoLight": "defaultUrl.to/light/logo.png",
+ "icon": "defaultUrl.to/light/icon.svg"
+ }
}
```
As you can see, it is not necessary to overwrite every image, but the hostnames need to be accurate.
diff --git a/src/App.tsx b/src/App.tsx
index ea69d28..a675f66 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -45,6 +45,7 @@ const App = () => {
const { Domains, loading } = useAppSelector(state => state.drawer);
const serverConfig = useAppSelector(state => state.config);
const configError = serverConfig.error;
+ const customImages = serverConfig.customImages[window.location.hostname] || serverConfig.customImages["*"];
const routesProps: RoutesProps = {
authenticated,
@@ -71,8 +72,8 @@ const App = () => {
className={classes.root}
style={{
backgroundImage: darkMode ?
- `url(${serverConfig.customImages[window.location.hostname]?.backgroundDark || backgroundDark})` :
- `url(${serverConfig.customImages[window.location.hostname]?.background || background})`
+ `url(${customImages?.backgroundDark || backgroundDark})` :
+ `url(${customImages?.background || background})`
}}
>
{authenticated && }
diff --git a/src/components/NavigationLinks.tsx b/src/components/NavigationLinks.tsx
index bed87e2..c12d0b9 100644
--- a/src/components/NavigationLinks.tsx
+++ b/src/components/NavigationLinks.tsx
@@ -209,11 +209,13 @@ const NavigationLinks = (props: NavigationLinksProps) => {
const { filter, adding, snackbar } = state;
const isSysAdmin = capabilities.includes(SYSTEM_ADMIN_READ);
const pathname = location.pathname;
+ const customImages = config.customImages[window.location.hostname] || config.customImages["*"];
+
return (
(