mirror of
https://github.com/mathuo/dockview
synced 2025-09-05 00:46:35 +00:00
Merge pull request #724 from amirmamaghani/master
Added support for custom overlay z-index
This commit is contained in:
commit
12bb6f6d20
@ -13,8 +13,6 @@ import { CompositeDisposable, MutableDisposable } from '../lifecycle';
|
|||||||
import { clamp } from '../math';
|
import { clamp } from '../math';
|
||||||
import { AnchoredBox } from '../types';
|
import { AnchoredBox } from '../types';
|
||||||
|
|
||||||
export const DEFAULT_OVERLAY_Z_INDEX = 999;
|
|
||||||
|
|
||||||
class AriaLevelTracker {
|
class AriaLevelTracker {
|
||||||
private _orderedList: HTMLElement[] = [];
|
private _orderedList: HTMLElement[] = [];
|
||||||
|
|
||||||
@ -37,9 +35,9 @@ class AriaLevelTracker {
|
|||||||
private update(): void {
|
private update(): void {
|
||||||
for (let i = 0; i < this._orderedList.length; i++) {
|
for (let i = 0; i < this._orderedList.length; i++) {
|
||||||
this._orderedList[i].setAttribute('aria-level', `${i}`);
|
this._orderedList[i].setAttribute('aria-level', `${i}`);
|
||||||
this._orderedList[i].style.zIndex = `${
|
this._orderedList[i].style.zIndex = `calc(var(--dv-floating-z-index) + ${
|
||||||
DEFAULT_OVERLAY_Z_INDEX + i * 2
|
i * 2
|
||||||
}`;
|
})`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -9,7 +9,6 @@ import {
|
|||||||
} from '../lifecycle';
|
} from '../lifecycle';
|
||||||
import { IDockviewPanel } from '../dockview/dockviewPanel';
|
import { IDockviewPanel } from '../dockview/dockviewPanel';
|
||||||
import { DockviewComponent } from '../dockview/dockviewComponent';
|
import { DockviewComponent } from '../dockview/dockviewComponent';
|
||||||
import { DEFAULT_OVERLAY_Z_INDEX } from './overlay';
|
|
||||||
|
|
||||||
export type DockviewPanelRenderer = 'onlyWhenVisible' | 'always';
|
export type DockviewPanelRenderer = 'onlyWhenVisible' | 'always';
|
||||||
|
|
||||||
@ -137,9 +136,9 @@ export class OverlayRenderContainer extends CompositeDisposable {
|
|||||||
const level = Number(
|
const level = Number(
|
||||||
element.getAttribute('aria-level')
|
element.getAttribute('aria-level')
|
||||||
);
|
);
|
||||||
focusContainer.style.zIndex = `${
|
focusContainer.style.zIndex = `calc(var(--dv-floating-z-index) + ${
|
||||||
DEFAULT_OVERLAY_Z_INDEX + level * 2 + 1
|
level * 2 + 1
|
||||||
}`;
|
})`;
|
||||||
};
|
};
|
||||||
|
|
||||||
const observer = new MutationObserver(() => {
|
const observer = new MutationObserver(() => {
|
||||||
|
@ -8,6 +8,7 @@
|
|||||||
--dv-tabs-container-scrollbar-color: #888;
|
--dv-tabs-container-scrollbar-color: #888;
|
||||||
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
|
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
|
||||||
--dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
|
--dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
|
||||||
|
--dv-floating-z-index: 999;
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin dockview-theme-dark-mixin {
|
@mixin dockview-theme-dark-mixin {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user