mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-05-21 22:36:05 +08:00
Updated styles to use logical properties/values
- Intended to improve RTL support in the interface. - Also adds hebrew to language dropdown since that was missing. Related to #1794
This commit is contained in:
@ -11,6 +11,7 @@ class DropDown {
|
||||
this.menu = elem.querySelector('.dropdown-menu, [dropdown-menu]');
|
||||
this.moveMenu = elem.hasAttribute('dropdown-move-menu');
|
||||
this.toggle = elem.querySelector('[dropdown-toggle]');
|
||||
this.direction = (document.dir === 'rtl') ? 'right' : 'left';
|
||||
this.body = document.body;
|
||||
this.showing = false;
|
||||
this.setupListeners();
|
||||
@ -28,7 +29,11 @@ class DropDown {
|
||||
this.rect = this.menu.getBoundingClientRect();
|
||||
this.body.appendChild(this.menu);
|
||||
this.menu.style.position = 'fixed';
|
||||
this.menu.style.left = `${this.rect.left}px`;
|
||||
if (this.direction === 'right') {
|
||||
this.menu.style.right = `${(this.rect.right - this.rect.width)}px`;
|
||||
} else {
|
||||
this.menu.style.left = `${this.rect.left}px`;
|
||||
}
|
||||
this.menu.style.top = `${this.rect.top}px`;
|
||||
this.menu.style.width = `${this.rect.width}px`;
|
||||
}
|
||||
@ -67,7 +72,7 @@ class DropDown {
|
||||
this.toggle.setAttribute('aria-expanded', 'false');
|
||||
if (this.moveMenu) {
|
||||
this.menu.style.position = '';
|
||||
this.menu.style.left = '';
|
||||
this.menu.style[this.direction] = '';
|
||||
this.menu.style.top = '';
|
||||
this.menu.style.width = '';
|
||||
this.container.appendChild(this.menu);
|
||||
|
Reference in New Issue
Block a user