scss bootstrap 4 перезаписать карту

Question

Я пробую свои силы в scss, используя Bootstrap 4, и я не знаю, как перезаписать переменную (используя карту) correclty

custom.scss

// Your variable overrides
$primary: rgb(40, 167, 36);

$spacer: 1;
$spacers: (
  0: 0,
  1: ($spacer * .2),
  2: ($spacer * 3),
  3: $spacer,
  4: ($spacer * 8),
  5: ($spacer * 12),
  6: ($spacer * 50)
);


// Bootstrap and its default variables
@import "../node_modules/bootstrap/scss/bootstrap";

Перезапись основного цвета работает нормально, а проставки - нет.

Как сейчас, кажется, что все значения равны 0, когда я добавляю класс, такой как "mt-5", он не 'ничего не изменить.

Я не знаю, что я делаю не так.

Answer 1

Вот как добавить проставки на карту.Проблема в том, что spacer не имеет единиц измерения.Используйте px или rem, чтобы определить spacer единицу ...

$spacer: 1rem;
$spacers: (
  0: 0,
  1: ($spacer * .2),
  2: ($spacer * 3),
  3: $spacer,
  4: ($spacer * 8),
  5: ($spacer * 12),
  6: ($spacer * 50)
);

https://www.codeply.com/go/TY8XqnvzO9