So I’m trying to create a bootstrap custom build without all the components, I downloaded a sass bootstrap copy and plug it into my css, everything works nice except for the glyphicons, the icons folder is contained within my vendor folder like this: vendor/assets/fonts/glyphicons
I’ve imported the fonts like this :
app.import(‘vendor/assets/fonts/glyphicons/glyphicons-halflings-regular.eot’,{ destDir: ‘assets/fonts’ }); app.import(‘vendor/assets/fonts/glyphicons/glyphicons-halflings-regular.svg’,{ destDir: ‘assets/fonts’ }); app.import(‘vendor/assets/fonts/glyphicons/glyphicons-halflings-regular.ttf’,{ destDir: ‘assets/fonts’ }); app.import(‘vendor/assets/fonts/glyphicons/glyphicons-halflings-regular.woff’,{ destDir: ‘assets/fonts’ }); app.import(‘vendor/assets/fonts/glyphicons/glyphicons-halflings-regular.woff2’,{ destDir: ‘assets/fonts’ });
this is what the _glyphicos.sass partial looks like:
@at-root { // Import the fonts @font-face { font-family: ‘Glyphicons Halflings’; src: url(if($bootstrap-sass-asset-helper, twbs-font-path(‘#{$icon-font-path}#{$icon-font-name}.eot’), ‘#{$icon-font-path}#{$icon-font-name}.eot’)); src: url(if($bootstrap-sass-asset-helper, twbs-font-path(‘#{$icon-font-path}#{$icon-font-name}.eot?#iefix’), ‘#{$icon-font-path}#{$icon-font-name}.eot?#iefix’)) format(‘embedded-opentype’), url(if($bootstrap-sass-asset-helper, twbs-font-path(‘#{$icon-font-path}#{$icon-font-name}.woff2’), ‘#{$icon-font-path}#{$icon-font-name}.woff2’)) format(‘woff2’), url(if($bootstrap-sass-asset-helper, twbs-font-path(‘#{$icon-font-path}#{$icon-font-name}.woff’), ‘#{$icon-font-path}#{$icon-font-name}.woff’)) format(‘woff’), url(if($bootstrap-sass-asset-helper, twbs-font-path(‘#{$icon-font-path}#{$icon-font-name}.ttf’), ‘#{$icon-font-path}#{$icon-font-name}.ttf’)) format(‘truetype’), url(if($bootstrap-sass-asset-helper, twbs-font-path(‘#{$icon-font-path}#{$icon-font-name}.svg##{$icon-font-svg-id}’), ‘#{$icon-font-path}#{$icon-font-name}.svg##{$icon-font-svg-id}’)) format(‘svg’); } }
and this is how the _variables.scss looks like:
$icon-font-path: if($bootstrap-sass-asset-helper, “bootstrap/”, “…/fonts/bootstrap/”) !default;
$icon-font-name: “glyphicons-halflings-regular” !default;
$icon-font-svg-id: “glyphicons_halflingsregular” !default;
============================== Anyway I tried this:
@font-face { font-family: ‘Glyphicons Halflings’; src: url(‘#{$icon-font-path}#{$icon-font-name}.eot’); src: url(#{$icon-font-path}#{$icon-font-name}.eot?#iefix’), format(‘embedded-opentype’), url(‘#{$icon-font-path}#{$icon-font-name}.woff2’) format(‘woff2’), url(‘#{$icon-font-path}#{$icon-font-name}.woff’) format(‘woff’), url(‘#{$icon-font-path}#{$icon-font-name}.ttf’) format(‘truetype’), url(‘#{$icon-font-path}#{$icon-font-name}.svg##{$icon-font-svg-id}’)) format(‘svg’); }
$icon-font-path: “…/fonts/” !default;
also tried this path
$icon-font-path: “…/assets/fonts/” !default;
Does anybody know whats wrong??