Merge pull request #125 from ThisIs-Developer/feature/find-replace-redesign

fix(ui): prepend language text prefixes to mobile selector and fix help/about modal triggers

Author: ThisIs-Developer

desktop-app/resources/index.html

@@ -297,10 +297,10 @@ <h5>Menu</h5>
                                     <i class="bi bi-translate me-2"></i> Language: <span id="mobile-current-lang-label">English</span>
                                 </button>
                                 <ul class="dropdown-menu w-100" aria-labelledby="mobileLanguageDropdown">
-                                    <li><a class="dropdown-item lang-select-item active" href="#" data-lang="en">English</a></li>
-                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="zh">简体中文</a></li>
-                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ja">日本語</a></li>
-                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ko">한국어</a></li>
+                                    <li><a class="dropdown-item lang-select-item active" href="#" data-lang="en">us English</a></li>
+                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="zh">CN 简体中文</a></li>
+                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ja">JP 日本語</a></li>
+                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ko">KR 한국어</a></li>
                                 </ul>
                             </div>
                             <button id="mobile-theme-toggle" class="mobile-menu-item" title="Toggle Dark Mode">

desktop-app/resources/js/script.js

@@ -4482,6 +4482,28 @@ This is a fully client-side application. Your content never leaves your browser
     }
   }
 
+  function openHelpModal() {
+    if (helpModal) {
+      openAppModal(helpModal);
+    }
+  }
+
+  function openAboutModal() {
+    if (aboutModal) {
+      const aboutVersion = document.getElementById("about-version");
+      if (aboutVersion) {
+        aboutVersion.textContent = APP_VERSION;
+      }
+      openAppModal(aboutModal);
+    }
+  }
+
+  function openClearFormattingModal() {
+    if (clearFormattingModal) {
+      openAppModal(clearFormattingModal);
+    }
+  }
+
   function runMarkdownTool(action, button) {
     if (action === 'undo' || action === 'redo') {
       markdownEditor.focus();
@@ -6685,7 +6707,7 @@ This is a fully client-side application. Your content never leaves your browser
     }
     const mobileLabelEl = document.getElementById('mobile-current-lang-label');
     if (mobileLabelEl) {
-      const flags = { en: "English", zh: "简体中文", ja: "日本語", ko: "한국어" };
+      const flags = { en: "us English", zh: "CN 简体中文", ja: "JP 日本語", ko: "KR 한국어" };
       mobileLabelEl.textContent = flags[lang];
     }
 

index.html

@@ -294,10 +294,10 @@ <h5>Menu</h5>
                                     <i class="bi bi-translate me-2"></i> Language: <span id="mobile-current-lang-label">English</span>
                                 </button>
                                 <ul class="dropdown-menu w-100" aria-labelledby="mobileLanguageDropdown">
-                                    <li><a class="dropdown-item lang-select-item active" href="#" data-lang="en">English</a></li>
-                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="zh">简体中文</a></li>
-                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ja">日本語</a></li>
-                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ko">한국어</a></li>
+                                    <li><a class="dropdown-item lang-select-item active" href="#" data-lang="en">us English</a></li>
+                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="zh">CN 简体中文</a></li>
+                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ja">JP 日本語</a></li>
+                                    <li><a class="dropdown-item lang-select-item" href="#" data-lang="ko">KR 한국어</a></li>
                                 </ul>
                             </div>
                             <button id="mobile-theme-toggle" class="mobile-menu-item" title="Toggle Dark Mode">

script.js

@@ -4482,6 +4482,28 @@ This is a fully client-side application. Your content never leaves your browser
     }
   }
 
+  function openHelpModal() {
+    if (helpModal) {
+      openAppModal(helpModal);
+    }
+  }
+
+  function openAboutModal() {
+    if (aboutModal) {
+      const aboutVersion = document.getElementById("about-version");
+      if (aboutVersion) {
+        aboutVersion.textContent = APP_VERSION;
+      }
+      openAppModal(aboutModal);
+    }
+  }
+
+  function openClearFormattingModal() {
+    if (clearFormattingModal) {
+      openAppModal(clearFormattingModal);
+    }
+  }
+
   function runMarkdownTool(action, button) {
     if (action === 'undo' || action === 'redo') {
       markdownEditor.focus();
@@ -6685,7 +6707,7 @@ This is a fully client-side application. Your content never leaves your browser
     }
     const mobileLabelEl = document.getElementById('mobile-current-lang-label');
     if (mobileLabelEl) {
-      const flags = { en: "English", zh: "简体中文", ja: "日本語", ko: "한국어" };
+      const flags = { en: "us English", zh: "CN 简体中文", ja: "JP 日本語", ko: "KR 한국어" };
       mobileLabelEl.textContent = flags[lang];
     }