Sass y Bootstrap

​Sass es un preprocesador de CSS.
​Sass ofrece varias ventajas sobre CSS como:
Variables
Reglas anidadas
Importación de archivos y parciales
Reutilización de código con mixins y herencia
Operadores matemáticos y lógicos
Condicionales e iteraciones
Para aprender más sobre Sass te recomendamos este video de Make it Real.
Bootstrap 3
Los pasos para configurar Bootstrap 3 son los siguientes:
1.Incluye la gema en el Gemfile:
 gem 'bootstrap-sass', '~> 3.3.7'
2.Ejecuta bundle install.
3.Cambia la extensión del archivo app/assets/stylesheets/application.css por .scss.
4.Reemplaza el contenido de app/assets/stylesheets/application.scss por lo siguiente:
// "bootstrap-sprockets" must be imported before "bootstrap" and "bootstrap/variables"
@import "bootstrap-sprockets";
@import "theme";
@import "bootstrap";
5.Crea el archivo app/assets/stylesheets/theme.scss en donde vas a poder sobrescribir las variables de Bootstrap, por ejemplo:
$font-size-base:                   16px;
$text-color:                       #303030;
Para ver la lista de variables que puedes sobrescribir sigue este enlace.
Bootstrap 4
Los pasos para configurar Bootstrap 4 son los siguientes:
1.Incluye la gema al final del Gemfile:
gem 'bootstrap', '~> 4.1'
2.Ejecuta bundle install.
3.Cambia la extensión del archivo app/assets/stylesheets/application.css por .scss.
4.Reemplaza el contenido de app/assets/stylesheets/application.scss por lo siguiente:
 @import "theme";
 @import "bootstrap";
5.Crea el archivo app/assets/stylesheets/theme.scss en donde vas a poder sobrescribir las variables de Bootstrap, por ejemplo:
 $text-color:                       #303030;
 `
Para ver la lista de variables que puedes sobrescribir sigue este enlace.
Eso es todo lo que necesitas para empezar a trabajar con Bootstrap en tus proyectos.
Autenticación con Devise
Envío de correos
Last modified 19d ago