This site uses cookies own and third. If you continue to browse consider to accept the use of cookies. OK More Info.

Agregar Foundation a Rails

  • 0 Replies
  • 4889 Views

0 Members and 1 Guest are viewing this topic.

Offline Alejandro_99

  • *
  • Ex-Staff
  • *****
  • Posts: 451
  • Actividad:
    0%
  • Reputación 1
  • Humildad y sencillez ante todo.
    • View Profile

Agregar Foundation a Rails

  • on: October 12, 2014, 03:04:07 am

¿Que es Foundation?

Es un framework limpio, fácil y nada intimidante para usar, ofreciendo elementos esenciales totalmente necesarios para conseguir un sitio propio, con todo el poder del diseño web pero que realmente sea funcional. Cabe mencionar que podemos diseñar la interfaz gráfica con el mismo a un sitio web.

Comencemos a agregar Foundation a nuestra aplicación:

1.   Adherimos  al archivo Gemfile la gema: 
Code: (ruby) You are not allowed to view links. Register or Login
gem 'foundation-rails' luego ejecutamos
Code: (ruby) You are not allowed to view links. Register or Login
bundle install
2.   Instalamos Foundation en nuestro proyecto:
Code: (ruby) You are not allowed to view links. Register or Login
rails g foundation:install
3.   Agregamos la siguiente línea:
Code: (ruby) You are not allowed to view links. Register or Login
*= require foundation a nuestro CSS para ello debemos ingresar al siguiente directorio:
app/assets/stylesheets/application.css

4.   Ahora nos dirigimos a app/assets/javascripts/application.js y colocamos la siguiente línea:

Code: (ruby) You are not allowed to view links. Register or Login
//= require foundation
$(function(){ $(document).foundation(); });

5.   Incorporamos la siguiente línea a nuestro archivo production.rb:

Code: (ruby) You are not allowed to view links. Register or Login
config.assets.precompile += %w( vendor/modernizr.js )
Para ello hay que dirigirse a config/environments/production.rb

6.   Finalmente abrimos el archivo (application.html.erb) el mismo se encuentra en: app/views/layouts/ application.html.erb y añadimos la siguientes líneas:

Code: (html5) You are not allowed to view links. Register or Login
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
Y

Code: (ruby) You are not allowed to view links. Register or Login
<%= javascript_include_tag "vendor/modernizr" %>
Las mismas deben ir dentro de la etiqueta
Code: (html5) You are not allowed to view links. Register or Login
<head></head> del archivo application.html.erb