Thursday, 25 May 2017

How adding Foundation icons using SASS in Foundation Email

i am using foundation zerb for Email and i want to use Foundation icons in my Project. I am new in scss and i tried to follow the instructions from the following site but i dont get it runing properly.

I created a font folder in my root directory (outside src) and i added the following code as discribed in my app.scss file:

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";

In my Page i added for testing one icon but it didn't render the icon.

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

When i run the command npm run build i get the following error from the task runner gulp:

Unhandled rejection Error: ENOENT: no such file or directory, open 'C:\Users\aro\aro_dev\emailfound\dist\font\foundation-icons\foundation-icons.css' at Error (native) [00:11:11] The following tasks did not complete: default, build, inline [00:11:11] Did you forget to signal async completion?

Can someone help me?

Best Regards

Aro



via Armando82

No comments:

Post a Comment