frontend/android: capture textzoom and set custom base font size

Android textZoom only increases font-size without incresing
surrounding elements which can break the layout and cause
overlapping text and elements.

This commit reads the current textzoom, sets a custom CSS base
font size (calculated from textzoom) and resets textzoom to 100%.

The custom CSS is using 'The 62.5% Font Size Trick' with which
1rem equals 10px.

With this it is possible to change elment dimensions from px to
rem. These elements will become responsive and also grow if
Android settings for font size is increased.

To simulate this in webdev and optimize the layout for increased
fontsize a base font size of 125% has to be set.

Author: thisconnect

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

@@ -136,7 +136,6 @@ public void onReceive(Context context, Intent intent) {
         }
     };
 
-
     @Override
     public void onConfigurationChanged(Configuration newConfig) {
         int currentNightMode = newConfig.uiMode & Configuration.UI_MODE_NIGHT_MASK;
@@ -171,6 +170,8 @@ public void setDarkTheme(boolean isDark) {
         }
     }
 
+    private int currentZoom;
+
     @SuppressLint("SetJavaScriptEnabled")
     @Override
     protected void onCreate(Bundle savedInstanceState) {
@@ -226,7 +227,33 @@ protected void onCreate(Bundle savedInstanceState) {
 
         // vw.setWebContentsDebuggingEnabled(true); // enable remote debugging in chrome://inspect/#devices
 
-        vw.setWebViewClient(new BitBoxWebViewClient(BASE_URL, getAssets(), getApplication()));
+        // Retrieve the current text zoom setting to adjust the base font size in the WebView.
+        currentZoom = vw.getSettings().getTextZoom();
+
+        vw.setWebViewClient(new BitBoxWebViewClient(BASE_URL, getAssets(), getApplication()) {
+            @Override
+            public void onPageFinished(WebView view, String url) {
+                super.onPageFinished(view, url);
+
+                // 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 * ((double) 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;
+
+                // 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);
+
+                String cssSetup = "document.documentElement.style.fontSize='" + baseFontSizePercentage + "%';" +
+                                "document.body.style.fontSize='" + defaultFontSizeREM + "rem';";
+
+                // Execute the CSS setup in the WebView.
+                view.evaluateJavascript(cssSetup, null);
+            }
+        });
 
         ActivityResultLauncher<String> fileChooser = registerForActivityResult(new ActivityResultContracts.GetContent(), uri -> webChrome.onFilePickerResult(uri));
         BitBoxWebChromeClient.CameraPermissionDelegate cameraPermissionDelegate = () -> ActivityCompat.requestPermissions(
@@ -321,7 +348,6 @@ public void noAuthConfigured() {
                 getWindow().clearFlags(WindowManager.LayoutParams.FLAG_SECURE);
             }
         }));
-
     }
 
     @Override