test

Author: thisconnect

frontends/android/BitBoxApp/app/src/main/java/ch/shiftcrypto/bitboxapp/MainActivity.java

@@ -77,6 +77,8 @@ public class MainActivity extends AppCompatActivity {
 
     private String location = "";
 
+    private int currentZoom;
+
     // This is for the file picker dialog invoked by file upload forms in the WebView.
     // Used by e.g. MoonPay's KYC forms.
     private ValueCallback<Uri[]> filePathCallback;
@@ -221,12 +223,37 @@ public void run() {
         // For MoonPay WebRTC camera access.
         vw.getSettings().setMediaPlaybackRequiresUserGesture(false);
 
+        // Retrieve the current text zoom setting to adjust the base font size in the WebView.
+        currentZoom = vw.getSettings().getTextZoom();
+
         vw.setWebViewClient(new WebViewClient() {
             @Override
             public void onPageFinished(WebView view, String url) {
                 // The url is not correctly updated when navigating to a new page. This allows to
                 // know the current location and to block external requests on that base.
                 view.evaluateJavascript("window.location.pathname", path -> location = path);
+
+                // Calculate the base font size for html as a percentage.
+                // This percentage dynamically adjusts to ensure 1rem = 10px, scaled according to the current zoom level.
+                double baseFontSizePercentage = 62.5 * (currentZoom / 100.0);
+
+                // The default body font size in rem, which is independent of the zoom level.
+                // This size does not scale dynamically with zoom adjustments and is fixed at 1.6rem.
+                double defaultFontSizeREM = 1.6;
+
+                // Set the base font-size on the html element dynamically and apply a fixed font size to the body.
+                // Also, set a custom data attribute 'data-test' to the calculated base font size percentage for potential debugging.
+                String cssSetup = "document.documentElement.style.fontSize = '" + baseFontSizePercentage + "%';" +
+                                    "document.body.style.fontSize = '" + defaultFontSizeREM + "rem';" +
+                                    "document.body.setAttribute('data-test', '" + baseFontSizePercentage + "%');";
+
+                // Reset the WebView's text zoom to 100% to ensure that the scaling is controlled via CSS
+                // and not by the WebView's default scaling behavior.
+                view.getSettings().setTextZoom(100);
+
+                // Execute the CSS setup in the WebView.
+                view.evaluateJavascript(cssSetup, null);
+
             }
             @Override
             public WebResourceResponse shouldInterceptRequest(final WebView view, WebResourceRequest request) {

frontends/web/src/components/layout/header.tsx

@@ -45,6 +45,8 @@ const Header = ({
     }
     return false;
   };
+  const test = document.body.getAttribute('data-test');
+  const width = window.screen.width;
 
   return (
     <div className={[style.container, sidebarStatus ? style[sidebarStatus] : ''].join(' ')}>
@@ -62,6 +64,9 @@ const Header = ({
                 <a href="#" onClick={toggle} className={[style.guideIcon, guideShown ? style.disabled : ''].join(' ')}>
                   <GuideActive />
                   {t('guide.toggle.open')}
+                  <sup>
+                    ({test} {width}px)
+                  </sup>
                 </a>
               </span>
             )