Não estou conseguindo aplicar o estilo importando, alguem poderia me ajudar?
ATÉ 50% OFF
TÁ ACABANDO!
0 dias
0 horas
0 min
0 seg
Não estou conseguindo aplicar o estilo importando, alguem poderia me ajudar?
Consegue compartilhar o repositório no Github, Gabriel?
Salve, Gabriel!
Obrigado por compartilhar.
Achei o problema, ele tá no no seu App.jsx.
Ao invés de importar os componentes, você estava recriando todos eles. Atualmente tá assim:
import './App.css'
function TituloFormulario({children}){
return(
<h2>
{children}
</h2>
)
}
function CampoDeFormulario({children}){
return(
<fieldset>
{children}
</fieldset>
)
}
function Label({children, htmlFor}){
return(
<label htmlFor={htmlFor}>
{children}
</label>
)
}
function CampoDeEntrada(props){
return <input{...props} />
}
function FormularioDeEvento(){
return (
<form className="form-evento">
<TituloFormulario>
Preencha para criar um evento:
</TituloFormulario>
<CampoDeFormulario>
<Label htmlFor="nome">
Qual o nome do evento?
</Label>
<CampoDeEntrada
type="text"
id="nome"
placeholder='Summer dev hits'
/>
</CampoDeFormulario>
</form>
)
}
function App() {
return (
<main>
<header>
<img src="/logo.png" alt=""/>
</header>
<section>
<img src="/banner.png" alt=""/>
</section>
<FormularioDeEvento />
</main>
)
}
export default App
Se você mudar para:
import './App.css'
import { FormularioDeEvento } from './components/FormularioDeEvento'
function App() {
return (
<main>
<header>
<img src="/logo.png" alt=""/>
</header>
<section>
<img src="/banner.png" alt=""/>
</section>
<FormularioDeEvento />
</main>
)
}
export default App
Você vai ver os estilos aplicados.
Bons estudos!
PS.: você compartilhou seu código de uma forma não muito convencional. vale a pena depois subir o projeto pro github ao invés do .rar :)