/ / Como adicionar ícones da Fundação usando o SASS no Email da Fundação - css, node.js, email, zurb-foundation

Como adicionar ícones da Fundação usando o SASS no Foundation Email - css, node.js, email, zurb-foundation

Eu estou usando zerb fundação para e-mail e eu quero usar ícones de fundação no meu projeto. Eu sou novo em scss e eu tentei seguir as instruções do seguinte local mas eu não entendi bem.

Eu criei uma pasta de fontes no meu diretório raiz (fora src) e eu adicionei o seguinte código como descrito no meu arquivo app.scss:

enter code here
$font-path: "../fonts/foundation-icons/foundation-icons";
@font-face {
font-family: "foundation-icons";
src: url("#{$font-path}.eot");
src: url("#{$font-path}.eot?#iefix") format("embedded-opentype"),
url("#{$font-path}.woff") format("woff"),
url("#{$font-path}.ttf") format("truetype"),
url("#{$font-path}.svg#fontcustom") format("svg");
font-weight: normal;
font-style: normal;
}

@import "../fonts/foundation-icons/foundation-icons.css";

Na minha página eu adicionei para testar um ícone, mas não renderizar o ícone.

<i class="fi-social-linkedin">linkedIn</i>

Quando eu executo o comando npm run build Eu recebo o seguinte erro do gulp de corredor de tarefa:

Erro de rejeição não tratada: ENOENT: nenhum tal arquivo ou diretório, abra "C: Usersaroaro_devemailfounddistfontfoundation-iconsfoundation-icons.css" em Erro (nativo) [00:11:11] As seguintes tarefas não foram concluídas: padrão, build, inline [00:11:11] Você esqueceu de sinalizar a conclusão assíncrona?

Alguém pode me ajudar?

Cumprimentos

Aro

Respostas:

0 para resposta № 1

Por padrão, o scss versão de e-mail de fundação não inclua fontes de ícones, pois as fontes de ícones não são suportadas na maioria dos clientes de email.

Mas se você tiver adicionado suas próprias fontes de ícones ou importado as fontes da fundação de sites de fundação mude seu $font-path: variável para apontar para o caminho correto de fontes relativas ao seu arquivo css.

Em vez de usar fontes de ícones, use imagens png ou jpg para seus ícones.