feat: modernize branding, seo, and fix navigation/memory leaks

src/app/core/services/seo/content.ts

@@ -10,17 +10,17 @@ const seoContent: {
 } = {
   '/': {
     de: {
-      title: 'Esser Web Engineering | Senior Angular Architekt',
+      title: 'Esser Web Engineering | Freelance Senior Angular Architekt',
       description:
-        'Senior Angular Architekt & Web Engineering. Spezialisiert auf den Aufbau skalierbarer Enterprise-Anwendungen, die Optimierung von Performance-Engpässen und die Lieferung hochkarätiger Angular-Lösungen.',
+        'Freelance Senior Angular Architekt. Spezialisiert auf High-Performance Architekturen und die Rettung komplexer Legacy-Codebases. ROI-fokussierte technische Exzellenz für Enterprise-Projekte.',
       imageUrl:
         'https://tricalculator-images.s3.eu-central-1.amazonaws.com/website/esser-web-engineering-logo-text-og-moz.jpg',
       type: 'website',
     },
     en: {
-      title: 'Esser Web Engineering | Senior Angular Architect',
+      title: 'Esser Web Engineering | Freelance Senior Angular Architect',
       description:
-        'Senior Angular Architect & Web Engineering. Specialized in building scalable enterprise applications, optimizing performance bottlenecks, and delivering high-quality Angular solutions.',
+        'Freelance Senior Angular Architect. Specialized in high-performance architectures and rescuing complex legacy codebases. ROI-focused technical excellence for enterprise projects.',
       imageUrl:
         'https://tricalculator-images.s3.eu-central-1.amazonaws.com/website/esser-web-engineering-logo-text-og-moz.jpg',
       type: 'website',

src/app/features/about/about/about.component.html

@@ -4,9 +4,6 @@
 >
   <h2
     i18n="@@homeTitle"
-    #ueberMich
-    id="ueberMich"
-    style="scroll-margin-top: 130px;"
     class="mb-8 pt-2 text-3xl sm:text-4xl"
   >
     Über Mich

src/app/features/home/home/home.component.html

@@ -152,7 +152,7 @@
 
 <div class="relative">
   <div class="text-center relative">
-    <div>
+    <div id="ueberMich" style="scroll-margin-top: 130px;">
       @defer (hydrate on viewport; prefetch on idle) {
         <app-about></app-about>
       } @placeholder {

src/app/layout/header/header.component.ts

@@ -70,6 +70,8 @@ export class HeaderComponent implements OnInit, AfterViewInit, OnDestroy {
   homeRoute: string = '/';
   animationsDisabled = true;
   isInitialLoad = true; // New flag to track initial load
+  private scrollTimeout: any;
+  private initialLoadTimeout: any;
 
   constructor(
     private router: Router,
@@ -108,7 +110,7 @@ export class HeaderComponent implements OnInit, AfterViewInit, OnDestroy {
 
     // Mark initial load as complete and enable animations after view is stable
     if (isPlatformBrowser(this.platformId)) {
-      setTimeout(() => {
+      this.initialLoadTimeout = setTimeout(() => {
         this.isInitialLoad = false;
         this.animationsDisabled = false;
       }, 100);
@@ -118,6 +120,8 @@ export class HeaderComponent implements OnInit, AfterViewInit, OnDestroy {
   ngOnDestroy(): void {
     this.destroy.next();
     this.destroy.complete();
+    if (this.scrollTimeout) clearTimeout(this.scrollTimeout);
+    if (this.initialLoadTimeout) clearTimeout(this.initialLoadTimeout);
   }
 
   updateScreenState(width: number): void {
@@ -230,13 +234,15 @@ export class HeaderComponent implements OnInit, AfterViewInit, OnDestroy {
 
   navigateAndScroll() {
     this.router.navigate(['/']).then(() => {
-      setTimeout(() => this.scrollToElement('ueberMich'), 0);
+      if (this.scrollTimeout) clearTimeout(this.scrollTimeout);
+      this.scrollTimeout = setTimeout(() => this.scrollToElement('ueberMich'), 50);
     });
   }
 
   navigateAndScrollKontakt() {
     this.router.navigate(['/']).then(() => {
-      setTimeout(() => this.scrollToElement('kontakt'), 0);
+      if (this.scrollTimeout) clearTimeout(this.scrollTimeout);
+      this.scrollTimeout = setTimeout(() => this.scrollToElement('kontakt'), 50);
     });
   }
 

src/app/shared/components/kontakt/kontakt.component.ts

@@ -1,6 +1,7 @@
 import {
   Component,
   Inject,
+  HostListener,
   OnDestroy,
   OnInit,
   PLATFORM_ID,
@@ -60,9 +61,6 @@ export class KontaktComponent implements OnInit, OnDestroy {
   ngOnInit() {
     this.contactForm = this.formService.getForm();
     this.initializeFormControls();
-    if (isPlatformBrowser(this.platformId)) {
-      window.addEventListener('online', this.handleOnline.bind(this));
-    }
   }
 
   ngOnDestroy() {
@@ -73,6 +71,7 @@ export class KontaktComponent implements OnInit, OnDestroy {
     this.destroy$.complete();
   }
 
+  @HostListener('window:online')
   handleOnline(): void {
     const pendingFormData = localStorage.getItem('pendingFormData');
     if (pendingFormData) {

src/index.html

@@ -13,18 +13,18 @@
     <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
     <link rel="manifest" href="manifest.webmanifest" />
     <link rel="preconnect" href="https://tricalculator-images.s3.eu-central-1.amazonaws.com" crossorigin />
-    <title>Esser Web Engineering | Senior Angular Architekt</title>
+    <title>Esser Web Engineering | Freelance Senior Angular Architekt</title>
     <meta
       name="description"
-      content="Senior Angular Architekt & Web Engineering. Spezialisiert auf den Aufbau skalierbarer Enterprise-Anwendungen und Performance-Optimierung."
+      content="Freelance Senior Angular Architekt. Spezialisiert auf High-Performance Architekturen und die Rettung komplexer Legacy-Codebases. ROI-fokussierte technische Exzellenz für Enterprise-Projekte."
     />
     <meta
       property="og:title"
-      content="Esser Web Engineering | Senior Angular Architekt"
+      content="Esser Web Engineering | Freelance Senior Angular Architekt"
     />
     <meta
       property="og:description"
-      content="Senior Angular Architekt & Web Engineering. Spezialisiert auf den Aufbau skalierbarer Enterprise-Anwendungen und Performance-Optimierung."
+      content="Freelance Senior Angular Architekt. Spezialisiert auf High-Performance Architekturen und die Rettung komplexer Legacy-Codebases. ROI-fokussierte technische Exzellenz für Enterprise-Projekte."
     />
     <meta
       property="og:image"