GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-11-10 14:47:12 -05:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Prevent overflow of sizeDimensions or image handle buttons

Browse source
This commit is contained in:
Henrik Giesel 2021-08-06 04:44:33 +02:00 committed by Damien Elmes
parent cc2641095f
commit 18f63ef17e
2 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
ts/editor/HandleLabel.svelte
View file

@ -10,14 +10,20 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
let dimensions: HTMLDivElement;
let overflowFix = 0;
afterUpdate(() => {
function updateOverflow(dimensions: HTMLDivElement) {
const boundingClientRect = dimensions.getBoundingClientRect();
const overflow = isRtl
? window.innerWidth - boundingClientRect.x - boundingClientRect.width
: boundingClientRect.x;
overflowFix = Math.min(0, overflowFix + overflow, overflow);
});
}
function updateOverflowAsync(dimensions: HTMLDivElement) {
setTimeout(() => updateOverflow(dimensions));
}
afterUpdate(() => updateOverflow(dimensions));
const dispatch = createEventDispatcher();
@ -29,6 +35,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
class="image-handle-dimensions"
class:is-rtl={isRtl}
style="--overflow-fix: {overflowFix}px"
use:updateOverflowAsync
>
<slot />
</div>

1
ts/editor/fields.scss
View file

@ -10,6 +10,7 @@
#fields {
display: flex;
overflow-x: hidden;
flex-direction: column;
margin: 5px;
}