m/mtm-rpn-js
1
0
Fork 0
Code Issues Actions Activity

fix: align calc menus with trigger width

Browse Source
This commit is contained in:
MatMoul
2026-05-16 03:41:25 +02:00
parent a37ed59b40
commit 6a7a60a9bc
2 changed files with 21 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
samples/calc-02/index.js
+4 -6
View File
@@ -357,6 +357,7 @@ function toggleModeMenu() {
modeMenuEl = document.createElement('div');
modeMenuEl.className = 'mode-menu';
modeMenuEl.style.top = `${rect.bottom + 6 + window.scrollY}px`;
modeMenuEl.style.minWidth = `${rect.width}px`;
modeOptions.forEach((mode) => {
const button = document.createElement('button');
button.type = 'button';
@@ -370,9 +371,7 @@ function toggleModeMenu() {
modeMenuEl.appendChild(button);
});
document.body.appendChild(modeMenuEl);
const menuRect = modeMenuEl.getBoundingClientRect();
const maxLeft = Math.max(8, window.innerWidth - menuRect.width - 8);
modeMenuEl.style.left = `${Math.max(8, Math.min(maxLeft, rect.left + window.scrollX))}px`;
modeMenuEl.style.left = `${rect.left + window.scrollX}px`;
}
modeButton.addEventListener('click', (event) => {
@@ -451,6 +450,7 @@ function toggleConstMenu() {
constMenuEl = document.createElement('div');
constMenuEl.className = 'mode-menu';
constMenuEl.style.top = `${rect.bottom + 6 + window.scrollY}px`;
constMenuEl.style.minWidth = `${rect.width}px`;
const availableConstants = calc.listConstants();
const keys = [...constantOrder, ...Object.keys(availableConstants).filter((name) => !constantOrder.includes(name))];
keys.forEach((name) => {
@@ -472,9 +472,7 @@ function toggleConstMenu() {
constMenuEl.appendChild(button);
});
document.body.appendChild(constMenuEl);
const menuRect = constMenuEl.getBoundingClientRect();
const desiredLeft = rect.right + window.scrollX - menuRect.width;
constMenuEl.style.left = `${Math.max(8, desiredLeft)}px`;
constMenuEl.style.left = `${rect.left + window.scrollX}px`;
}
constButton.addEventListener('click', (event) => {