diff --git a/dialog.js b/dialog.js index 8a62e28..f4246dc 100644 --- a/dialog.js +++ b/dialog.js @@ -27,7 +27,7 @@ export class Dialog extends HTMLElement { const style = document.createElement('style') style.textContent = ` dialog { - margin-top: 120px; + margin-top: var(--margin-top, --120px); min-width: 200px; border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 6px; @@ -59,8 +59,8 @@ export class Dialog extends HTMLElement { this.footerEl.setAttribute('part', 'footer') } - open() { - this.dialogEl.showModal(); + open(anchor = undefined) { + this.dialogEl.showModal() this.dialogEl.classList.add('opened') } @@ -70,7 +70,7 @@ export class Dialog extends HTMLElement { setTimeout(() => { this.dialogEl.close() this.dialogEl.classList.remove('closing') - }, 500) + }, 350) } clickedInside(e, el) { @@ -82,4 +82,12 @@ export class Dialog extends HTMLElement { e.clientX <= rect.left + rect.width ) } + + set top(v) { + style.setProperty('--margin-top', `${v}px`) + } + + get top() { + return style.getProperty('--margin-top') + } } \ No newline at end of file