Вариант пуговица не работает в начальной загрузке 5 ⇐ CSS

[Anonymous]

Я пытаюсь создать навигационную панель с помощью пользовательских кнопок с радиальным градиентом, и я попытался использовать градиент-радиальный и пуговица-вариант, но они не работают, так как в том, что пользовательский класс, который я сделал для конкретной кнопки, просто не показывает, когда я проверяю на хромовом Devtools, он показывает только базовый. Alt = "Так выглядит на Devtools" src = "https://i.sstatic.net/z4pqwaqm.png"/>
Я новичок в SASS и просто использую его для настройки, так что проблема, вероятно, есть. .btn-menu ):
// custom variables
$enable-gradients: true;
$primario: #1C0E29;
$secundario: #FFEAF2;
$violeta: #41193a;
$transparente: #41193a00;

// import functions and variables
@import "../node_modules/bootstrap/scss/functions";
@import "../node_modules/bootstrap/scss/variables";

// custom theme colors map
$arcane-colores: (
"primario": $primario,
"secundario": $secundario,
"violeta": $violeta,
"transparente": $transparente,
);

$theme-colors: map-merge($arcane-colores, $theme-colors);

// añado lo otro para poder cambiar los colores
@import "../node_modules/bootstrap/scss/maps";
@import "../node_modules/bootstrap/scss/mixins";
@import "../node_modules/bootstrap/scss/utilities";
@import "../node_modules/bootstrap/scss/mixins/buttons";
@import "../node_modules/bootstrap/scss/functions";
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/mixins";
@import "../node_modules/bootstrap/scss/root";
@import "../node_modules/bootstrap/scss/reboot";
@import "../node_modules/bootstrap/scss/type";
@import "../node_modules/bootstrap/scss/images";
@import "../node_modules/bootstrap/scss/grid";
@import "../node_modules/bootstrap/scss/tables";
@import "../node_modules/bootstrap/scss/forms";
@import "../node_modules/bootstrap/scss/buttons";
@import "../node_modules/bootstrap/scss/utilities";

// degradados
.bg-header {
@include gradient-y($violeta, $transparente);
}

.bg-nav {
@include gradient-radial($transparente, rgba(186, 110, 140, 0.15));
}

.btn-menu {
@include button-variant(
$background: $violeta,
$border: $transparente
);
}

// poner bootstrap y utilidades
@import '../node_modules/bootstrap/scss/bootstrap.scss';
@import "../node_modules/bootstrap/scss/utilities/api";
< /code>
И это Navbar, который будет иметь пользовательский класс кнопки < /p>

• Inicio
• Tabla
• Galeria
• Formulario

Подробнее здесь: https://stackoverflow.com/questions/796 ... ootstrap-5