node.js - Integrating Font Squirrel generated font in Twitter Bootstrap via LESS -
i attempting use font generated font squirrel base font twitter bootstrap (compiled less files). using express.js node.js, , have included font files within font directory, i.e.
myapp |_ public |_ stylesheets |_ font
i have "installed" font awesome changing variables in bootstrap.less
, have working, know directory structure correct. custom font files in font
directory, go next? need make my-custom-font.less
file contains @font-face
declarations, or need declare within 1 of bootstrap less files? aware base font declared in variables.less
via @basefontfamily
attribute, described not sure how declare custom font family. in advance.
edit
below snippet of code attempting use:
@chatypepath: "font"; @font-face { font-family: 'chatypeb2.1regular'; src: url('@{chatypepathpath}/chatypeb2.1regular-webfont.eot?v=3.0.1'); src: url('@{chatypepathpath}/chatypeb2.1regular-webfont.eot?#iefix&v=3.0.1') format('embedded-opentype'), url('@{chatypepathpath}/chatypeb2.1regular-webfont.woff?v=3.0.1') format('woff'), url('@{chatypepathpath}/chatypeb2.1regular-webfont.ttf?v=3.0.1') format('truetype'); }
note: there erroneous here.
update:
correct declaration:
@chatypefontfamily: "chatypeb2.1thinthin", "courier new", monospace; @font-face { font-family: 'chatypeb2.1thinthin'; src: url('font/chatypeb2.1thin-webfont.eot'); src: url('font/chatypeb2.1thin-webfont.eot?#iefix') format('embedded-opentype'), url('font/chatypeb2.1thin-webfont.woff') format('woff'), url('font/chatypeb2.1thin-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; }
i try in variables.less
:
@customfontfamily: "custom", "courier new", monospace; /* here should use whatever @font-face squirrel generated in stylesheet.css */ @font-face { font-family: 'custom'; font-style: normal; font-weight: 400; src: local('custom'), local('custom-regular'), url(path.to.font.file.woff) format('woff'); }
you can put font-face
separate file , using @import
, don't think it's necessary. , can call @cusomfontfamily
, use @basefontfamily
, or wherever want.
Comments
Post a Comment