Заставить шрифты работать в Rails 3.1?

Я не знаю, что случилось. Кажется, я делаю это правильно. Я пытаюсь использовать Font Awesome в своем приложении, но шрифт не появляется. У меня есть папка с именем fontsи в моем application.rbесть строка:

class Application < Rails::Application
 # Enable the asset pipeline
 config.assets.enabled = true
 # This line
 config.assets.paths << Rails.root.join("app", "assets", "fonts")

и вместо того, чтобы иметь 2 файла css, которые поставляются со шрифтом -Awesome(ИЗМЕНЕНО СМ. НИЖЕ)(не нуждался в IE7 ), я просто поместил основной css в свой application.css. Затем я меняю URL-адреса для обнаружения файлов шрифтов.

@font-face {
  font-family: "FontAwesome";
  src: url('<%= asset_path('fontawesome-webfont.eot') %>');
  src: url('<%= asset_path('fontawesome-webfont.woff') %>') format('woff'), 
  url('<%= asset_path('fontawesome-webfont.ttf') %>') format('truetype'), 
  url('<%= asset_path('fontawesome-webfont.svg#FontAwesome') %>') format('svg');
  font-weight: normal;
  font-style: normal;
}

Я выключал сервер и перезапускал его после каждого изменения кода, но все равно без толку. Что мне не хватает?

ОБНОВЛЕНИЕ:

Я не использую SASS или LESS. Может проблема в @font-face? Я никогда раньше не видел такого кода.

ОБНОВЛЕНИЕ

Сейчас я использую файл шрифта -awesome.css. Но он не отображается в моем исходном коде.


  
  
  
  
  
  
  

ПОЛНЫЙ ОТВЕТ

Вот как вы можете получить его. Шрифт -Потрясающе работает со вставкой нормально.

ЦИТАТА из:https://gist.github.com/2251151

1. Download font-awesome from https://github.com/FortAwesome/Font-Awesome

2. Put the font folder font folder in the app/assets. I renamed the folder from font to fonts to make it clearer

3. Add config.assets.paths << "#{Rails.root}/app/assets/fonts" to config/application.rb. This is to include the apps/assets/fonts folder in the asset pipeline

4. Put the font-awesome.css file in the app/assets/stylesheets folder

5. The first part of the css should be:

@font-face {
    font-family: 'FontAwesome';
    src: url('fontawesome-webfont.eot');
    src: url('fontawesome-webfont.eot?#iefix') format('embedded-opentype'), 
         url('fontawesome-webfont.woff') format('woff'), 
         url('fontawesome-webfont.ttf') format('truetype'), 
         url('fontawesome-webfont.svgz#FontAwesomeRegular') format('svg'), 
         url('fontawesome-webfont.svg#FontAwesomeRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

#---------------------------------------------------------------------------------------------

You should then be able to use:

icon-camera-retro

6
задан merv 7 July 2012 в 17:02
поделиться