Fix mobile screen funkiness by smashing it with a big hammer Fixes #2879

2b10954002147fdd684d066a61140781eaa68fa9

Cohee <18619528+Cohee1207@users.noreply.github.com>

public/css/mobile-styles.css+9 -10 Viewed

         touch-action: none;
         overflow: hidden;
         position: fixed;
+-
+    }
     .world_entry_form_control {

     .drawer-content {
         min-width: unset;
         width: 100%100dvw;
         max-height: calc(100vh - 45px);
         max-height: calc(100dvh - 45px);
         position: fixed;

     #sheld,
     #character_popup,
     .drawer-content {
         width: 100%100dvw !important;
         margin: 0 auto;
         max-width: 100%100dvw;
         left: 0 !important;
         resize: none !important;
         top: var(--topBarBlockSize);

         /* 100vh are fallback units for browsers that don't support dvh */
         height: calc(100vh - 45px);
         height: calc(100dvh - 45px);
         min-width: 100%100dvw !important;
         width: 100%100dvw !important;
         max-width: 100%100dvw !important;
         overflow-y: hidden;
         border-left: 1px solid var(--SmartThemeBorderColor);
         border-right: 1px solid var(--SmartThemeBorderColor);

         margin: 0 auto;
         height: calc(100vh - 70px);
         height: calc(100dvh - 70px);
         width: calc(100%100dvw - 5px);
         max-height: calc(100vh - 70px);
         max-height: calc(100dvh - 70px);
         max-width: calc(100%100dvw - 5px);
+    }

     #horde_model {
         height: unset;
+    }
 -}
 \ No newline at end of file
 +}

public/scripts/RossAscends-mods.js+10 -0 Viewed

         RA_autoconnect();
+    }
 +    if (isMobile()) {
 +        const fixFunkyPositioning = () => {
 +            console.debug('[Mobile] Device viewport change detected.');
 +            document.documentElement.style.position = 'fixed';
 +            requestAnimationFrame(() => document.documentElement.style.position = '');
 +        };
 +        window.addEventListener('resize', fixFunkyPositioning);
 +        window.addEventListener('orientationchange', fixFunkyPositioning);
 +    }
++
     $('#main_api').change(function () {
         var PrevAPI = main_api;
         setTimeout(() => RA_autoconnect(PrevAPI), 100);