Категорія: css

Для інтеграції Bootstrap 3 в Rails 4.x можна обійтися без інсталяції gem'а, виконавши наступны кроки:

Скачуємо Bootstrap 3
Копіюємо bootstrap.min.css в /vendor/assets/stylesheets
Копіюємо bootstrap.min.js в /vendor/assets/javascripts
Копіюємо каталог із шрифтами fonts в /vendor/assets/fonts
Вставляємо рядок в /app/assets/javascripts/application.js

//= require bootstrap.min

1

//= require bootstrap.min

Вставляємо рядок в /app/assets/stylesheets/application.css

*= require bootstrap.min

1	*= require bootstrap.min

та підключаємо шрифти наступним чином

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../assets/glyphicons-halflings-regular.eot');
  src: url('../assets/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), 
       url('../assets/glyphicons-halflings-regular.woff') format('woff'), 
       url('../assets/glyphicons-halflings-regular.ttf') format('truetype'), 
       url('../assets/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

@font-face {

font-family: 'Glyphicons Halflings';

src: url('../assets/glyphicons-halflings-regular.eot');

src: url('../assets/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),

url('../assets/glyphicons-halflings-regular.woff') format('woff'),

url('../assets/glyphicons-halflings-regular.ttf') format('truetype'),

url('../assets/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');

}

В config/application.rb після class Application < Rails::Application добавляємо наступне:

class Application < Rails::Application config.assets.paths << "#{Rails}/vendor/assets/fonts"

1
2

class Application < Rails::Application
config.assets.paths << "#{Rails}/vendor/assets/fonts"
В консолі компілюємо assets наступним чином
rake assets:precompile RAILS_ENV=development

1

rake assets:precompile RAILS_ENV=development
Перезапускаємо rails s

Приклади застосування

edit.html.erb

<%= bootstrap_form_for(@sklad,url: admin_sklad_path) do |f| %>
<%= render partial: "admin/sklads/form_edit", locals: {f: f} %>
<% end %>

<%= bootstrap_form_for(@sklad,url: admin_sklad_path) do |f| %>

<%= render partial: "admin/sklads/form_edit", locals: {f: f} %>

<% end %>

_form_edit.html.erb

  <%= f.collection_select :tovar_id, Sklad.where(visible: 1), :id,:model,{class: "form-control filter_select", label: "Товар",prompt: "[Вибір товару]"} %>
  <%= f.text_field :count, label: "Кількість" %>
  <%= f.text_field :price, label: "Ціна,$", readonly: true, disable: true %>	
  <%= image_tag @filename, width: "350", id: "sklad_tovar_image" %>

<div class="box-footer">
  <%= f.submit " Зберегти ", class: "btn btn-primary" %>
  <%= link_to " Назад ", admin_sklads_path, class: "btn btn-danger" %>	
</div>

<%= f.collection_select :tovar_id, Sklad.where(visible: 1), :id,:model,{class: "form-control filter_select", label: "Товар",prompt: "[Вибір товару]"} %>

<%= f.text_field :count, label: "Кількість" %>

<%= f.text_field :price, label: "Ціна,$", readonly: true, disable: true %>

<%= image_tag @filename, width: "350", id: "sklad_tovar_image" %>

<%= f.submit " Зберегти ", class: "btn btn-primary" %>

<%= link_to " Назад ", admin_sklads_path, class: "btn btn-danger" %>

</div>

Веб-Розробка

WebDevelop

Category Archives: css

How to change the css of color of select2 tag

scroll вікна при добавленні контенту ajax’ом

Ajax bootstrap modal windows in Rails

Bootstrap 3 в Rails 4.x