diff options
Diffstat (limited to 'site/content/docs/5.0/migration.md')
| -rw-r--r-- | site/content/docs/5.0/migration.md | 44 |
1 files changed, 44 insertions, 0 deletions
diff --git a/site/content/docs/5.0/migration.md b/site/content/docs/5.0/migration.md index 7691d20c15..0cf0618e47 100644 --- a/site/content/docs/5.0/migration.md +++ b/site/content/docs/5.0/migration.md @@ -9,6 +9,50 @@ toc: true ## v5.0.0-beta1 +### RTL + +**The RTL feature is still experimental and will probably evolve according to user feedback.** Spotted something or have an improvement to suggest? [Open an issue]({{< param repo >}}/issues/new), we'd love to get your insights. + +#### Sass + +Horizontal direction sensitive variables, utilities and mixins are renamed with more logical names — `start` and `end` in lieu of `left` and `right`. + +##### Components + +- Renamed `.dropleft` and `.dropright` to `.dropstart` and `dropend`. +- Renamed `.dropdown-menu-*-left` and `.dropdown-menu-*-right` to `.dropdown-menu-*-start` and `.dropdown-menu-*-end`. +- Renamed `.bs-popover-left` and `.bs-popover-right` to `.bs-popover-start` and `.bs-popover-end`. +- Renamed `.bs-tooltip-left` and `.bs-tooltip-right` to `.bs-tooltip-start` and `.bs-tooltip-end`. +- Renamed `.carousel-item-left` and `.carousel-item-right` to `.carousel-item-start` and `.carousel-item-end`. + +##### Utilities + +- Renamed `.left-*` and `.right-*` to `.start-*` and `.end-*`. +- Renamed `.float-left` and `.float-right` to `.float-start` and `.float-end`. +- Renamed `.border-left` and `.border-right` to `.border-start` and `.border-end`. +- Renamed `.rounded-left` and `.rounded-right` to `.rounded-start` and `.rounded-end`. +- Renamed `.ml-*` and `.mr-*` to `.ms-*` and `.me-*`. +- Renamed `.pl-*` and `.pr-*` to `.ps-*` and `.pe-*`. +- Renamed `.text-left` and `.text-right` to `.text-start` and `.text-end`. + +Breakpoints specific variants are consequently renamed too (eg. `.text-md-start` replaces `.text-md-left`). + +##### Mixins + +- Renamed `border-left-radius()` and `border-right-radius()` to `border-start-radius()` and `border-end-radius()` — as well as their corner relative variants (eg. `.border-bottom-left-radius` became `.border-bottom-start-radius`). +- Renamed `caret-left()` and `caret-right()` to `caret-start()` and `caret-end()` — subsequently, the `caret()` mixin now takes `start` and `end` as arguments instead of `left` and `right`. + +##### Variables + +- New `$breadcrumb-divider-flipped` if a different breadcrumb separator is needed in RTL. +- Renamed `$navbar-brand-margin-right` to `$navbar-brand-margin-end`. +- Renamed `$pagination-margin-left` to `$pagination-margin-start`. +- Renamed `$form-check-padding-left` to `$form-check-padding-start`. +- Renamed `$form-switch-padding-left` to `$form-switch-padding-start`. +- Renamed `$form-check-inline-margin-right` to `$form-check-inline-margin-end`. +- Renamed `$form-select-feedback-icon-padding-right` to `$form-select-feedback-icon-padding-end`. + + ### JavaScript - Data attributes for all JavaScript plugins are now namespaced to help distinguish Bootstrap functionality from third parties and your own code. For example, we use `data-bs-toggle` instead of `data-toggle`. |