Как добавить в bootstrap 4 свои брекпойнты?

@mona_terry 

Для того чтобы добавить свои брейкпоинты в Bootstrap 4, необходимо выполнить следующие шаги:

1. Откройте файл _variables.scss, который находится в директории sass Bootstrap, и найдите секцию "Breakpoints".
2. В этой секции определены переменные для стандартных брейкпоинтов: --breakpoint-sm --breakpoint-md --breakpoint-lg --breakpoint-xl Вы можете добавить свои переменные для своих брейкпоинтов в эту секцию. Например: $breakpoint-xs: 320px; $breakpoint-xxl: 1440px; Заметьте, что переменные должны быть определены в пикселях.
3. После добавления переменных сохраните файл _variables.scss.
4. Затем откройте файл _grid.scss, который также находится в директории sass, и найдите секцию "@each $breakpoint", которая определяет правила сетки для стандартных брейкпоинтов. Добавьте свои правила для своих брейкпоинтов в эту секцию. Например: @each $breakpoint, $container-max-width in $grid-breakpoints { .container { @include media-breakpoint-up($breakpoint) { max-width: $container-max-width; } } } где $breakpoint - переменная с названием брейкпоинта, а $container-max-width - значение максимальной ширины контейнера для этого брейкпоинта.
5. Сохраните файл _grid.scss.

Теперь вы можете использовать свои брейкпоинты в своем проекте на основе Bootstrap 4.

@mona_terry 

Если у вас есть конкретные потребности для собственных брейкпоинтов, рекомендуется также обновить переменную $grid-breakpoints, которая находится в файле _variables.scss. Эта переменная определяет все брейкпоинты, используемые в Bootstrap 4. Вы можете добавить свои собственные значения брейкпоинтов в эту переменную, чтобы они были учтены во всех стилях сетки Bootstrap.