Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Instrução @include all-sprite-sprites não está funcionando

  1. Estou tentando utlizar o recurso '@include all-sprite-sprites' ensinado na aula 8, mas ele não está retornando o resultado esperado. Apesar do arquivo ser gerado e não aparecer mensagem de erro.

  2. Alguém saberia dizer qual erro estou cometendo? Obrigado.

  //arquivo.scss
 .icone-check, .icone-x {

     @include all-sprite-sprites;
     width: 18px;
    height: 18px; 
 }

//resultado esperado
.icone-check, .icone-x {
    background: url(../imagens/sprite-sed99d15b73.png) no-repeat;
      width: 18px;
      height: 18px;
}


//resultado obtido
.icone-check, .icone-x {
      width: 18px;
      height: 18px;
}

2 respostas
solução!

Olá Gabriel!

Primeiramente , mova o include uma linha acima ficando dessa forma:

@include all-sprite-sprites;
.icone-check, .icone-x {
     width: 18px;
     height: 18px; 
}

Observe também que a palavra "sprite" dentro de "all-sprite-sprites" se refere ao nome de uma pasta. Verifique se o nome desta pasta está correto, talvez seja esse o erro.

Espero que tenha ajudado, caso contrario me avisa por aqui que tento ver uma outra solução! :D

Obrigado pela ajuda. Percebi também que não tinha atualizado, no html, os nomes das classes colocando o nome da pasta como prefixo (ex.: '.sprite-icone-ok') e por isso a imagem não estava sendo atribuída.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software