Não estou sabendo o pq as variáveis não estão sendo aplicadas, somente a de fundo, mesmo forçando direto no inline ele não aplica.
Alguma ideia do que pode ser?
Não estou sabendo o pq as variáveis não estão sendo aplicadas, somente a de fundo, mesmo forçando direto no inline ele não aplica.
Alguma ideia do que pode ser?
Fiz um teste, mas me deixou mais confuso hahah, alterei a position:absolute para position:inherit e as variáveis foram aplicadas, mas o layout quebra alguem consegue dar uma luz? Lembrando que a posição do cabeçalho ainda permanece como relative Alterada position para inherit as variáveis foram aplicadas, porém quebrou o layout
eu não estava conseguindo aplicar as cores nesse menu, então fui no header.css e fiz diferente do video, a instrutora orientou fazer
.lista-menu__link{
background: var(--azul-degrade);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-transform: uppercase;
mas essa configuração não estava sendo aceita por algum motivo, mesmo com todo código estando igual ao passado, decidi testar com .lista-menu__item e funcionou, não sei isso pode implicar em algum problema nas próximas etapas do desenvolvimento, mas no momento foi a solução
EDIT consegui resolver meu problema com a aplicação, minha < ul > estava assim:
<ul class="lista-menu">
<li class="lista-menu__titulo">Categorias</li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link"></a>Programação</li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link"></a>Front-End</li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link"></a>Infraestrutura</li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link"></a>Business</li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link"></a>Design e UX</li>
</ul>tinha posicionado os nomes fora da tag < a > então quando ia modificar no css, não funcionava, o ideal é:
<ul class="lista-menu">
<li class="lista-menu__titulo">Categorias</li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Programação</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Front-End</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Infraestrutura</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Business</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Design e UX</a></li>
</ul>o nome das seções devem ficar dentro da tag < a >
Que bom que conseguiu resolver o seu problema, mas o meu está sendo aplicado já dessa forma, e mesmo assim as cores não estão sendo aplicadas até mesmo em Categorias que nem link tem.
<ul class="lista-menu">
<li class="lista-menu__titulo">Categorias</li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Programação</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Front-End</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Infraestrutura</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Business</a></li>
<li class="lista-menu__item"><a href="#" class="lista-menu__link">Design e UX</a></li>
</ul>achei que estava tendo o mesmo problema que você, posta o código do header.css tb, de certo algum orientador vai precisar vê-lo pra chegar numa conclusão tb