diff --git a/src/scripts/choices.ts b/src/scripts/choices.ts index 80ab8308..409ded23 100644 --- a/src/scripts/choices.ts +++ b/src/scripts/choices.ts @@ -160,7 +160,7 @@ class Choices { _dropdownParent: HTMLElement | null; - _dropdownFixed: boolean; + _dropdownDetached: boolean; constructor( element: string | Element | HTMLInputElement | HTMLSelectElement = '[data-choice]', @@ -323,14 +323,14 @@ class Choices { return; } - // Position fixed for dropdown items - this._dropdownFixed = false; + // Dropdown is detached from the original wrapper + this._dropdownDetached = false; if (config.dropdownParent) { const parent = this._docRoot.querySelector(config.dropdownParent); if (parent) { - this._dropdownFixed = true; + this._dropdownDetached = true; this._dropdownParent = parent; } } @@ -530,7 +530,7 @@ class Choices { requestAnimationFrame(() => { this.dropdown.show(); - if (this._dropdownFixed) { + if (this._dropdownDetached) { const containerRect = this.containerOuter.element.getBoundingClientRect(); this.dropdown.element.style.top = `${containerRect.bottom}px`; this.dropdown.element.style.left = `${containerRect.left}px`; @@ -2298,7 +2298,7 @@ class Choices { this.input.setWidth(); } - if (this._dropdownFixed && this._dropdownParent instanceof HTMLElement) { + if (this._dropdownDetached && this._dropdownParent instanceof HTMLElement) { const { fixed } = this.config.classNames; dropdownParent = this._dropdownParent; addClassesToElement(dropdownElement, fixed); diff --git a/src/scripts/defaults.ts b/src/scripts/defaults.ts index 8ecc2829..950dff39 100644 --- a/src/scripts/defaults.ts +++ b/src/scripts/defaults.ts @@ -18,7 +18,6 @@ export const DEFAULT_CLASSNAMES: ClassNames = { itemChoice: ['choices__item--choice'], description: ['choices__description'], placeholder: ['choices__placeholder'], - fixed: ['choices__position--fixed'], group: ['choices__group'], groupHeading: ['choices__heading'], button: ['choices__button'], diff --git a/src/scripts/interfaces/class-names.ts b/src/scripts/interfaces/class-names.ts index e98c0c0a..3fda36cc 100644 --- a/src/scripts/interfaces/class-names.ts +++ b/src/scripts/interfaces/class-names.ts @@ -28,8 +28,6 @@ export interface ClassNames { description: string | Array; /** @default ['choices__placeholder'] */ placeholder: string | Array; - /** @default ['choices__position-fixed'] */ - fixed: string | Array; /** @default ['choices__group'] */ group: string | Array; /** @default ['choices__heading'] */ diff --git a/src/styles/choices.scss b/src/styles/choices.scss index 888f774a..9b02e5e4 100644 --- a/src/styles/choices.scss +++ b/src/styles/choices.scss @@ -272,10 +272,6 @@ $choices-placeholder-opacity: 0.5 !default; } } -.#{$choices-selector}__position--fixed { - position: fixed !important; -} - %choices-dropdown { display: none; z-index: var(--choices-z-index, #{$choices-z-index});