diff options
| -rw-r--r-- | modern/src/common/attributes/useServerAttributes.js | 4 | ||||
| -rw-r--r-- | modern/src/login/LogoImage.js | 12 | ||||
| -rw-r--r-- | modern/src/resources/l10n/en.json | 1 |
3 files changed, 16 insertions, 1 deletions
diff --git a/modern/src/common/attributes/useServerAttributes.js b/modern/src/common/attributes/useServerAttributes.js index 76d5a157..e87d1d7e 100644 --- a/modern/src/common/attributes/useServerAttributes.js +++ b/modern/src/common/attributes/useServerAttributes.js @@ -9,6 +9,10 @@ export default (t) => useMemo(() => ({ name: t('serverDescription'), type: 'string', }, + logo: { + name: t('serverLogo'), + type: 'string', + }, colorPrimary: { name: t('serverColorPrimary'), type: 'string', diff --git a/modern/src/login/LogoImage.js b/modern/src/login/LogoImage.js index 1b78c80e..f8de13e2 100644 --- a/modern/src/login/LogoImage.js +++ b/modern/src/login/LogoImage.js @@ -1,4 +1,5 @@ import React from 'react'; +import { useSelector } from 'react-redux'; import { makeStyles } from '@mui/styles'; import { ReactComponent as Logo } from '../resources/images/logo.svg'; @@ -15,7 +16,16 @@ const useStyles = makeStyles(() => ({ const LogoImage = ({ color }) => { const classes = useStyles(); - return (<Logo className={classes.image} style={{ color }} />); + const imageFile = useSelector((state) => state.session.server.attributes?.logo); + + if (imageFile) { + return ( + <img className={classes.image} src={imageFile} alt="" /> + ); + } + return ( + <Logo className={classes.image} style={{ color }} /> + ); }; export default LogoImage; diff --git a/modern/src/resources/l10n/en.json b/modern/src/resources/l10n/en.json index fa14778b..8791c530 100644 --- a/modern/src/resources/l10n/en.json +++ b/modern/src/resources/l10n/en.json @@ -310,6 +310,7 @@ "serverDescription": "Server Description", "serverColorPrimary": "Color Primary", "serverColorSecondary": "Color Secondary", + "serverLogo": "Logo Image", "mapTitle": "Map", "mapActive": "Active Maps", "mapOverlay": "Map Overlay", |