diff --git a/docs/4.0/utilities/display.md b/docs/4.0/utilities/display.md
index d7cab21751..e00d5b6350 100644
--- a/docs/4.0/utilities/display.md
+++ b/docs/4.0/utilities/display.md
@@ -51,7 +51,7 @@ For faster mobile-friendly development, use responsive display classes for showi
To hide elements simply use the `.d-none` class or one of the `.d-{sm,md,lg,xl}-none` classes for any responsive screen variation.
-To show an element only on a given interval of screen sizes you can combine one `.d-*-none` class with a `.d-*-*` class, for example `.d-none .d-md-block .d-xl-none` will hide the element for all screen sizes except on medium and large devices.
+To show an element only on a given interval of screen sizes you can combine one `.d-*-none` class with a `.d-*-*` class, for example `.d-none .d-md-block .d-xl-block` will hide the element for all screen sizes except on medium and large devices.
| Screen Size | Class |
| --- | --- |
diff --git a/js/src/dropdown.js b/js/src/dropdown.js
index b877017f2b..2f69298540 100644
--- a/js/src/dropdown.js
+++ b/js/src/dropdown.js
@@ -183,7 +183,7 @@ const Dropdown = (($) => {
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement &&
$(parent).closest(Selector.NAVBAR_NAV).length === 0) {
- $('body').children().on('mouseover', null, $.noop)
+ $(document.body).children().on('mouseover', null, $.noop)
}
this._element.focus()
@@ -365,7 +365,7 @@ const Dropdown = (($) => {
// If this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
- $('body').children().off('mouseover', null, $.noop)
+ $(document.body).children().off('mouseover', null, $.noop)
}
toggles[i].setAttribute('aria-expanded', 'false')
diff --git a/js/src/modal.js b/js/src/modal.js
index 9237944df6..2ca56e7e2e 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -453,8 +453,8 @@ const Modal = (($) => {
// Adjust body padding
const actualPadding = document.body.style.paddingRight
- const calculatedPadding = $('body').css('padding-right')
- $('body').data('padding-right', actualPadding).css('padding-right', `${parseFloat(calculatedPadding) + this._scrollbarWidth}px`)
+ const calculatedPadding = $(document.body).css('padding-right')
+ $(document.body).data('padding-right', actualPadding).css('padding-right', `${parseFloat(calculatedPadding) + this._scrollbarWidth}px`)
}
}
@@ -476,9 +476,9 @@ const Modal = (($) => {
})
// Restore body padding
- const padding = $('body').data('padding-right')
+ const padding = $(document.body).data('padding-right')
if (typeof padding !== 'undefined') {
- $('body').css('padding-right', padding).removeData('padding-right')
+ $(document.body).css('padding-right', padding).removeData('padding-right')
}
}
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 65d9c2201c..861f45a86a 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -317,7 +317,7 @@ const Tooltip = (($) => {
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement) {
- $('body').children().on('mouseover', null, $.noop)
+ $(document.body).children().on('mouseover', null, $.noop)
}
const complete = () => {
@@ -375,7 +375,7 @@ const Tooltip = (($) => {
// If this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
- $('body').children().off('mouseover', null, $.noop)
+ $(document.body).children().off('mouseover', null, $.noop)
}
this._activeTrigger[Trigger.CLICK] = false
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 14f5b8b018..11f3255307 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -608,6 +608,8 @@ $nav-pills-border-radius: $border-radius !default;
$nav-pills-link-active-color: $component-active-color !default;
$nav-pills-link-active-bg: $component-active-bg !default;
+$nav-divider-margin-y: ($spacer / 2) !default;
+
// Navbar
$navbar-padding-y: ($spacer / 2) !default;
diff --git a/scss/mixins/_hover.scss b/scss/mixins/_hover.scss
index 56d313b661..57823e34ba 100644
--- a/scss/mixins/_hover.scss
+++ b/scss/mixins/_hover.scss
@@ -1,5 +1,3 @@
-// stylelint-disable indentation
-
// Hover mixin and `$enable-hover-media-query` are deprecated.
//
// Origally added during our alphas and maintained during betas, this mixin was
diff --git a/scss/mixins/_nav-divider.scss b/scss/mixins/_nav-divider.scss
index 493de03a34..3505d412f2 100644
--- a/scss/mixins/_nav-divider.scss
+++ b/scss/mixins/_nav-divider.scss
@@ -2,9 +2,9 @@
//
// Dividers (basically an hr) within dropdowns and nav lists
-@mixin nav-divider($color: #e5e5e5) {
+@mixin nav-divider($color: #e5e5e5, $margin-y: $nav-divider-margin-y) {
height: 0;
- margin: ($spacer / 2) 0;
+ margin: $margin-y 0;
overflow: hidden;
border-top: 1px solid $color;
}