diff options
Diffstat (limited to 'src/Layout.mjs')
-rw-r--r-- | src/Layout.mjs | 22 |
1 files changed, 2 insertions, 20 deletions
diff --git a/src/Layout.mjs b/src/Layout.mjs index 04acc3d..8c6a8ea 100644 --- a/src/Layout.mjs +++ b/src/Layout.mjs | |||
@@ -125,15 +125,12 @@ const addDraggable = (element, { snap, left, top } = {}) => { | |||
125 | }) | 125 | }) |
126 | 126 | ||
127 | // FIXME use pure CSS to hide utils | 127 | // FIXME use pure CSS to hide utils |
128 | const utils = element.querySelector('.utils') | ||
129 | draggable.onDragStart = () => { | 128 | draggable.onDragStart = () => { |
130 | if (utils) utils.style.display = 'none' | 129 | element.classList.add('dragging') |
131 | element.classList.add('drag') | ||
132 | } | 130 | } |
133 | 131 | ||
134 | draggable.onDragEnd = () => { | 132 | draggable.onDragEnd = () => { |
135 | if (utils) utils.style = '' | 133 | element.classList.remove('dragging') |
136 | element.classList.remove('drag') | ||
137 | element.style.zIndex = '9000' | 134 | element.style.zIndex = '9000' |
138 | } | 135 | } |
139 | 136 | ||
@@ -244,24 +241,9 @@ export class Overlay extends Layout { | |||
244 | }, | 241 | }, |
245 | })) | 242 | })) |
246 | 243 | ||
247 | // Trivial case: | ||
248 | // This hack make sure utils remains at the same place even when wrapper resized | ||
249 | // Prevent DOMRect changes when user clicking plus/minus button many times | ||
250 | const utils = wrapper.querySelector('.utils') | ||
251 | utils.onmouseover = () => { | ||
252 | const { left, top } = utils.getBoundingClientRect() | ||
253 | utils.style.cssText = `visibility: visible; z-index: 9000; position: fixed; transition: unset; left: ${left}px; top: ${top}px;` | ||
254 | document.body.appendChild(utils) | ||
255 | } | ||
256 | utils.onmouseout = () => { | ||
257 | wrapper.appendChild(utils) | ||
258 | utils.style.cssText = '' | ||
259 | } | ||
260 | |||
261 | // Close button | 244 | // Close button |
262 | wrapper.querySelector('#close').onclick = () => { | 245 | wrapper.querySelector('#close').onclick = () => { |
263 | block.classList.remove('focus') | 246 | block.classList.remove('focus') |
264 | utils.style.cssText = '' | ||
265 | } | 247 | } |
266 | // Plus/Minus font-size of content | 248 | // Plus/Minus font-size of content |
267 | wrapper.querySelector('#plus-font-size').onclick = () => { | 249 | wrapper.querySelector('#plus-font-size').onclick = () => { |