英文:
Assigning a variable to a variable in bootstrap using custom.scss
问题
我已经找了半天的答案了。我试图将$primary变量的值从默认的$blue更改为$orange变量。如果我像文档中这样做：
$primary: red;
@import '../bootstrap-5.2.3/scss/_variables';
@import "../bootstrap-5.2.3/scss/bootstrap";
这样做是有效的，但不是我要找的。我试图像这样将一个变量分配给另一个变量：
@import '../bootstrap-5.2.3/scss/_variables';
@import "../bootstrap-5.2.3/scss/bootstrap";
$primary: $orange;
无论我是在声明之后还是之前导入bootstrap，都无法在编译为CSS后将$orange变量分配给$primary。
我做错了什么？
谢谢。
英文:
I'm looking an answer for half a day now. I'm trying to change $primary variable value from default $blue to $orange variable.
If I do it like in the docs:
$primary: red;
@import '../bootstrap-5.2.3/scss/_variables';
@import "../bootstrap-5.2.3/scss/bootstrap";
It works but it's not what I'm looking for. I'm trying to assign a variable to a variable like this:
@import '../bootstrap-5.2.3/scss/_variables';
@import "../bootstrap-5.2.3/scss/bootstrap";
$primary: $orange;
However I'm trying to do this, either by importing bootstrap after or before the declaration, there is no way I'd have an $orange variable assigned to $primary after compilation to css.
What am I doing wrong ?
Thanks.
答案1
得分: 1
以下是翻译好的部分：
@import "functions"; // 必需
@import "variables"; // 必需因为我们在引用现有的 $orange 变量
$primary: $orange; // 设置主色
// 与现有的 theme-colors 映射合并
$theme-colors: map-merge($theme-colors, (
"primary": $primary
));
@import "bootstrap";
链接：https://codeply.com/p/RaDCJdXvE0
另请参考：https://stackoverflow.com/questions/38792005/how-to-change-the-bootstrap-primary-color
英文:
For the latest Bootstrap 5.3, the order would be...
@import "functions"; // required
@import "variables"; // required because we're referring to existing $orange var
$primary: $orange; // set primary
// merge with existing theme-colors map
$theme-colors: map-merge($theme-colors, (
"primary": $primary
));
@import "bootstrap";
https://codeply.com/p/RaDCJdXvE0
Also see: https://stackoverflow.com/questions/38792005/how-to-change-the-bootstrap-primary-color
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论