Fix the rest of mobile cases

This commit is contained in:
Cohee 2024-04-14 21:17:18 +03:00
parent e3f24ac3a0
commit 23ac23010d
4 changed files with 22 additions and 8 deletions

View File

@ -42,6 +42,10 @@
width: 100%; width: 100%;
} }
.zoomed_avatar .dragClose {
display: unset;
}
/* .world_entry_thin_controls, */ /* .world_entry_thin_controls, */
#persona-management-block, #persona-management-block,
#character_popup .flex-container { #character_popup .flex-container {
@ -362,8 +366,6 @@
height: fit-content; height: fit-content;
width: 100%; width: 100%;
} }
} }
/*portrait mode phones*/ /*portrait mode phones*/

View File

@ -5948,7 +5948,10 @@
<div id="zoomed_avatar_template" class="template_element"> <div id="zoomed_avatar_template" class="template_element">
<div class="zoomed_avatar"> <div class="zoomed_avatar">
<div class="zoomed_avatar_container"> <div class="zoomed_avatar_container">
<div class="fa-solid fa-grip drag-grabber"></div> <div class="panelControlBar flex-container">
<div class="fa-fw fa-solid fa-grip drag-grabber"></div>
<div class="fa-fw fa-solid fa-circle-xmark dragClose"></div>
</div>
<img class="zoomed_avatar_img" src="" <img class="zoomed_avatar_img" src=""
data-izoomify-url="" data-izoomify-url=""
data-izoomify-magnify="1.8" data-izoomify-magnify="1.8"

View File

@ -10239,10 +10239,13 @@ jQuery(async function () {
$(`.zoomed_avatar[forChar="${charname}"]`).css('display', 'flex'); $(`.zoomed_avatar[forChar="${charname}"]`).css('display', 'flex');
dragElement(newElement); dragElement(newElement);
if (power_user.zoomed_avatar_magnification) if (power_user.zoomed_avatar_magnification) {
$('.zoomed_avatar_container').izoomify(); $('.zoomed_avatar_container').izoomify();
} else {
$(`.zoomed_avatar[forChar="${charname}"] .dragClose`).hide();
}
$('.zoomed_avatar').on('click', (e) => { $('.zoomed_avatar, .zoomed_avatar .dragClose').on('click touchend', (e) => {
if (e.target.closest('.drag-grabber')) { if (e.target.closest('.drag-grabber')) {
return; return;
} }

View File

@ -532,14 +532,14 @@ body.reduced-motion #bg_custom {
opacity: 1; opacity: 1;
} }
.panelControlBar { body .panelControlBar {
position: absolute; position: absolute;
right: 5px; right: 5px;
top: 5px; top: 5px;
margin-right: 5px;
z-index: 2000; z-index: 2000;
min-width: 55px; min-width: 55px;
justify-content: flex-end; justify-content: flex-end;
gap: 0px;
} }
.panelControlBar .drag-grabber { .panelControlBar .drag-grabber {
@ -3812,13 +3812,19 @@ body:not(.movingUI) .drawer-content.maximized {
left: var(--leftPosition); left: var(--leftPosition);
position: absolute; position: absolute;
height: auto; height: auto;
max-height: 100vh !important; max-height: 90vh !important;
align-items: end; align-items: end;
} }
.zoomed_avatar .dragClose {
display: none;
}
.zoomed_avatar_container { .zoomed_avatar_container {
width: 100%; width: 100%;
margin-inline: 10px; margin-inline: 10px;
max-height: 90vh;
max-width: 90svh;
} }
.zoomed_avatar img { .zoomed_avatar img {