Mirrors/wg-portal
1
0
Fork 0
mirror of https://github.com/h44z/wg-portal.git synced 2025-10-07 08:56:18 +00:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

QoL frontend improvements (#267)

Browse Source 
* refactor: add space for language title

* feat: add overflow-break to text-wrap class

* feat: add public key text wrapping for interfaces

* refactor: get rid of getlang function and set locale during initialization

fix: show english flag when locale does not match

* refactor: bind header logo alt attribute to companyName

* refactor: add language name to german

* refactor: add language name to russian

* refactor: add language name to english
This commit is contained in:
Ryazanov Alexander Mihailovich
2024-07-04 23:40:16 +03:00
committed by GitHub
parent 6f52cb2ada
commit 58294a3c2a
7 changed files with 30 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/App.vue
View File

@@ -42,6 +42,9 @@ const switchLanguage = function (lang) {
const languageFlag = computed(() => {
// `this` points to the component instance
let lang = appGlobal.$i18n.locale.toLowerCase();
if (!appGlobal.$i18n.availableLocales.includes(lang)) {
lang = appGlobal.$i18n.fallbackLocale;
}
if (lang === "en") {
lang = "us";
}
@@ -59,7 +62,7 @@ const currentYear = ref(new Date().getFullYear())
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<div class="container-fluid">
<a class="navbar-brand" href="/"><img alt="WireGuard Portal" src="/img/header-logo.png" /></a>
<a class="navbar-brand" href="/"><img :alt="companyName" src="/img/header-logo.png" /></a>
<button aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation" class="navbar-toggler"
data-bs-target="#navbarTop" data-bs-toggle="collapse" type="button">
<span class="navbar-toggler-icon"></span>
@@ -110,9 +113,9 @@ const currentYear = ref(new Date().getFullYear())
<button aria-expanded="false" aria-haspopup="true" class="btn btn btn-secondary pe-0"
data-bs-toggle="dropdown" type="button"><span :class="languageFlag" class="fi"></span></button>
<div aria-labelledby="btnGroupDrop3" class="dropdown-menu" style="">
<a class="dropdown-item" href="#" @click.prevent="switchLanguage('en')"><span class="fi fi-us"></span>English</a>
<a class="dropdown-item" href="#" @click.prevent="switchLanguage('de')"><span class="fi fi-de"></span>Deutsch</a>
<a class="dropdown-item" href="#" @click.prevent="switchLanguage('ru')"><span class="fi fi-ru"></span>Русский</a>
<a class="dropdown-item" href="#" @click.prevent="switchLanguage('en')"><span class="fi fi-us"></span> English</a>
<a class="dropdown-item" href="#" @click.prevent="switchLanguage('de')"><span class="fi fi-de"></span> Deutsch</a>
<a class="dropdown-item" href="#" @click.prevent="switchLanguage('ru')"><span class="fi fi-ru"></span> Русский</a>
</div>
</div>
</div>