Browse Source

add checkmark to selected language in the settings window

Nariman Jelveh 10 tháng trước cách đây
mục cha
commit
475eb13fb3

+ 1 - 1
src/gui/src/UI/Settings/UITabLanguage.js

@@ -36,7 +36,7 @@ export default {
         const available_languages = window.listSupportedLanguages();
         h += `<div class="language-list">`;
             for (let lang of available_languages) {
-                h += `<div class="language-item ${window.locale === lang.code ? 'active': ''}" data-lang="${lang.code}" data-english-name="${html_encode(lang.english_name)}">${html_encode(lang.name)}</div>`;
+                h += `<div class="language-item ${window.locale === lang.code ? 'active': ''}" data-lang="${lang.code}" data-english-name="${html_encode(lang.english_name)}">${html_encode(lang.name)}<img class="checkmark" src="${window.icons['checkmark.svg']}"></div>`;
             }
         h += `</div>`;
         return h;

+ 14 - 0
src/gui/src/css/style.css

@@ -3865,15 +3865,29 @@ fieldset[name=number-code] {
     border-radius: 4px;
     margin-bottom: 10px;
     margin-right: 10px;
+    font-size: 13px;
+    position: relative;
 }
 
 .language-item:hover {
     background-color: #f6f6f6;
 }
 
+.language-item .checkmark{
+    width: 15px;
+    height: 15px;
+    border-radius: 50%;
+    margin-left: 10px;
+    display: none;
+    position: absolute;
+    right: 10px;
+}
 .language-item.active {
     background-color: #e0e0e0;
 }
+.language-item.active .checkmark {
+    display: inline-block;
+}
 
 .settings-card {
     overflow: hidden;

+ 3 - 0
src/gui/src/icons/checkmark.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check2" viewBox="0 0 16 16">
+  <path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0"/>
+</svg>