Значок Glyphicons Pro неправильно отображается в Rails 4.2/Bootstrap

После покупки Glyphicons в Интернете я интегрировал glyphicons regular с Bootstrap (3.3.6) в приложение Rails 4.2. До этого glyphicon halfings был интегрирован кем-то другим.

Что я сделал, так это скопировал 5 файлов Glyphicon (svg, ttf, eot, woff, woff2) в glyphicons/web/bootstrap-example/fonts/ и assets/fonts/. Также копируется plyphicons/web/bootstrap-example/css/glyphicons.css в `assets/stylesheets/'.

Вот файлы в ресурсах Rails:

введите здесь описание изображения

Проблема в том, что значок в glyphicon regular не отображается.

В application.css.scss добавьте @import glyphicons.css

Проблема в том, что глификон отображается неправильно. Вот травяной кодель:

<%= link_to '<i class="glyphicons glyphicons-eye-open"></i> Free Trial Now'.html_safe,... %>

Он показывает поле с символом (не могу прочитать) в 4 углах. См. изображение ниже: введите здесь описание изображения

Чего не хватает в нашем процессе?


ruby-on-rails css twitter-bootstrap glyphicons
person user938363    schedule 24.05.2016    source источник
comment
можете ли вы показать мне консольную ошибку, если она есть, и элемент в html (f12, проверить элементы...)   -  person HudsonPH    schedule 02.06.2016

Ответы (4)


arrow_upward
1
arrow_downward

Что ж, первое, что вы должны сделать, это открыть консоль отладки браузера (Ctrl+shift+i в Chrome) и перечислить ошибки, вызывающие эту ошибку.

Обычно в сторонних файлах .css всегда есть ссылки на изображения. И когда вы интегрируете эти файлы, вам нужно изменить URL-адрес/путь изображения в соответствии с необходимостью.

person M. Karim    schedule 30.05.2016

arrow_upward
1
arrow_downward

Попробуйте так:

это правильный способ использовать глификоны в ссылке

 <td><%= link_to edit_user_path(user) do %>
         <i class="glyphicons glyphicons-eye-open" title='Edit'></i>
        <% end %>
     </td>
person vipin    schedule 31.05.2016

arrow_upward
1
arrow_downward

Вам нужно делать другие вещи, чтобы работать,

Ознакомьтесь с этим руководством: http://www.erikminkel.com/2013/09/01/twitter-bootstrap-3-in-a-rails-4-application/

person HudsonPH    schedule 02.06.2016
comment
Проблема в том, как добавить глификон PRO. глификон халфлинг работал в приложении. - person user938363; 02.06.2016
comment
У вас нет пакета glyphicon PRO внутри бутстрапа. Полурослики уже внутри. Чтобы показать их, вам нужно убедиться, что шестнадцатеричные коды css подходят для работы. - person Ruben Barbosa; 03.06.2016

arrow_upward
0
arrow_downward

Поскольку таблица стилей находится под /assets в Rails. В glyphicon.css нужно заменить fonts на assets. После этого изменения глификон PRO начинает работать!

person user938363    schedule 04.06.2016