Toan Nguyen
Toan Nguyen

Reputation: 11591

How to change the path when compile the bootstrap compass file

I've added bootstrap-sass into my project and import it to my application.scss file like this

@

import "../bower_components/bootstrap-sass/assets/stylesheets/_bootstrap-compass";

.bootstrap{
  @import "../bower_components/bootstrap-sass/assets/stylesheets/_bootstrap";
}

In the bootstrap compass file, there are functions

@function twbs-font-path($path) {
  @return font-url($path, true);
}

@function twbs-image-path($path) {
  @return image-url($path, true);
}

Which will be used to set the paths for images and fonts.

After I build the css file using compass, the output of the css file contains the following paths to the font files

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url(/.tmp/styles/fonts/bootstrap/glyphicons-halflings-regular.eot);
    src: url(/.tmp/styles/fonts/bootstrap/glyphicons-halflings-regular.eot?#iefix) format("embedded-opentype"), url(/.tmp/styles/fonts/bootstrap/glyphicons-halflings-regular.woff) format("woff"), url(/.tmp/styles/fonts/bootstrap/glyphicons-halflings-regular.ttf) format("truetype"), url(/.tmp/styles/fonts/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format("svg");
}

How can I change it so that the source path to become:

src: url(./fonts/bootstrap/glyphicons-halflings-regular.eot)

instead of src: url(/.tmp/styles/fonts/bootstrap/glyphicons-halflings-regular.eot)

Please note that the application.scss was built by grunt-contrib-compass

Thanks.

Upvotes: 1

Views: 2125

Answers (1)

psugar
psugar

Reputation: 1885

You should be able to change your compass configuration and set the fonts_dir to be 'fonts' instead of (as it seems) '.tmp/styles/fonts'.

Upvotes: 0

Related Questions