From d8d09d7bac31fe1c7456ed481b37e004f9f7c28d Mon Sep 17 00:00:00 2001 From: Flo Date: Sat, 31 Aug 2024 22:18:08 +0000 Subject: [PATCH] internationalization --- angular.json | 6 +- package.json | 29 +-- src/app/app.component.html | 3 +- src/app/app.component.ts | 10 +- src/app/app.module.ts | 25 +- src/app/core/auth/auth.module.ts | 8 +- .../confirm-registration.component.html | 10 +- .../forgot-password.component.html | 9 +- .../components/login/login.component.html | 18 +- .../registration/registration.component.html | 18 +- .../reset-password.component.html | 10 +- .../core/components/home/home.component.html | 11 +- .../core/components/home/home.component.ts | 12 +- .../navigation/navigation.component.html | 214 +++++++----------- .../navigation/navigation.component.ts | 71 +++++- .../notification-bar.component.html | 8 +- .../notification-bar.component.ts | 52 ++++- .../settings/settings.component.html | 4 +- .../tabs/tab-profile/tab-profile.component.ts | 18 +- .../tab-security/tab-security.component.html | 18 +- src/app/core/core.module.ts | 9 +- src/app/core/guards/auth.guard.ts | 10 +- src/app/core/services/auth.service.ts | 1 - src/app/core/services/notification.service.ts | 27 ++- src/app/core/services/request.service.ts | 16 +- .../components/table/table.component.ts | 1 - src/assets/i18n/de.json | 54 +++++ src/assets/i18n/en.json | 54 +++++ src/assets/icon.svg | 1 + tailwind.config.js | 15 ++ 30 files changed, 488 insertions(+), 254 deletions(-) create mode 100644 src/assets/i18n/de.json create mode 100644 src/assets/i18n/en.json create mode 100644 src/assets/icon.svg diff --git a/angular.json b/angular.json index 50745c6..51eb802 100644 --- a/angular.json +++ b/angular.json @@ -84,10 +84,10 @@ "builder": "@angular-devkit/build-angular:dev-server", "configurations": { "production": { - "browserTarget": "bee:build:production" + "buildTarget": "bee:build:production" }, "development": { - "browserTarget": "bee:build:development" + "buildTarget": "bee:build:development" } }, "defaultConfiguration": "development" @@ -95,7 +95,7 @@ "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { - "browserTarget": "bee:build" + "buildTarget": "bee:build" } }, "test": { diff --git a/package.json b/package.json index 98dc225..26b5e2f 100644 --- a/package.json +++ b/package.json @@ -9,24 +9,25 @@ }, "private": true, "dependencies": { - "@angular/animations": "^15.2.10", - "@angular/cdk": "^15.2.9", - "@angular/common": "^15.2.0", - "@angular/compiler": "^15.2.0", - "@angular/core": "^15.2.0", - "@angular/forms": "^15.2.0", - "@angular/platform-browser": "^15.2.0", - "@angular/platform-browser-dynamic": "^15.2.0", - "@angular/router": "^15.2.0", + "@angular/animations": "^18.2.2", + "@angular/common": "^18.2.2", + "@angular/compiler": "^18.2.2", + "@angular/core": "^18.2.2", + "@angular/forms": "^18.2.2", + "@angular/platform-browser": "^18.2.2", + "@angular/platform-browser-dynamic": "^18.2.2", + "@angular/router": "^18.2.2", + "@ngx-translate/core": "^15.0.0", + "@ngx-translate/http-loader": "^8.0.0", "flowbite": "^2.5.1", "rxjs": "~7.8.0", "tslib": "^2.3.0", - "zone.js": "~0.12.0" + "zone.js": "~0.14.10" }, "devDependencies": { - "@angular-devkit/build-angular": "^15.2.6", - "@angular/cli": "~15.2.6", - "@angular/compiler-cli": "^15.2.0", + "@angular-devkit/build-angular": "^18.2.2", + "@angular/cli": "~18.2.2", + "@angular/compiler-cli": "^18.2.2", "@types/jasmine": "~4.3.0", "jasmine-core": "~4.5.0", "karma": "~6.4.0", @@ -35,6 +36,6 @@ "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.0.0", "tailwindcss": "^3.4.10", - "typescript": "~4.9.4" + "typescript": "~5.4.5" } } diff --git a/src/app/app.component.html b/src/app/app.component.html index 5051e59..0b411f2 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,4 +1,5 @@ -
+ +
diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 58970ff..fbd6b2a 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from "@angular/core"; import { AuthService } from "./core/services/auth.service"; import { AppService } from "./core/services/app.service"; +import { TranslateService } from "@ngx-translate/core"; @Component({ selector: "app-root", @@ -10,8 +11,13 @@ import { AppService } from "./core/services/app.service"; export class AppComponent implements OnInit { constructor( private authService: AuthService, - private appService: AppService - ) {} + private translate: TranslateService + ) { + var language = navigator.language; + + translate.setDefaultLang(language); + translate.use(language); + } ngOnInit(): void { this.authService.readUserState(); diff --git a/src/app/app.module.ts b/src/app/app.module.ts index efcb67e..c24d4f8 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,8 +1,13 @@ import { NgModule } from "@angular/core"; import { BrowserModule } from "@angular/platform-browser"; -import { HttpClientModule } from "@angular/common/http"; +import { + HttpClient, + provideHttpClient, + withInterceptorsFromDi, +} from "@angular/common/http"; import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; - +import { TranslateModule, TranslateLoader } from "@ngx-translate/core"; +import { TranslateHttpLoader } from "@ngx-translate/http-loader"; import { AppComponent } from "./app.component"; import { RouterModule, Routes } from "@angular/router"; import { SharedModule } from "./shared/shared.module"; @@ -25,18 +30,28 @@ const routes: Routes = [ }, ]; +export function createTranslateLoader(http: HttpClient) { + return new TranslateHttpLoader(http, "./assets/i18n/", ".json"); +} + @NgModule({ declarations: [AppComponent, HomeComponent], + bootstrap: [AppComponent], imports: [ BrowserModule, BrowserAnimationsModule, - HttpClientModule, RouterModule, RouterModule.forRoot(routes), SharedModule, CoreModule, + TranslateModule.forRoot({ + loader: { + provide: TranslateLoader, + useFactory: createTranslateLoader, + deps: [HttpClient], + }, + }), ], - providers: [], - bootstrap: [AppComponent], + providers: [provideHttpClient(withInterceptorsFromDi())], }) export class AppModule {} diff --git a/src/app/core/auth/auth.module.ts b/src/app/core/auth/auth.module.ts index 7626877..507dce8 100644 --- a/src/app/core/auth/auth.module.ts +++ b/src/app/core/auth/auth.module.ts @@ -7,6 +7,7 @@ import { RouterModule, Routes } from "@angular/router"; import { ReactiveFormsModule } from "@angular/forms"; import { ForgotPasswordComponent } from "./components/forgot-password/forgot-password.component"; import { ResetPasswordComponent } from "./components/reset-password/reset-password.component"; +import { TranslateModule } from "@ngx-translate/core"; const routes: Routes = [ { path: "login", component: LoginComponent }, @@ -38,6 +39,11 @@ const routes: Routes = [ ForgotPasswordComponent, ResetPasswordComponent, ], - imports: [RouterModule.forChild(routes), CommonModule, ReactiveFormsModule], + imports: [ + RouterModule.forChild(routes), + CommonModule, + ReactiveFormsModule, + TranslateModule, + ], }) export class AuthModule {} diff --git a/src/app/core/auth/components/confirm-registration/confirm-registration.component.html b/src/app/core/auth/components/confirm-registration/confirm-registration.component.html index 1b46718..72da839 100644 --- a/src/app/core/auth/components/confirm-registration/confirm-registration.component.html +++ b/src/app/core/auth/components/confirm-registration/confirm-registration.component.html @@ -2,10 +2,10 @@

- Beekeeper + {{ "title" | translate }}

- Registrierung Abschließen + {{ "auth.confirm-registration" | translate }}

@@ -14,7 +14,7 @@ {{ "auth.password" | translate }} Passwort wiederholen{{ "auth.password-confirmation" | translate }} - Registrieren + {{ "auth.confirm-registration" | translate }} diff --git a/src/app/core/auth/components/forgot-password/forgot-password.component.html b/src/app/core/auth/components/forgot-password/forgot-password.component.html index 682b804..f188e68 100644 --- a/src/app/core/auth/components/forgot-password/forgot-password.component.html +++ b/src/app/core/auth/components/forgot-password/forgot-password.component.html @@ -2,10 +2,10 @@

- Beekeeper + {{ "title" | translate }}

- Passwort vergessen? + {{ "auth.forgot-password" | translate }}

@@ -14,7 +14,8 @@ + {{ "auth.email" | translate }} - Passwort zurücksetzen + {{ "auth.reset-password" | translate }} diff --git a/src/app/core/auth/components/login/login.component.html b/src/app/core/auth/components/login/login.component.html index af33de2..e8d37b0 100644 --- a/src/app/core/auth/components/login/login.component.html +++ b/src/app/core/auth/components/login/login.component.html @@ -2,9 +2,11 @@

- Beekeeper + {{ "title" | translate }} +

+

+ {{ "auth.login" | translate }}

-

Anmeldung

@@ -12,7 +14,7 @@ {{ "auth.username-or-email" | translate }} - Neu hier? + {{ "auth.not-yet-registered" | translate }} Jetzt registrieren!{{ "auth.register-now" | translate }}

@@ -38,7 +40,7 @@ {{ "auth.password" | translate }} Passwort vergessen?{{ "auth.forgot-password" | translate }}?

@@ -64,6 +66,6 @@ type="submit" class="w-full 9xl:w-auto font-bold text-skin-secondary bg-skin-accent hover:text-skin-primary rounded-lg text-sm px-5 py-2.5 text-center" > - Anmelden + {{ "auth.login" | translate }} diff --git a/src/app/core/auth/components/registration/registration.component.html b/src/app/core/auth/components/registration/registration.component.html index 4a3e88b..15fa994 100644 --- a/src/app/core/auth/components/registration/registration.component.html +++ b/src/app/core/auth/components/registration/registration.component.html @@ -2,9 +2,11 @@

- Beekeeper + {{ "title" | translate }} +

+

+ {{ "auth.registration" | translate }}

-

Registrierung

@@ -12,7 +14,8 @@ + {{ "auth.email" | translate }} Benutzername + {{ "auth.reset-password" | translate }} - Bereits registiert? + {{ "auth.already-registered" | translate }} Jetzt anmelden!{{ "auth.login-now" | translate }}

@@ -54,6 +58,6 @@ type="submit" class="w-full 9xl:w-auto font-bold text-skin-secondary bg-skin-accent hover:text-skin-primary rounded-lg text-sm px-5 py-2.5 text-center" > - Registrieren + {{ "auth.register" | translate }}
diff --git a/src/app/core/auth/components/reset-password/reset-password.component.html b/src/app/core/auth/components/reset-password/reset-password.component.html index 7c1cd4e..ec0160b 100644 --- a/src/app/core/auth/components/reset-password/reset-password.component.html +++ b/src/app/core/auth/components/reset-password/reset-password.component.html @@ -2,10 +2,10 @@

- Beekeeper + {{ "title" | translate }}

- Passwort zurücksetzen + {{ "auth.reset-password" | translate }}

@@ -14,7 +14,7 @@ {{ "auth.new-password" | translate }} Passwort wiederholen{{ "auth.password-confirmation" | translate }} - Neues Passwort bestätigen + {{ "auth.new-password" | translate }} diff --git a/src/app/core/components/home/home.component.html b/src/app/core/components/home/home.component.html index 35be8d2..b02bbdf 100644 --- a/src/app/core/components/home/home.component.html +++ b/src/app/core/components/home/home.component.html @@ -1,7 +1,10 @@ - - -
- +
+ +
+ +
diff --git a/src/app/core/components/home/home.component.ts b/src/app/core/components/home/home.component.ts index 7c8406c..be17790 100644 --- a/src/app/core/components/home/home.component.ts +++ b/src/app/core/components/home/home.component.ts @@ -1,18 +1,8 @@ import { Component } from "@angular/core"; -import { NotificationService } from "../../services/notification.service"; @Component({ selector: "app-home", templateUrl: "./home.component.html", styleUrls: ["./home.component.scss"], }) -export class HomeComponent { - constructor(private notificationService: NotificationService) {} - - fehler() { - this.notificationService.push({ - message: "Ein Fehler ist aufgetreten :(", - type: "danger", - }); - } -} +export class HomeComponent {} diff --git a/src/app/core/components/navigation/navigation.component.html b/src/app/core/components/navigation/navigation.component.html index f4bd01e..7296a90 100644 --- a/src/app/core/components/navigation/navigation.component.html +++ b/src/app/core/components/navigation/navigation.component.html @@ -1,139 +1,97 @@ + + + + + + diff --git a/src/app/core/components/navigation/navigation.component.ts b/src/app/core/components/navigation/navigation.component.ts index dff0350..53dc791 100644 --- a/src/app/core/components/navigation/navigation.component.ts +++ b/src/app/core/components/navigation/navigation.component.ts @@ -3,11 +3,13 @@ import { initFlowbite } from "flowbite"; import { AuthService } from "../../services/auth.service"; import { UserStateResponse } from "../../models/user-state-request.model"; import { Router } from "@angular/router"; -import { filter, map } from "rxjs"; +import { filter } from "rxjs"; import { AppService } from "../../services/app.service"; +import { NotificationService } from "../../services/notification.service"; +import { TranslateService } from "@ngx-translate/core"; interface NavigationLink { - label: string; + label: Function | string; routerLink: string; } @@ -24,25 +26,45 @@ interface UserMenuButton { }) export class NavigationComponent implements OnInit { navigationLinks: NavigationLink[] = [ - { routerLink: "/", label: "Startseite" }, - { routerLink: "/settings", label: "Völker" }, + { routerLink: "/", label: () => "navigation.home" }, + { + routerLink: "/colonies", + label: () => "navigation.colonies", + }, ]; usermenuButtons: UserMenuButton[] = [ { - label: "Einstellungen", + label: () => "menu.settings", routerLink: "/settings", clickCallback: undefined, }, { - label: () => (this.darkMode ? "Hell" : "Dunkel"), + label: () => (this.darkMode ? "menu.theme.light" : "menu.theme.dark"), routerLink: undefined, clickCallback: () => { this.toggleDarkmode(); }, }, { - label: "Ausloggen", + label: () => (this.language === "de" ? "languages.en" : "languages.de"), + routerLink: undefined, + clickCallback: () => { + this.toggleLanguage(); + }, + }, + { + label: "Test", + routerLink: undefined, + clickCallback: () => { + this.notificationService.push( + this.translate.instant("error.Generic.SomethingWentWrong"), + "danger" + ); + }, + }, + { + label: () => "menu.logout", routerLink: undefined, clickCallback: () => { this.logout(); @@ -52,13 +74,28 @@ export class NavigationComponent implements OnInit { state: UserStateResponse | undefined | null; darkMode: boolean; + language: "de" | "en"; constructor( private authService: AuthService, private appService: AppService, + private notificationService: NotificationService, + private translate: TranslateService, private router: Router ) { this.darkMode = this.appService.darkMode; + + switch (translate.currentLang) { + case "en": + this.language = "en"; + break; + case "de": + this.language = "de"; + break; + default: + this.language = "de"; + } + this.state = this.authService.currentState$.value; this.authService.currentState$ .pipe(filter((state) => state === undefined)) @@ -80,6 +117,19 @@ export class NavigationComponent implements OnInit { this.darkMode = this.appService.darkMode; } + toggleLanguage() { + switch (this.language) { + case "en": + this.language = "de"; + break; + case "de": + this.language = "en"; + break; + } + + this.translate.use(this.language); + } + clickUserMenuButtonLabel(button: UserMenuButton) { if (button.clickCallback !== undefined) { button.clickCallback(); @@ -93,4 +143,11 @@ export class NavigationComponent implements OnInit { return button.label; } } + getNavigationLinkLabel(link: NavigationLink) { + if (typeof link.label === "function") { + return link.label(); + } else { + return link.label; + } + } } diff --git a/src/app/core/components/notification-bar/notification-bar.component.html b/src/app/core/components/notification-bar/notification-bar.component.html index 91f65d7..bf6c156 100644 --- a/src/app/core/components/notification-bar/notification-bar.component.html +++ b/src/app/core/components/notification-bar/notification-bar.component.html @@ -1,5 +1,5 @@
- {{ element.type }} + {{ item.element.type }}
- {{ element.message }} + {{ item.element.message }}
diff --git a/src/app/core/components/settings/tabs/tab-profile/tab-profile.component.ts b/src/app/core/components/settings/tabs/tab-profile/tab-profile.component.ts index 5e2a028..1664b8d 100644 --- a/src/app/core/components/settings/tabs/tab-profile/tab-profile.component.ts +++ b/src/app/core/components/settings/tabs/tab-profile/tab-profile.component.ts @@ -1,10 +1,14 @@ -import { Component } from '@angular/core'; +import { Component } from "@angular/core"; + +interface User { + username: string; + mail: string; + age: number; +} @Component({ - selector: 'app-tab-profile', - templateUrl: './tab-profile.component.html', - styleUrls: ['./tab-profile.component.scss'] + selector: "app-tab-profile", + templateUrl: "./tab-profile.component.html", + styleUrls: ["./tab-profile.component.scss"], }) -export class TabProfileComponent { - -} +export class TabProfileComponent {} diff --git a/src/app/core/components/settings/tabs/tab-security/tab-security.component.html b/src/app/core/components/settings/tabs/tab-security/tab-security.component.html index 88114d5..ec725a8 100644 --- a/src/app/core/components/settings/tabs/tab-security/tab-security.component.html +++ b/src/app/core/components/settings/tabs/tab-security/tab-security.component.html @@ -1,12 +1,12 @@
-

Passwort ändern

+

{{ "settings.security.change-password" | translate }}

{{ "settings.security.current-password" | translate }} Neues Passwort{{ "settings.security.new-password" | translate }} Neues Passwort bestätigen{{ "settings.security.password-confirmation" | translate }} - Passwort ändern + {{ "settings.security.change-password" | translate }}
-

Benutername ändern

+

{{ "settings.security.change-username" | translate }}

{{ "settings.security.current-password" | translate }} Neuer Benutzername{{ "settings.security.new-username" | translate }} - Benutzername ändern + {{ "settings.security.change-username" | translate }}
diff --git a/src/app/core/core.module.ts b/src/app/core/core.module.ts index 2bae07d..5a031f9 100644 --- a/src/app/core/core.module.ts +++ b/src/app/core/core.module.ts @@ -13,6 +13,7 @@ import { RouterModule } from "@angular/router"; import { ReactiveFormsModule } from "@angular/forms"; import { NotificationBarComponent } from "./components/notification-bar/notification-bar.component"; import { NotificationService } from "./services/notification.service"; +import { TranslateModule } from "@ngx-translate/core"; @NgModule({ declarations: [ @@ -29,7 +30,13 @@ import { NotificationService } from "./services/notification.service"; TabSecurityComponent, NotificationBarComponent, ], - imports: [CommonModule, SharedModule, RouterModule, ReactiveFormsModule], + imports: [ + CommonModule, + SharedModule, + RouterModule, + ReactiveFormsModule, + TranslateModule, + ], providers: [ AuthGuard, AuthService, diff --git a/src/app/core/guards/auth.guard.ts b/src/app/core/guards/auth.guard.ts index 63f8f16..ee5e370 100644 --- a/src/app/core/guards/auth.guard.ts +++ b/src/app/core/guards/auth.guard.ts @@ -1,16 +1,10 @@ import { Injectable } from "@angular/core"; -import { - ActivatedRouteSnapshot, - CanActivate, - Router, - RouterStateSnapshot, - UrlTree, -} from "@angular/router"; +import { ActivatedRouteSnapshot, Router, RouterStateSnapshot, UrlTree } from "@angular/router"; import { filter, map, Observable } from "rxjs"; import { AuthService } from "../services/auth.service"; @Injectable() -export class AuthGuard implements CanActivate { +export class AuthGuard { constructor(private authService: AuthService, private router: Router) {} canActivate(): Observable | boolean { diff --git a/src/app/core/services/auth.service.ts b/src/app/core/services/auth.service.ts index ffb2373..e1ca77c 100644 --- a/src/app/core/services/auth.service.ts +++ b/src/app/core/services/auth.service.ts @@ -42,7 +42,6 @@ export class AuthService { "user/state", {}, (response: UserStateResponse) => { - console.log("set next state"); this.currentState$.next(response); }, () => { diff --git a/src/app/core/services/notification.service.ts b/src/app/core/services/notification.service.ts index e7bf85e..1de8a21 100644 --- a/src/app/core/services/notification.service.ts +++ b/src/app/core/services/notification.service.ts @@ -6,8 +6,29 @@ import { NotificationElement } from "../components/notification-bar/notification export class NotificationService { notification$ = new Subject(); - push(notification: NotificationElement): void { - console.log(notification.type + ": " + notification.message); - this.notification$.next(notification); + push(message: string, type: "info" | "danger" | "warn" | "success"): void { + console.log(type + ": " + message); + + let timeout = undefined; + switch (type) { + case "info": + timeout = 5; + break; + case "danger": + timeout = 10; + break; + case "warn": + timeout = 7; + break; + case "success": + timeout = 3; + break; + } + + this.notification$.next({ + message: message, + type: type, + timeout: timeout, + }); } } diff --git a/src/app/core/services/request.service.ts b/src/app/core/services/request.service.ts index aff9b5e..9625f01 100644 --- a/src/app/core/services/request.service.ts +++ b/src/app/core/services/request.service.ts @@ -2,6 +2,7 @@ import { HttpClient } from "@angular/common/http"; import { Router } from "@angular/router"; import { Injectable } from "@angular/core"; import { NotificationService } from "./notification.service"; +import { TranslateService } from "@ngx-translate/core"; @Injectable({ providedIn: "root", @@ -10,7 +11,8 @@ export class RequestService { constructor( private http: HttpClient, private router: Router, - private notificationService: NotificationService + private notificationService: NotificationService, + private translate: TranslateService ) {} public post( @@ -85,7 +87,7 @@ export class RequestService { private handleError(answer: any): void { if (answer.status == 401) { - console.log("Deine Sitzung konnte nicht gefunden werden"); + this.showSnackBar("Deine Sitzung konnte nicht gefunden werden"); this.router.navigate(["/auth"]); return; } @@ -103,7 +105,10 @@ export class RequestService { } if (errorObject.hasOwnProperty("code")) { - throw errorObject.code.toString(); + throw ( + this.translate.instant("error." + errorObject.code.toString()) ?? + errorObject.code.toString() + ); } } catch (error: any) { this.showSnackBar(error.toString()); @@ -111,9 +116,6 @@ export class RequestService { } private showSnackBar(message: string) { - this.notificationService.push({ - type: "info", - message: message, - }); + this.notificationService.push(message, "info"); } } diff --git a/src/app/shared/components/table/table.component.ts b/src/app/shared/components/table/table.component.ts index aeb2280..aa811ff 100644 --- a/src/app/shared/components/table/table.component.ts +++ b/src/app/shared/components/table/table.component.ts @@ -17,7 +17,6 @@ export class TableComponent { @Input() columns: ColumnDefinition[] = []; isBoolean(obje: any): boolean { - console.log(obje); return typeof obje === "boolean"; } } diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json new file mode 100644 index 0000000..9428b59 --- /dev/null +++ b/src/assets/i18n/de.json @@ -0,0 +1,54 @@ +{ + "title": "Bienenkeeper", + "error": { + "Generic.SomethingWentWrong": "Ein unerwarteter Fehler ist aufgetreten. Bitte versuche es später erneut." + }, + "languages": { + "de": "Deutsch", + "en": "Englisch" + }, + "menu": { + "settings": "Einstellungen", + "logout": "Ausloggen", + "theme": { + "dark": "Dunkel", + "light": "Hell" + } + }, + "navigation": { + "home": "Startseite", + "colonies": "Völker" + }, + "auth": { + "password": "Password", + "email": "E-Mail", + "username-or-email": "Benutzername oder E-Mail", + "username": "Benutzername", + "login": "Anmelden", + "registration": "Registrierung", + "register": "Registrieren", + "reset-password": "Passwort zurücksetzen", + "new-password": "Neues Passwort", + "password-confirmation": "Passwort wiederholen", + "reset-password-confirmation": "Neues Passwort setzen", + "already-registered": "Bereits registriert?", + "not-yet-registered": "Noch nicht registriert?", + "login-now": "Jetzt anmelden!", + "register-now": "Jetzt registrieren!", + "forgot-password": "Passwort vergessen", + "confirm-registration": "Registrierung bestätigen" + }, + "settings": { + "tab-security": "Sicherheit", + "tab-profile": "Profil", + + "security": { + "change-username": "Benutzername ändern", + "change-password": "Passwort ändern", + "current-password": "Aktuelles Passwort", + "new-password": "Neues Passwort", + "new-username": "Neuer Benutzername", + "password-confirmation": "Passwort wiederholen" + } + } +} diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json new file mode 100644 index 0000000..fcba7d8 --- /dev/null +++ b/src/assets/i18n/en.json @@ -0,0 +1,54 @@ +{ + "title": "Beekeeper", + "error": { + "Generic.SomethingWentWrong": "An unexpected error has occurred. Please try again later." + }, + "languages": { + "de": "German", + "en": "English" + }, + "menu": { + "settings": "Settings", + "logout": "Logout", + "theme": { + "dark": "Dark", + "light": "Light" + } + }, + "navigation": { + "home": "Home", + "colonies": "Colonies" + }, + "auth": { + "password": "Password", + "email": "Email", + "username-or-email": "Username or Email", + "username": "Username", + "login": "Login", + "registration": "Registration", + "register": "Register", + "reset-password": "Reset Password", + "new-password": "New Password", + "password-confirmation": "Confirm Password", + "reset-password-confirmation": "Set New Password", + "already-registered": "Already registered?", + "not-yet-registered": "Not yet registered?", + "login-now": "Login now!", + "register-now": "Register now!", + "forgot-password": "Forgot Password", + "confirm-registration": "Confirm Registration" + }, + "settings": { + "tab-security": "Security", + "tab-profile": "Profile", + + "security": { + "change-username": "Change Username", + "change-password": "Change Password", + "current-password": "Current Password", + "new-password": "New Password", + "new-username": "New Username", + "password-confirmation": "Confirm Password" + } + } +} diff --git a/src/assets/icon.svg b/src/assets/icon.svg new file mode 100644 index 0000000..70de9b6 --- /dev/null +++ b/src/assets/icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/tailwind.config.js b/tailwind.config.js index c0072b1..4f453c8 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -12,6 +12,7 @@ module.exports = { content: ["./src/**/*.{html,ts}", "./node_modules/flowbite/**/*.js"], theme: { extend: { + // "foregrounds" textColor: { skin: { primary: withOpacity("--color-text-primary"), @@ -22,6 +23,18 @@ module.exports = { "accent-muted": withOpacity("--color-text-accent-muted"), }, }, + fill: { + skin: { + primary: withOpacity("--color-text-primary"), + "primary-muted": withOpacity("--color-text-primary-muted"), + secondary: withOpacity("--color-text-secondary"), + "secondary-muted": withOpacity("--color-text-secondary-muted"), + accent: withOpacity("--color-text-accent"), + "accent-muted": withOpacity("--color-text-accent-muted"), + }, + }, + + // "backgrounds" backgroundColor: { skin: { primary: withOpacity("--color-primary"), @@ -29,6 +42,8 @@ module.exports = { accent: withOpacity("--color-accent"), }, }, + + // "delicate lines" boxShadowColor: { skin: { primary: withOpacity("--color-text-secondary-muted"),