I've just started with sass today and hit my first roadblock. I don't know how to use font-face inside my scss files. Here's what I've tried, inside my app.scss file:
//do I need this line? I have installed compass
@import "compass/css3";
@include font-face("myfont", font-files("myfont.eot", "myfont.woff", "myfont.ttf", "myfont.svg#myfont"));
And this is what I get rendered:
@font-face {
font-family: "myfont";
src: url('/assets/css/fonts/myfont.eot') format('embedded-opentype'), url('/assets/css/fonts/myfont.woff') format('woff'), url('/assets/css/fonts/myfont.ttf') format('truetype'), url('/assets/css/fonts/myfont.svg#myfont') format('svg');
}
My config.rb file:
http_path = "/"
css_dir = "assets/css"
sass_dir = "assets/sass"
images_dir = "assets/img"
javascripts_dir = "assets/js"
fonts_dir = "assets/fonts"
And my right now my file structure is this www.mydomain.com/nameofmyproject and inside I have a folder called assets that contains css, sass, img, fonts, js folders
EDIT: Since this seems to be an issue with the paths I will edit my question. I'm working on a subdirectory here and firebug shows me a 404 for my font files, with the following url: www.mydomain.com/assets/css/fonts So it's both ignoring that I'm on a subdirectory and that I changed my fonts_dir to be inside assets and it goes to the default, inside the css directory.
Yeah my problem was a mix of issues, not restarting compass watch was not helping me debug the problem correctly and having a messed up installation was the problem at hand. I reinstalled and then started from scratch and it ended working just fine.