add checkmark to selected language in the settings window

This commit is contained in:
Nariman Jelveh 2024-08-02 14:00:44 -07:00
parent 5db00abeaf
commit 475eb13fb3
3 changed files with 18 additions and 1 deletions

View File

@ -36,7 +36,7 @@ export default {
const available_languages = window.listSupportedLanguages(); const available_languages = window.listSupportedLanguages();
h += `<div class="language-list">`; h += `<div class="language-list">`;
for (let lang of available_languages) { 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>`; h += `</div>`;
return h; return h;

View File

@ -3865,15 +3865,29 @@ fieldset[name=number-code] {
border-radius: 4px; border-radius: 4px;
margin-bottom: 10px; margin-bottom: 10px;
margin-right: 10px; margin-right: 10px;
font-size: 13px;
position: relative;
} }
.language-item:hover { .language-item:hover {
background-color: #f6f6f6; 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 { .language-item.active {
background-color: #e0e0e0; background-color: #e0e0e0;
} }
.language-item.active .checkmark {
display: inline-block;
}
.settings-card { .settings-card {
overflow: hidden; overflow: hidden;

View File

@ -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>

After

Width:  |  Height:  |  Size: 271 B