diff --git a/admin/src/app/header/header.component.html b/admin/src/app/header/header.component.html index 21eec425..ab82d0d6 100644 --- a/admin/src/app/header/header.component.html +++ b/admin/src/app/header/header.component.html @@ -42,9 +42,12 @@
diff --git a/admin/src/app/header/header.component.scss b/admin/src/app/header/header.component.scss index 3c9cfa39..5f57039d 100644 --- a/admin/src/app/header/header.component.scss +++ b/admin/src/app/header/header.component.scss @@ -76,7 +76,7 @@ li { .language{ padding-bottom: 3px; padding-left: 0px; - padding-right: 20px; + padding-right: 30px; .icon-earth{ font-size: 26px } @@ -85,4 +85,11 @@ li { text-align: center; font-size: 14px; margin-top: 5px; +} + +.icon-wrapper { + display: flex; + align-items: center; + cursor: pointer; + margin-right: 20px; } \ No newline at end of file diff --git a/admin/src/app/login-page/login-page.component.html b/admin/src/app/login-page/login-page.component.html index ceb34e03..403f127e 100644 --- a/admin/src/app/login-page/login-page.component.html +++ b/admin/src/app/login-page/login-page.component.html @@ -1,5 +1,29 @@
- +
+
+ + +
+
diff --git a/admin/src/app/login-page/login-page.component.scss b/admin/src/app/login-page/login-page.component.scss index 336303ff..09f0b606 100644 --- a/admin/src/app/login-page/login-page.component.scss +++ b/admin/src/app/login-page/login-page.component.scss @@ -1,20 +1,18 @@ + .login-page { display: flex; + flex-direction: column; + justify-content: center; + align-items: center; flex: 1 0 auto; width: 100%; min-height: 100vh; - background: url('/assets/images/dark-material-bg.jpg') no-repeat; + background: url('/assets/images/dark-material-bg.jpg') no-repeat center center; background-size: cover; - flex-direction: column; - justify-content: center; - align-items: center; } .logo { - position: absolute; - left: 20px; - top: 20px; - max-width: 30%; + max-width: 50%; } .form-control { @@ -82,3 +80,67 @@ z-index: 1; font-size: 25px; } + +.header { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 60px; /* ajustez la hauteur selon vos besoins */ + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 25px; + padding: 10px 20px; /* espace autour du logo et de l'icône */ + z-index: 1000; /* pour s'assurer que le header est au-dessus du reste */ +} + +.container { + padding-top: 80px; +} + + +.dropdown-container { + display: flex; + align-items: center; +} + + +.icon-language-container { + display: flex; + flex-direction: column; + align-items: center; +} + + +.selected-language { + color: white; + font-size: 14px; + margin-top: 5px; /* Espace entre l'icône et la langue */ +} + +.icon-language-toggle { + color:white; + display: flex; + align-items: center; + cursor: pointer; +} + +.icon-language-toggle .icon-earth { + font-size: 24px; +} + +.icon-language-toggle .selected-language { + margin-left: 8px; +} + +.icon-language-toggle .dropdown-arrow { + font-size: 24px; /* Ajustez selon vos préférences */ +} + +.icon-wrapper { + display: flex; + align-items: center; + cursor: pointer; + padding: 0px 10px 2px 2px; +} diff --git a/admin/src/app/login-page/login-page.component.ts b/admin/src/app/login-page/login-page.component.ts index 35e8d14e..28b4a2d9 100644 --- a/admin/src/app/login-page/login-page.component.ts +++ b/admin/src/app/login-page/login-page.component.ts @@ -17,7 +17,8 @@ export class LoginPageComponent implements OnInit { userForm: any; currentUser: User; logoUrl: string; - currentLang: string; + availableLanguages: string[] = []; + selectedLanguage: string; constructor( private loginService: LoginService, @@ -28,7 +29,10 @@ export class LoginPageComponent implements OnInit { ) {} ngOnInit() { - this.currentLang = this.languageService.getCurrentLang(); + this.selectedLanguage = this.languageService.getCurrentLang(); + this.languageService.getAvailableLanguages().subscribe(languages => { + this.availableLanguages = languages; + }); this.logoUrl = `${Conf.customFiles}images/logo_txt_blanc.png`; this.loginForm = this.formBuilder.group({ login: ['', Validators.required], @@ -76,4 +80,9 @@ export class LoginPageComponent implements OnInit { } return 'required'; } + + changeLanguage(lang: string) { + this.languageService.changeLanguage(lang); + this.selectedLanguage = lang; + } }