rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-20 17:54:23 +01:00
Code Issues Actions Packages Releases Activity

Dropdown — Change the selector to check the use of Popper (#33003)

Browse Source 
* Create the popper instance first

Make sure that popper instance has been created first and then apply the
styling on the dropdown(menu)

* Use `data-bs-popper` attibute to check popper

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
Rohit Sharma 2021-02-10 00:34:23 +05:30 committed by GitHub
parent 91d3da1f3d
commit 29e0c9dfa1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
js/src/dropdown.js
View File

@ -181,11 +181,11 @@ class Dropdown extends BaseComponent {
const popperConfig = this._getPopperConfig()
const isDisplayStatic = popperConfig.modifiers.find(modifier => modifier.name === 'applyStyles' && modifier.enabled === false)
this._popper = Popper.createPopper(referenceElement, this._menu, popperConfig)
if (isDisplayStatic) {
Manipulator.setDataAttribute(this._menu, 'popper', 'static')
}
this._popper = Popper.createPopper(referenceElement, this._menu, popperConfig)
}
// If this is a touch-enabled device we add extra

11
scss/_dropdown.scss
View File

@ -34,6 +34,7 @@
&[data-bs-popper] {
left: 0;
margin-top: $dropdown-spacer;
}
}
@ -73,7 +74,7 @@
top: auto;
bottom: 100%;
&.show:not([data-popper-placement]) {
&[data-bs-popper] {
margin-top: 0;
margin-bottom: $dropdown-spacer;
}
@ -90,7 +91,7 @@
right: auto;
left: 100%;
&.show:not([data-popper-placement]) {
&[data-bs-popper] {
margin-top: 0;
margin-left: $dropdown-spacer;
}
@ -110,7 +111,7 @@
right: 100%;
left: auto;
&.show:not([data-popper-placement]) {
&[data-bs-popper] {
margin-top: 0;
margin-right: $dropdown-spacer;
}
@ -187,10 +188,6 @@
.dropdown-menu.show {
display: block;
&:not([data-popper-placement]) {
margin-top: $dropdown-spacer;
}
}
// Dropdown section headers