css - not - rails bootstrap template
Reemplazando las variables de Bootstrap en Rails con la gema bootstrap-sass (2)
Estoy usando la gema bootstrap-sass (Bootstrap 3.0) de Thomas McDonald. Seguí el tutorial Bootstrap and Rails de Daniel Kehoe.
Tengo application.css.scss que tiene lo siguiente en la parte superior:
/*
*= require_self
*= require_tree .
*/
Y tengo framework_and_overrides.css.scss que tiene esta línea en él:
@import "bootstrap";
Ahora traté de sobreescribir las variables de $body-bg: #f00; arranque ( $body-bg: #f00; ) que encontré here y colocarlas en cualquiera de estos dos archivos, pero nada cambia. ¿Qué estoy haciendo mal?
Puede anular variables simplemente redefiniendo la variable antes de la directiva @import .
Por ejemplo:
$navbar-default-bg: #312312;
$light-orange: #ff8c00;
$navbar-default-color: $light-orange;
@import "bootstrap";
ver el ciclo de ejecución. en el archivo bootstrap, la representación de archivos de esta manera, como "get variable> y apply in navbar" esto realmente sucede cuando se comienza a ejecutar el archivo bootstrap. Su presente dentro del bootstrap, mira el flujo secuencial de la importación. , la variable está obteniendo de bootstrap / variables y configurando el color vavbar en bootstrap / navbar, esto aplicando el color en la barra de navegación con la variable navbar-default-bg .
lo que realmente están haciendo los programadores es intentar configurar el valor de la variable después de configurar el color en la barra de navegación. (antes o después de la instrucción "@importing bootstrap", los cambios de la variable no harán cambios en el color de la barra de navegación, deberán editarse en el archivo bootstrap)
mira en el siguiente código si quieres cambiar el color tienes que hacer lo siguiente.
dentro del archivo bootstrap
// Variables principales y mixins
@import "bootstrap / variables";
// Componentes
@import "bootstrap / navs";
$ navbar-default-bg: rojo; // inicializa $ navbar-default-bg (después de importar bootstrap / variables)
@import "bootstrap / navbar"; aquí la configuración de color está funcionando "
esto funcionará bien, analiza el ciclo de ejecución.
pero sugiero usar las otras clases manuales para aplicar el color bg en lugar de sobre la variable de rutina de arranque.