Alex
Alex

Reputation: 41

Unable to add custom fonts to Rails application

I would like to integrate a custom font into my Ruby on Rails app. My text is in cyrilic writing. I have downloaded a special cyrilic font from google fonts. After following some tutorials I still end up with the same problem : the app works (localhost loads with no errors), but the font in the writing doesn't change.

Here is what my folders look like : -app --assets ---fonts ----Oswald-Regular.ttf ---stylesheets ----application.css ----styles.scss

Here is what my config/application.rb looks like :

require_relative 'boot'
require 'rails/all'

# Require the gems listed in Gemfile, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(*Rails.groups)


module Signup
  class Application < Rails::Application
    # Initialize configuration defaults for originally generated Rails version.

    config.load_defaults 5.2
    config.assets.paths << Rails.root.join('app', 'assets', 'fonts')
    # Settings in config/environments/* take precedence over those specified here.
    # Application configuration can go into files in config/initializers
    # -- all .rb files in that directory are automatically loaded after loading
    # the framework and any gems in your application.
  end
end 

Here is what my application.css looks like :

h1{
  font-family:"Oswald";
}

here is what my styles.scss looks like :

@font-face {
 font-family: "Oswald";
 src: url("assets/fonts/Oswald-Regular.ttf") format("truetype");
}

while there are no error messages, I still don't understand what I can add to make my app work...

Upvotes: 0

Views: 103

Answers (1)

Abhishek Aravindan
Abhishek Aravindan

Reputation: 1482

write the @font-face as

@font-face {
 font-family: "Oswald";
 src: url(<%= asset_path 'fonts/Oswald-Regular.ttf' %>) format("truetype");
}

change the file name application.css to application.css.erb

Upvotes: 3

Related Questions