From c8408ddf34b44ad10856cba0873168074e0f0e20 Mon Sep 17 00:00:00 2001
From: RossAscends <124905043+RossAscends@users.noreply.github.com>
Date: Tue, 2 May 2023 05:35:30 +0900
Subject: [PATCH] more avatar popup corrections - disabled on mobile normal
 mode - leftside on normal mode PC

---
 public/script.js | 26 ++++++++++++++------------
 public/style.css | 36 ++++++++++++++++++++++++++++++++++--
 2 files changed, 48 insertions(+), 14 deletions(-)

diff --git a/public/script.js b/public/script.js
index 733273068..d3b98da6d 100644
--- a/public/script.js
+++ b/public/script.js
@@ -5385,20 +5385,22 @@ $(document).ready(function () {
 
     $(document).on('click', '.mes .avatar', function () {
 
+        if (window.innerWidth > 1000 || $('body').hasClass('waifuMode')) {
 
-        let thumbURL = $(this).children('img').attr('src');
-        let charsPath = '/characters/'
-        let targetAvatarImg = thumbURL.substring(thumbURL.lastIndexOf("=") + 1);
-        let avatarSrc = charsPath + targetAvatarImg;
+            let thumbURL = $(this).children('img').attr('src');
+            let charsPath = '/characters/'
+            let targetAvatarImg = thumbURL.substring(thumbURL.lastIndexOf("=") + 1);
+            let avatarSrc = charsPath + targetAvatarImg;
+            if ($(this).parent().attr('is_user') == 'true') { //handle user avatars
+                $("#zoomed_avatar").attr('src', thumbURL);
+            } else if ($(this).parent().attr('is_system') == 'true') { //handle system avatars
+                $("#zoomed_avatar").attr('src', thumbURL);
+            } else if ($(this).parent().attr('is_user') == 'false') { //handle char avatars
+                $("#zoomed_avatar").attr('src', avatarSrc);
+            }
+            $('#avatar_zoom_popup').toggle();
 
-        if ($(this).parent().attr('is_user') == 'true') { //handle user avatars
-            $("#zoomed_avatar").attr('src', thumbURL);
-        } else if ($(this).parent().attr('is_system') == 'true') { //handle system avatars
-            $("#zoomed_avatar").attr('src', thumbURL);
-        } else if ($(this).parent().attr('is_user') == 'false') { //handle char avatars
-            $("#zoomed_avatar").attr('src', avatarSrc);
-        }
-        $('#avatar_zoom_popup').toggle();
+        } else { return; }
     });
 
     $(document).on('click', '#OpenAllWIEntries', function () {
diff --git a/public/style.css b/public/style.css
index 6af2066a5..2f10ded4c 100644
--- a/public/style.css
+++ b/public/style.css
@@ -3685,6 +3685,22 @@ body.noShadows * {
 }
 
 #avatar_zoom_popup {
+    min-width: 100px;
+    min-height: 100px;
+    max-height: 90vh;
+    max-width: 90vh;
+    width: calc((100vw - var(--sheldWidth)) /2);
+    position: absolute;
+    padding: 0;
+    filter: drop-shadow(2px 2px 2px #51515199);
+    z-index: 2;
+    overflow: hidden;
+    display: none;
+    bottom: 0;
+    aspect-ratio: 2 / 3;
+}
+
+body.waifuMode #avatar_zoom_popup {
     min-width: 100px;
     min-height: 100px;
     max-height: 90vh;
@@ -3718,7 +3734,24 @@ body.noShadows * {
 
 @media screen and (max-width: 1000px) {
 
-
+    #avatar_zoom_popup {
+        min-width: 100px;
+        min-height: 100px;
+        max-height: 90vh;
+        max-width: 90vh;
+        width: calc((100vw - var(--sheldWidth)) /2);
+        position: absolute;
+        padding: 0;
+        filter: drop-shadow(2px 2px 2px #51515199);
+        z-index: 2;
+        overflow: hidden;
+        display: none;
+        left: 0;
+        right: 0;
+        margin: 0 auto;
+        top: 50px;
+        aspect-ratio: 2 / 3;
+    }
 
     .mes img.img_extra {
         max-width: 100%;
@@ -3887,7 +3920,6 @@ body.noShadows * {
     body.waifuMode #sheld {
         height: 40svh;
         top: 60svh;
-        /* align-items: end; */
         bottom: 0 !important;
     }