From b7aeed43212f0b257b7cfc837b34256686de9c57 Mon Sep 17 00:00:00 2001 From: cofrizot Date: Wed, 17 Jan 2024 16:43:29 +0100 Subject: [PATCH] Add the Header and Landing Page responsive and the Light/Dark mode. --- src/app/app.component.html | 4 +- src/app/app.component.scss | 8 +- src/app/app.component.ts | 2 +- .../components/header/header.component.html | 126 +++++-- .../components/header/header.component.scss | 322 +++++++++++++++++- src/app/components/header/header.component.ts | 82 +++-- .../landing-page/landing-page.component.html | 2 +- .../landing-page/landing-page.component.scss | 28 +- .../landing-page/landing-page.component.ts | 14 +- src/app/services/translation.service.ts | 4 - src/assets/i18n/en.json | 1 - src/assets/i18n/fr.json | 1 - src/styles.scss | 1 + 13 files changed, 513 insertions(+), 82 deletions(-) diff --git a/src/app/app.component.html b/src/app/app.component.html index a6988bd..1f214b8 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,9 +1,7 @@
- -
- +
diff --git a/src/app/app.component.scss b/src/app/app.component.scss index 92f0a2a..30e95f9 100644 --- a/src/app/app.component.scss +++ b/src/app/app.component.scss @@ -1,15 +1,19 @@ @import '../styles'; +body { + overflow: hidden; + transition: background-color .3s ease-in-out, color .3s ease-in-out; +} + + body.light-theme { background-color: #ffffff; color: #000000; - /* Autres styles pour le thème clair */ } body.dark-theme { background-color: #333333; color: #ffffff; - /* Autres styles pour le thème sombre */ } .app { diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 3f94dc8..b3bc364 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -9,7 +9,7 @@ import { ThemeService } from './services/theme.service'; export class AppComponent implements OnInit { themeClass = 'light-theme'; - constructor(private themeService: ThemeService) {} + constructor(public themeService: ThemeService) {} ngOnInit() { this.themeService.isDarkTheme.subscribe((isDark) => { diff --git a/src/app/components/header/header.component.html b/src/app/components/header/header.component.html index 0d07bd0..bb52965 100644 --- a/src/app/components/header/header.component.html +++ b/src/app/components/header/header.component.html @@ -10,13 +10,11 @@
-