0

Possuo no arquivo LoginWrapper.js a importação de um Grid do material design:

import Grid from '@material-ui/core/Grid';

Possuo no arquivo LoginStyles.js a alteração de css desse componente:

import styled from 'styled-components'
import Grid from '@material-ui/core/Grid';

const GridMaterial = styled(Grid)`
    height: 100vh;
    backgroundColor: red;
`

export default GridMaterial;

Como posso aplicar o estilo GridMaterial no meu grid? Eu importei no meu arquivo LoginWrapper.js os estilos da page Login:

import LoginStyles from './login-form/LoginStyles'

E tentei utilizar no meu componente a classe:

 <Grid className={LoginStyles.GridMaterial} container component="main">

Porém a classe não foi aplicada no elemento. Como eu posso aplicar essa classe no meu grid?

1 Resposta 1

0

Na verdade, quando você cria uma styled-component, você cria um novo COMPONENTE e não uma nova classecss ou um novo objeto de estilo.

Logo, você precisa utilizar esse componente diretamente.

Ao invés de:

<Grid className={LoginStyles.GridMaterial} container component="main">

Será:

import GridMaterial from './login-form/LoginStyles';

<GridMaterial container component="main">...

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .