基金會5：改變媒體查詢範圍

Question

我有一個基金會5模板，我想知道是否改變媒體查詢範圍是個好主意。

它們目前在_global.scss文件中設置，但我想通過我的_custom.scss文件覆蓋它們，所以我將來沒有任何升級框架的麻煩。問題是如果我在_custom.css文件中設置變量$ small-range，$ medium-range等等，什麼都不會發生。

我app.scss目前包括：

@import "settings"; 
@import "foundation"; 
@import "custom"; 

我怎麼能做到這一點，而無需編輯默認設置和組件文件？

預先感謝您。

Answer 1

添加變量之前@import「基礎」

@import "settings"; 

$small-range: (0em, 40em); //max-width 640px, mobile-only styles 
$medium-range: (40.063em, 64em); // min-width 641px and max-width 1024px 
$large-range: (64.063em, 90em); // min-width 1024px and max-width 1440px 
$xlarge-range: (90.063em, 120em); //min-width 1441px and max-width 1920px 
$xxlarge-range: (120.063em);  //min-width 1921px 

@import "foundation"; 

，或者你可以創建自己的文件，如my_settings並添加這些樣式到這個文件：

@import "settings"; 
@import "my_settings"; 
@import "foundation"; 

如果你想改變一些範圍到px，更好地將所有範圍變成px從em