我无法修改rails应用程序中的引导程序变量变量

我正在使用主题grasyscale-sass，主要是在项目的一个链接和它工作正常，其他链接使用它自己的SCSS文件。在这个scss文件中，我想将某些引导变量更改为navbar-default-bg等，但在文件application.html.erb中包含两个scss文件（application.scss和我的custom.scss文件）以及stylesheet_link_tag，在custom.scss中获取我对这些变量所做的更改，我认为始终应用默认值，但正常代码CSS已被修改。我无法修改rails应用程序中的引导程序变量变量

任何线索我做错了什么？或者我想做一些“禁止”的事情？

在此先感谢。

/**************/

这里application.html.erb文件，这两个文件SCSS如何在内，无论是在资产/样式

<%= stylesheet_link_tag 'application', 'custom', media: 'all', 'data-turbolinks-track' => true %>

custom.scss文件

$link-color: #cb2027; 
$brand-primary: #cb2027; 
$body-bg: #e9e9e9; 
$navbar-default-brand-color: #cb2027; 
$navbar-default-bg:#ffffff; /* Navbar default */ 
$navbar-height: 30px; 

$pagination-active-bg: #cb2027; 
$pagination-active-border: #cb2027; 

i{ 
    color: #337ab7; 
} 

a{ 
    color: #cb2027; 
} 

@import "bootstrap"; 
@import "bootstrap-sprockets"; 

.center { 
    text-align: center; 
} 

.navbar-brand{ 
    font-size: 2em; 
    font-weight: bold; 
} 
...

和的application.js文件，包括资产/ JavaScript的

// 
//= require_self 
//= require jquery 
//= require jquery_ujs 
//= require jquery.easing 
//= require jquery.turbolinks 
//= require turbolinks 
//= require bootstrap-sprockets 
//= require bootstrap 
// require.js 
//= require grayscale 
//= require masonry/jquery.masonry 
// require_tree .

来源

2015-11-02 Kalasni

'application.css'就是肉，JavaScript是并不重要的顺序。 – BroiSatse

导入引导样式应用程序/资产/样式表/ application.scss

@import "bootstrap";和@import "bootstrap-sprockets";进去application.scss以及任何其他样式表。

没有进入你怎么能/应设置你的目录中的样式表，变量/混入等你的变量需要来引导之前application.scss和其他自定义的后：

由于您使用的一个主题所有准备好的变量都用于定制基本引导程序样式，您必须更改这些灰度变量和/或样式才能将它们更改为所需的样式。

*在这个例子中_variables = grayscale_variables从主题和main.scss基本上是application.scss。

application.scss

@import "grayscale_variables"; 
@import "bootstrap-sprockets"; 
@import "bootstrap"; 
@import "font-awesome-sprockets"; 
@import "font-awesome"; 
@import "_grayscale"; 
@import "style";

grayscale_variables。SCSS

$grayscale-primary: #cb2027; 
$grayscale-dark: #e9e9e9; 
$grayscale-light: #cb2027; 

$grayscale-body-font-family: "Lora","Helvetica Neue",Helvetica,Arial,sans-serif; 
$grayscale-headline-font-family: "Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif; 

$navbar-height: 30px; 
$pagination-active-bg: #cb2027; 
$pagination-active-border: #cb2027;

（*只有一个自举JS应该用）见bootstrap-sass bootstrap- 链轮和引导不应同时被列入的application.js

来源

2015-11-02 22:13:31 vanburen

查看已更新的答案。 – vanburen

我应用.scss，但仍未实现一些变量，例如$ body-bg，$ navbar-default-bg等等，我认为它使用灰度级sass主题的main.css。

我也试着改变一些@import

$link-color: #cb2027; 
$brand-primary: #cb2027; 
$body-bg: #e9e9e9; 
$body-bg: #fff; 
$navbar-default-brand-color: #cb2027; 
$navbar-default-bg: #f8f8f8; 
$navbar-height: 30px; 

$pagination-active-bg: #cb2027; 
$pagination-active-border: #cb2027; 

@import 'masonry/transitions'; 
@import 'bootstrap-sprockets'; 
@import 'bootstrap'; 
@import 'custom'; 
@import '../../../grayscale-sass/asset/sass/main.scss';

来源

2015-11-03 17:06:43 Kalasni

我无法修改rails应用程序中的引导程序变量变量

回答

相关问题