Refactored Angular components to standalone modules, enhancing modularity and reducing dependency on `AppModule`. Updated routes to facilitate lazy loading for improved performance and maintainability. Replaced `platformBrowserDynamic` with `bootstrapApplication` for modern bootstrapping.
62 lines
1.5 KiB
TypeScript
62 lines
1.5 KiB
TypeScript
import {Component, HostListener, Input} from '@angular/core';
|
|
import {CommonModule, NgOptimizedImage} from '@angular/common';
|
|
import {ThemeComponent} from '../theme/theme.component';
|
|
import {RouterLink} from '@angular/router';
|
|
|
|
@Component({
|
|
standalone: true,
|
|
imports: [
|
|
CommonModule,
|
|
ThemeComponent,
|
|
RouterLink,
|
|
NgOptimizedImage
|
|
],
|
|
selector: 'app-header',
|
|
templateUrl: './header.component.html',
|
|
styleUrls: ['./header.component.scss']
|
|
})
|
|
export class HeaderComponent {
|
|
@Input() current_page: string = '';
|
|
@Input() background_image: string = '';
|
|
@Input() height: string = '';
|
|
@Input() overlay_gradient: number = 0;
|
|
|
|
public active: string = '';
|
|
public inverseYPos: number = 0;
|
|
|
|
@HostListener('window:scroll', [])
|
|
onWindowScroll(): void {
|
|
const scrollPosition = window.scrollY;
|
|
if (scrollPosition > 0) {
|
|
this.active = 'active';
|
|
this.inverseYPos = (scrollPosition / 4) * -1;
|
|
} else {
|
|
this.active = '';
|
|
}
|
|
}
|
|
|
|
public getBackgroundImage() {
|
|
if (this.overlay_gradient) {
|
|
return `linear-gradient(rgba(0, 0, 0, ${this.overlay_gradient}), rgba(0, 0, 0, ${this.overlay_gradient})), url(${this.background_image})`;
|
|
} else {
|
|
return `url(${this.background_image})`;
|
|
}
|
|
}
|
|
|
|
|
|
public getCurrentPageId(options: string[]) {
|
|
if (options.includes(this.current_page)) {
|
|
return 'current_page'
|
|
}
|
|
return null;
|
|
}
|
|
|
|
public getBackgroundPosition() {
|
|
if (this.current_page === 'home') {
|
|
return 'center ' + this.inverseYPos + 'px'
|
|
} else {
|
|
return '';
|
|
}
|
|
}
|
|
}
|