UX: disable the image preview controls while invisible (#25990)

This commit is contained in:
Kris 2024-03-01 15:06:43 -05:00 committed by GitHub
parent 0f32e496bc
commit 84882ad25f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 4 additions and 2 deletions

View File

@ -178,6 +178,7 @@
&:hover {
.button-wrapper {
pointer-events: auto;
opacity: 1;
}
}
@ -185,12 +186,10 @@
.button-wrapper {
min-width: 10em;
width: 100%;
display: flex;
flex-wrap: nowrap;
align-items: center;
gap: 0 0.5em;
position: absolute;
height: calc(var(--resizer-height) + 0.5em);
bottom: 0;
@ -199,9 +198,11 @@
transition: all 0.25s;
z-index: 1; // needs to be higher than image
background: var(--secondary); // for when images are wider than controls
pointer-events: none; // the controls shouldn't be usable while invisible
&[editing] {
opacity: 1;
pointer-events: auto;
}
.scale-btn-container,
@ -314,6 +315,7 @@
.mobile-view .d-editor-preview .image-wrapper .button-wrapper {
opacity: 1;
pointer-events: auto;
}
// d-editor bar button sizing