Skip to content

Instantly share code, notes, and snippets.

@ZephiroRB
Forked from kitwalker12/font_helper.rb
Created February 18, 2018 04:47
Show Gist options
  • Save ZephiroRB/011ba99cbf97c4f019df71719b6ad51f to your computer and use it in GitHub Desktop.
Save ZephiroRB/011ba99cbf97c4f019df71719b6ad51f to your computer and use it in GitHub Desktop.
Importing custom fonts in rails
module ActionView
module Helpers
module AssetUrlHelper
def asset_data_base64(path)
asset = Rails.application.assets.find_asset(path)
throw "Could not find asset '#{path}'" if asset.nil?
base64 = Base64.encode64(asset.to_s).gsub(/\s+/, "")
"data:#{asset.content_type};base64,#{Rack::Utils.escape(base64)}"
end
end
end
end
@font-face {
font-family: DidotW01Roman;
font-weight: normal;
font-style: normal;
src: url(/assets/DidotW01Roman/DidotW01Roman.eot) format("embedded-opentype");
src: url(/assets/DidotW01Roman/DidotW01Roman.eot?#iefix) format("embedded-opentype"), url(/assets/DidotW01Roman/DidotW01Roman.woff) format("woff"), url(/assets/DidotW01Roman/DidotW01Roman.ttf) format("truetype"), url(/assets/DidotW01Roman/DidotW01Roman.svg#DidotW01Roman) format("svg");
}
@font-face {
font-family: DidotW01Italic;
font-weight: normal;
font-style: normal;
src: url(/assets/DidotW01Italic/DidotW01Italic.eot) format("embedded-opentype");
src: url(/assets/DidotW01Italic/DidotW01Italic.eot?#iefix) format("embedded-opentype"), url(/assets/DidotW01Italic/DidotW01Italic.woff) format("woff"), url(/assets/DidotW01Italic/DidotW01Italic.ttf) format("truetype"), url(/assets/DidotW01Italic/DidotW01Italic.svg#DidotW01Italic) format("svg");
}
//OR using bourbon and SASS
@import "bourbon";
@include font-face(DidotW01Roman, "DidotW01Roman/DidotW01Roman", $asset-pipeline: true);
@include font-face(DidotW01Italic, "DidotW01Italic/DidotW01Italic", $asset-pipeline: true);
//OR use a custom asset helper
@font-face {
font-family: DidotW01Roman;
font-weight: normal;
font-style: normal;
src: url(<%= asset_data_base64('DidotW01Roman/DidotW01Roman.otf') %>);
}
@font-face {
font-family: DidotW01Italic;
font-weight: normal;
font-style: normal;
src: url(<%= asset_data_base64('DidotW01Italic/DidotW01Italic.otf') %>);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment