diff --git a/src/app/app.config.ts b/src/app/app.config.ts
index 2af3ac9..98f23f7 100644
--- a/src/app/app.config.ts
+++ b/src/app/app.config.ts
@@ -1,17 +1,15 @@
import { APP_INITIALIZER, ApplicationConfig } from "@angular/core";
-import { provideRouter } from "@angular/router";
import { provideHttpClient } from "@angular/common/http";
-import { routes } from "./app.routes";
import { TranslateService } from "./services/translate.service";
export function setupTranslateServiceFactory(service: TranslateService) {
- return () => service.use("en");
+ const lang = localStorage.getItem("lang") ?? "en";
+ return () => service.use(lang);
}
export const appConfig: ApplicationConfig = {
providers: [
- provideRouter(routes),
provideHttpClient(),
TranslateService,
{
diff --git a/src/app/modules/link/link.component.html b/src/app/modules/link/link.component.html
index 580ecaa..282314f 100644
--- a/src/app/modules/link/link.component.html
+++ b/src/app/modules/link/link.component.html
@@ -1,4 +1,4 @@
- ![]()
+ ![]()
{{ text | translate }}
diff --git a/src/app/modules/link/link.component.less b/src/app/modules/link/link.component.less
index 7d53f3f..10c8536 100644
--- a/src/app/modules/link/link.component.less
+++ b/src/app/modules/link/link.component.less
@@ -10,7 +10,7 @@ a {
flex-direction: column;
justify-content: center;
gap: 0;
- transition: 0.3s ease-in-out;
+ transition: 0.5s ease-in-out;
span {
opacity: 0;
visibility: hidden;
@@ -21,7 +21,7 @@ a {
font-size: 0.8rem;
height: 0;
font-weight: 600;
- transition: opacity 0.3s ease-in-out;
+ transition: all 0.6s ease-in-out;
}
&:hover {
transform: translateY(-1rem);
diff --git a/src/app/modules/panel/panel.component.html b/src/app/modules/panel/panel.component.html
index 0350ee5..88baf9e 100644
--- a/src/app/modules/panel/panel.component.html
+++ b/src/app/modules/panel/panel.component.html
@@ -15,8 +15,8 @@
#lang_btn
>{{ getLang() }}
-
-
+
+
diff --git a/src/app/modules/panel/panel.component.less b/src/app/modules/panel/panel.component.less
index 94daf1d..9d20f01 100644
--- a/src/app/modules/panel/panel.component.less
+++ b/src/app/modules/panel/panel.component.less
@@ -57,6 +57,8 @@
align-items: center;
span {
font-weight: 600;
+ user-select: none;
+ -webkit-user-select: none;
}
fa-icon {
font-size: 1.2rem;
diff --git a/src/app/modules/panel/panel.component.ts b/src/app/modules/panel/panel.component.ts
index 09f5f0d..2fb6170 100644
--- a/src/app/modules/panel/panel.component.ts
+++ b/src/app/modules/panel/panel.component.ts
@@ -3,17 +3,20 @@ import { Component, ElementRef, HostListener, ViewChild } from "@angular/core";
import { FontAwesomeModule } from "@fortawesome/angular-fontawesome";
import { faGithub } from "@fortawesome/free-brands-svg-icons";
import { faPowerOff, faVolumeHigh } from "@fortawesome/free-solid-svg-icons";
+import { TranslationPipe } from '../../pipes/translation.pipe';
import { PanelSevice } from "../../services/panel.service";
import { TranslateService } from "../../services/translate.service";
@Component({
standalone: true,
selector: "app-panel",
- imports: [CommonModule, FontAwesomeModule],
+ imports: [CommonModule, FontAwesomeModule, TranslationPipe],
templateUrl: "./panel.component.html",
styleUrls: ["./panel.component.less"],
})
export class PanelComponent {
+ source_code_btn_title = "SOURCE_CODE_TITLE"
+
public time = "";
faGithub = faGithub;
faVolume = faVolumeHigh;
@@ -53,6 +56,18 @@ export class PanelComponent {
this.langModal.nativeElement.style.left = `calc(${x}px - 3.5rem)`;
}
+ @HostListener("window:click", ["$event"])
+ private closeLangModal(event: MouseEvent) {
+ if (
+ this.langModal &&
+ this.langBtn &&
+ !this.langModal.nativeElement.contains(event.target as Node) &&
+ !this.langBtn.nativeElement.contains(event.target as Node)
+ ) {
+ this.langModal.nativeElement.classList.remove("active");
+ }
+ }
+
toggleModal() {
if (this.langModal) {
this.langModal.nativeElement.classList.toggle("active");
@@ -63,6 +78,7 @@ export class PanelComponent {
}
useLang(lang: string) {
+ this.langModal && this.langModal.nativeElement.classList.remove("active");
this.translateService.use(lang);
}
diff --git a/src/app/services/translate.service.ts b/src/app/services/translate.service.ts
index 94c5502..0db4518 100644
--- a/src/app/services/translate.service.ts
+++ b/src/app/services/translate.service.ts
@@ -5,12 +5,13 @@ import { Injectable } from "@angular/core";
export class TranslateService {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
data: Record = {};
- lang = "en";
+ lang: string | null = null;
constructor(private http: HttpClient) {}
use(lang: string): Promise