imagem de fundo na pagina de login
te agradeço muito até aqui, você realmente me ajudou muito,
mas meu formulário de login, ficou muito colado no lado esquerdo, e a logo não foi para cima do formulário igual ao seu.
mesmo assim te agradeço muito
look
original code:
<main className={classes.root}>
{!useMediaQuery(theme.breakpoints.down('lg')) && <LogoImage color={theme.palette.secondary.contrastText} />}
<Paper className={classes.paper}>
<form className={classes.form}>
{children}
</form>
</Paper>
</main>
move the logo
<main className={classes.root}>
{!useMediaQuery(theme.breakpoints.down('lg'))
<Paper className={classes.paper}>
{!useMediaQuery(theme.breakpoints.down('lg')) && <LogoImage color={theme.palette.secondary.contrastText} />}
<form className={classes.form}>
{children}
</form>
</Paper>
</main>
qual caminho até esse código ?
deixe o logotipo no lado direito, acima da entrada de login e senha
https://github.com/traccar/traccar-web/blob/master/src/login/LoginLayout.jsx#L49
você é um ótimo professor, ficou assim https://i.imgur.com/n3WsSOV.png
como afasto o logo e formulário pro lado direito ? pois achei muito colado na divisão
Após essa linha https://github.com/traccar/traccar-web/blob/9463e50333e17595c8c5d39c62075eacce835d3e/src/login/LoginLayout.jsx#L37
adicione este código
justifyContent: 'center',
alignItems: 'center',
Infelizmente continuou do msm jeito
agradeço muito pela sua ajuda, irei buscar mais ajuda no forum pra conseguir deixar centralizado na parte dark. de qualquer forma estou muito feliz com o resultado obtido, e mais uma vez obrigado!
cole aqui o código da parte que você deve modificar, para verificá-lo.
form: {
justifyContent: 'center',
alignItems: 'center',
maxWidth: theme.spacing(52),
padding: theme.spacing(5),
width: '100%',
},
}));
esquecer esse código, você pode deixá-lo sem as modificações.
Fiz os testes e, no meu caso, eles são centralizados com a alteração dessa linha.
https://github.com/traccar/traccar-web/blob/9463e50333e17595c8c5d39c62075eacce835d3e/src/login/LoginLayout.jsx#L30
e você também deve mover o logotipo,