如何覆蓋scss變量？

我目前使用materialize.css，我想重寫默認變量，以便主文件保持不變。我試圖在我的主stylesheet.scss就像如何覆蓋scss變量？

@import '_materialize'; 
@import '_modified'; 
@import '_new';

在我_modified文件我設置

$secondary-color: color("blue", "darken-1");

在materialize.scss，_variable.scss已經導入（默認框架文件）中哪個二級色值是

$secondary-color: color("teal", "lighten-1") !default;

仍然繼發顏色保持teal.How如果用這樣的外部scss文件覆蓋？

編輯1：找到解決方案。

$secondary-color: color("teal", "lighten-1") !default;

不是由於不加載CSS物質化的色彩混入文件的工作。

在modified.scss @import "materialize/components/color";然後

$secondary-color:color("teal", "lighten-5");

現在的作品後。

來源

2017-05-04 Shashank Bhatt

你試過'！important;'後面的顏色是這樣的：'$ secondary-color：color（「blue」，「darken-1」）！important;'？ –

這很有趣，我會認爲這會起作用。你有沒有嘗試過，先把你的'修改過的'文件？ 'materialize'中的'！default'標誌意味着該值只有在尚未設置的情況下才會被設置。另外，一個有趣的事實 - 當你導入它時，你可以從你的文件名中省略'_'，Sass知道它是一個部分。 –

在_materialize之上添加修改會導致括號編輯器編譯器中的錯誤 –

見下例

$secondary-color: color("blue", "darken-1"); 
.someClass{ 
     $secondary-color: color("teal", "darken-1") !important; 
     .someClass h2{ 
      color: $secondary-color; 
     } 
}

來源

2017-05-04 10:06:07

導入您瓦爾第一（不過去）：

@import '_your-vars'; // your own vars 
@import '_materialize'; // includes framework vars 
... // other modifications

據我瞭解SCSS !default標誌：它是一個回退，沒事的時候之前已經宣佈。所以，當你首先導入你的變量（只有變量，沒有其他可能有依賴關係的修改）時，它才能工作。

來源

2017-08-26 19:52:30

如何覆蓋scss變量？

回答

相關問題