diff --git a/src/anura.css b/src/anura.css index d6bcfc53..f05e945d 100755 --- a/src/anura.css +++ b/src/anura.css @@ -103,9 +103,9 @@ nav li { position: absolute; border: 1px solid #000000; background-color: rgba(0, 0, 0, 0.7); - border-radius: 20px; - padding: 10px 0; - width: 300px; + border-radius: 5px; + padding: 5px 0; + width: 150px; box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.5); z-index: 10000; @@ -116,6 +116,7 @@ nav li { color: #ffffff; cursor: pointer; user-select: none; + font-size: 14px; } .custom-menu-item:hover { background-color: rgba(255, 255, 255, 0.1); @@ -127,7 +128,7 @@ nav li { .custom-menu-item { display: flex; align-items: center; - padding: 8px 12px; + padding: 4px 12px; color: #ffffff; cursor: pointer; user-select: none; diff --git a/src/api/ContextMenuAPI.tsx b/src/api/ContextMenuAPI.tsx index 03164c9c..ac7872e1 100644 --- a/src/api/ContextMenuAPI.tsx +++ b/src/api/ContextMenuAPI.tsx @@ -35,12 +35,34 @@ class ContextMenuAPI { ); } show(x: number, y: number) { + // Reset out of bound fixes + this.#element.style.bottom = ""; + this.#element.style.right = ""; + this.#element.style.top = y.toString() + "px"; this.#element.style.left = x.toString() + "px"; document.body.appendChild(this.#element); this.#isShown = true; this.#element.focus(); + // Check for bounding and fix if necessary + console.log(this.#element.getBoundingClientRect()); + console.log(document.body.getBoundingClientRect()); + if ( + this.#element.getBoundingClientRect().bottom >= + document.body.getBoundingClientRect().bottom + ) { + this.#element.style.top = ""; + this.#element.style.bottom = 0; + } + if ( + this.#element.getBoundingClientRect().right >= + document.body.getBoundingClientRect().right + ) { + this.#element.style.left = ""; + this.#element.style.right = 0; + } + return this.#element; } hide() { diff --git a/src/coreapps/XFrogApp.tsx b/src/coreapps/XFrogApp.tsx index 9705481c..4c19416b 100644 --- a/src/coreapps/XFrogApp.tsx +++ b/src/coreapps/XFrogApp.tsx @@ -67,8 +67,8 @@ class XFrogApp extends App { if (this.activeWin && this.activeWin != win) { const newImg = document.createElement("img"); - const blob: any = await new Promise( - (resolve) => anura.x86?.vgacanvas.toBlob(resolve), + const blob: any = await new Promise((resolve) => + anura.x86?.vgacanvas.toBlob(resolve), )!; const url = URL.createObjectURL(blob); newImg.src = url;