Merge pull request 'Positioning, font size, and close on click menu item' (#2) from dropdown-style into pages

Reviewed-on: https://codeberg.org/macchiato/menu/pulls/2

dropdown.js

@@ -55,7 +55,7 @@ export class Dropdown extends HTMLElement {
       }
       button {
         background: #222;
-        font-size: 120%;
+        font-size: 16px;
         border: none;
         color: inherit;
         padding: 8px 10px;
@@ -73,7 +73,7 @@ export class Dropdown extends HTMLElement {
     )
     style.setProperty(
       '--anchor-bottom',
-      `${window.scrollY + rect.bottom}px`
+      `${window.scrollY + rect.bottom - 3}px`
     )
     style.setProperty(
       '--window-height', `${window.height}px`
@@ -82,7 +82,6 @@ export class Dropdown extends HTMLElement {
       '--window-width', `${window.width}px`
     )
     this.dialogEl.showModal()
-    this.dialogEl.classList.add('opened')
   }
 
   close() {
@@ -94,9 +93,7 @@ export class Dropdown extends HTMLElement {
     btn.innerText = text
     this.dialogEl.appendChild(btn)
     btn.addEventListener('click', () => {
-      this.dispatchEvent(new CustomEvent(
-        'close-menu', {bubbles: true}
-      ))
+      this.close()
       if (handler !== undefined) {
         handler()
       }