From 14975dd481b6f7d0fd197b01410a38303cac5b79 Mon Sep 17 00:00:00 2001
From: Anton Tananaev <anton.tananaev@gmail.com>
Date: Tue, 1 Jun 2021 11:58:19 -0700
Subject: Logo coloring

---
 modern/src/components/LoginForm.js | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

(limited to 'modern/src/components')

diff --git a/modern/src/components/LoginForm.js b/modern/src/components/LoginForm.js
index d52a51d..bb76213 100644
--- a/modern/src/components/LoginForm.js
+++ b/modern/src/components/LoginForm.js
@@ -11,6 +11,7 @@ import ResetPasswordForm from './ResetPasswordForm';
 const useStyles = makeStyles(theme => ({
   logoContainer: {
     textAlign: 'center',
+    color: theme.palette.primary.main,
   },
   resetPassword: {
     cursor: 'pointer',
@@ -28,7 +29,6 @@ const LoginForm = ({ setCurrentForm }) => {
   const dispatch = useDispatch();
   const history = useHistory();
   const theme = useTheme();
-  const matches = useMediaQuery(theme.breakpoints.down('md'));
 
   const [failed, setFailed] = useState(false);
   const [email, setEmail] = useState('');
@@ -58,9 +58,13 @@ const LoginForm = ({ setCurrentForm }) => {
 
   return (
     <Grid container direction='column' spacing={3}>
-      <Grid item className={classes.logoContainer}>
-        {matches && <img src='/logo.svg' alt='Traccar' />}
-      </Grid>    
+      {useMediaQuery(theme.breakpoints.down('md')) &&
+        <Grid item className={classes.logoContainer}>
+          <svg height="64" width="240">
+            <use xlinkHref="/logo.svg#img"></use>
+          </svg>
+        </Grid>
+      }
       <Grid item>
         <TextField
           required
-- 
cgit v1.2.3