aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/Layout.mjs
diff options
context:
space:
mode:
Diffstat (limited to 'src/Layout.mjs')
-rw-r--r--src/Layout.mjs15
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 = () => {