feat: hide btns using shadow DOM

require Firefox >= 63, Chrome >= 53, Opera >= 40, Safari >= 10, or Chromium based Edge
This commit is contained in:
Xmader 2020-11-07 21:28:32 -05:00
parent 13afe431c8
commit 8763e86c39
No known key found for this signature in database
GPG Key ID: A20B97FB9EB730E4
1 changed files with 12 additions and 1 deletions

View File

@ -93,7 +93,18 @@ export class BtnList {
* replace the template button with the list of new buttons
*/
commit (): void {
this.templateBtn.replaceWith(...this.list)
const parent = this.templateBtn.parentElement as HTMLDivElement
const shadow = parent.attachShadow({ mode: 'closed' })
// style the shadow DOM from outside css
document.head.querySelectorAll('style').forEach(s => {
shadow.append(s.cloneNode(true))
})
// hide buttons using the shadow DOM
const newParent = parent.cloneNode(false) as HTMLDivElement
newParent.append(...this.list)
shadow.append(newParent)
}
}