fix(ui): stop old translations and page shrink on Android

The translation files get a content version in their URL, so a
browser that cached an old file loads the new one. On touch
screens the scroll lock of menus and selects no longer adds a
right margin: Android Chrome reported one and the whole page
became narrower.

vite.config.js

@@ -1,13 +1,29 @@
+import {createHash} from 'node:crypto';
+import {readdirSync, readFileSync} from 'node:fs';
 import path from 'node:path';
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 import tailwindcss from '@tailwindcss/vite';
 
+const translationsDir = path.resolve(import.meta.dirname, 'public/i18n');
+
+// Changes whenever a translation changes, so the browser loads the new file under a new URL.
+const translationsVersion = () => {
+    const hash = createHash('sha256');
+    for (const file of readdirSync(translationsDir).filter((name) => name.endsWith('.json')).sort()) {
+        hash.update(readFileSync(path.join(translationsDir, file)));
+    }
+    return hash.digest('hex').slice(0, 12);
+};
+
 export default defineConfig({
     plugins: [
         react(),
         tailwindcss(),
     ],
+    define: {
+        __TRANSLATIONS_VERSION__: JSON.stringify(translationsVersion()),
+    },
     resolve: {
         alias: {
             '@': path.resolve(import.meta.dirname, './src'),