diff --git a/src/css/epicker-ui.css b/src/css/epicker-ui.css index 1923142b2..7edbfe845 100644 --- a/src/css/epicker-ui.css +++ b/src/css/epicker-ui.css @@ -16,7 +16,7 @@ html#ublock0-epicker, border: 1px solid var(--border-2); box-sizing: border-box; cursor: default; - display: none; + display: flex; flex-direction: column; max-width: min(32rem, 100vw - 4px); min-width: min(24rem, 100vw - 4px); @@ -25,8 +25,18 @@ html#ublock0-epicker, width: min(32rem, 100vw - 4px); z-index: 100; } -#ublock0-epicker:not(.zap) aside { - display: flex; +#ublock0-epicker.zap aside { + min-width: unset !important; + width: unset !important; +} +#ublock0-epicker.zap aside > section, +#ublock0-epicker.zap aside > ul, +#ublock0-epicker.zap aside > #windowbar > div:not(#quit) { + display: none; +} +#ublock0-epicker.zap aside > #windowbar > #quit { + height: 2.5em; + width: 2.5em; } #ublock0-epicker:not(.paused) aside, #ublock0-epicker.minimized aside { diff --git a/src/js/epicker-ui.js b/src/js/epicker-ui.js index d2b14df65..d3235e921 100644 --- a/src/js/epicker-ui.js +++ b/src/js/epicker-ui.js @@ -331,7 +331,7 @@ const onSvgClicked = function(ev) { mx: ev.clientX, my: ev.clientY, options: { - stay: ev.shiftKey || ev.type === 'touch', + stay: true, highlight: ev.target !== svgIslands, }, }); @@ -822,6 +822,8 @@ const startPicker = function() { unpausePicker(); + $id('quit').addEventListener('click', onQuitClicked); + if ( pickerRoot.classList.contains('zap') ) { return; } cmEditor.on('changes', onCandidateChanged); @@ -837,7 +839,6 @@ const startPicker = function() { dom.cl.toggle(pickerRoot, 'minimized'); } }); - $id('quit').addEventListener('click', onQuitClicked); $id('move').addEventListener('mousedown', onStartMoving); $id('move').addEventListener('touchstart', onStartMoving); $id('candidateFilters').addEventListener('click', onCandidateClicked);