为什么我不能覆盖 BootstrapVue 中的容器填充变量？

Question

我正在为 BootstrapVue 2.0（使用 Bootstrap 4.3）构建一个主题 VueBootstrap theming guide。我有一个 theme.scss 文件，它在开头有我的覆盖并在末尾导入基本样式。我正在尝试覆盖默认的容器水平填充，但它似乎不起作用。

theme.scss

$container-padding-x: 30px !default;

@import 'bootstrap/scss/bootstrap.scss';
@import 'bootstrap-vue/src/index.scss';

容器左右两侧的内边距保持默认15px。

此外，如果我尝试覆盖装订线宽度，它会起作用，并且更改甚至会调整容器填充，因为容器填充是装订线宽度的一半。

$grid-gutter-width: 60px !default;

为什么变量覆盖存在差异？

Answer 1

$container-padding-x 不是 Bootstrap v4 中的变量。3.x（但尚未发布 v5.x）

网格填充的控制由 $grid-gutter-width 控制，它应用于行（$grid-gutter-width / 2 的负边距）和列的填充 ($grid-gutter-width / 2)

containers 也得到 x-padding 的 $grid-gutter-width / 2

Why can't I override the container padding variable in BootstrapVue?