Z-index on TJSDialogs

For some reason TJSDialogs have an insane z-index value which makes them always appear on top of other dialogs. This leads to some dialogs opening up behind the TJSDialogs leading users to believe that a dialog hasn't been opened. Example dialog
export default class ActionConfigDialog extends TJSDialog {
constructor(itemDocument, actionId, actionName) {
super({
title: actionName,
content: {
class: ActionConfigDialogComponent,
props: { actionId, itemDocument }
}
}, {
classes: ['a5e-sheet', 'a5e-sheet--action'],
width: 555,
height: 592,
resizable: true
});

this.data.content.props.dialog = this;
}
}
export default class ActionConfigDialog extends TJSDialog {
constructor(itemDocument, actionId, actionName) {
super({
title: actionName,
content: {
class: ActionConfigDialogComponent,
props: { actionId, itemDocument }
}
}, {
classes: ['a5e-sheet', 'a5e-sheet--action'],
width: 555,
height: 592,
resizable: true
});

this.data.content.props.dialog = this;
}
}
No description
2 Replies
TyphonJS (Michael)
Yeah.. It's intended behavior to have dialogs be way above normal applications. This is based on my UX opinions that a dialog should grab attention and more or less be used for short term UX purposes in general. If you want behavior similar to an application set the zIndex value to null when creating the dialog and it will behave like a normal application. Certainly this is one area that will be aided from documentation / tutorials, etc.
Nekro Darkmoon
Nekro Darkmoon15mo ago
sweet tyvm 👌