diff options
Diffstat (limited to 'src/Layout.mjs')
-rw-r--r-- | src/Layout.mjs | 15 |
1 files changed, 15 insertions, 0 deletions
diff --git a/src/Layout.mjs b/src/Layout.mjs index d0fde0f..23588a1 100644 --- a/src/Layout.mjs +++ b/src/Layout.mjs | |||
@@ -157,9 +157,24 @@ export class Overlay extends Layout { | |||
157 | .finished | 157 | .finished |
158 | .finally(() => this.addDraggable(wrapper)) | 158 | .finally(() => this.addDraggable(wrapper)) |
159 | 159 | ||
160 | // Trivial case: | ||
161 | // This hack make sure utils remains at the same place even when wrapper resized | ||
162 | // Prevent DOMRect changes when user clicking plus/minus button many times | ||
163 | const utils = wrapper.querySelector('.utils') | ||
164 | utils.onmouseover = () => { | ||
165 | const { left, top } = utils.getBoundingClientRect() | ||
166 | utils.style.cssText = `visibility: visible; z-index: 9000; position: fixed; transition: unset; left: ${left}px; top: ${top}px;` | ||
167 | document.body.appendChild(utils) | ||
168 | } | ||
169 | utils.onmouseout = () => { | ||
170 | wrapper.appendChild(utils) | ||
171 | utils.removeAttribute('style') | ||
172 | } | ||
173 | |||
160 | // Close button | 174 | // Close button |
161 | wrapper.querySelector('#close').onclick = () => { | 175 | wrapper.querySelector('#close').onclick = () => { |
162 | wrapper.classList.add('hide') | 176 | wrapper.classList.add('hide') |
177 | utils.removeAttribute('style') | ||
163 | } | 178 | } |
164 | // Plus/Minus font-size of content | 179 | // Plus/Minus font-size of content |
165 | wrapper.querySelector('#plus-font-size').onclick = () => { | 180 | wrapper.querySelector('#plus-font-size').onclick = () => { |