2
respostas

Bagunçou meu código com a criação da pasta menu

Não gostei da organização, pra mim deixou muito mais desorganizado e deixou o código poluído! Além de ter bagunçado o meu código quando criei a pasta menu.

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

2 respostas

Olá, as vezes no início gera-se essa estranheza mas o objetivo principal disso é ajudar a outras pessoas entenderem o código e em futuras manutenções. Entendo que há 2 práticas a serem consideradas:

  1. Separar os estilos em componentes da página, exemplo: header.css, banner.css, footer.css, etc. -> com isso evitamos arquivos enormes de estilos que se aplicam a diferentes partes da aplicação.
  2. Aplicar do padrão de nomenclatura BEM -> é uma convenção de nomenclatura de CSS, acrônimo que faz referência ao conceito de uso mesmo, Bloco/Elemento/Modificador. --> sugiro pesquisar sobre esse assunto, eu particularmente achei bem legal.

A forma como foi importado para o HTML tem várias maneiras,

  1. Na aula foi feita uma a uma no HTML
  2. Mas também já vi importarem os arquivos .css dos componentes em um arquivo "central" de estilo chamado "syles.css" (poderia ser qualquer nome que faça sentido) e depois importou apenas o "styles.css" dentro do HTML.

Por último, essas práticas acima são bem importantes caso no futuro você queira migrar para frameworks como REACTJs. Lá, esse tema de componentização é imprescindível.

espero ter ajudado.

Provavelmente na hora de mover e importar para a pasta você esqueceu de algo, talvez até a própria referência do link.

Lembrando que o cabeçalho fica fora da pasta:

<link rel="stylesheet" href="./assets/css/cabecalho.css">

e o Menu que deve ser mudado o link para a pasta menu:

 <link rel="stylesheet" href="./assets/css/menu/menu-item.css">
 <link rel="stylesheet" href="./assets/css/menu/menu-link.css">
 <link rel="stylesheet" href="./assets/css/menu/menu-lista.css">