feat: auto-hide search

This commit is contained in:
2024-07-07 23:48:02 +03:00
parent e6da8b17a7
commit 9d2373a298
5 changed files with 23 additions and 10 deletions

View File

@@ -1,6 +1,7 @@
import { CommonModule } from "@angular/common";
import { AfterViewInit, Component, ElementRef, ViewChild } from "@angular/core";
import { ActivatedRoute, Router } from "@angular/router";
import { ActivatedRoute, NavigationEnd, Router } from "@angular/router";
import { filter } from "rxjs";
@Component({
selector: "app-header",
@@ -15,7 +16,16 @@ export class HeaderComponent implements AfterViewInit {
constructor(
private router: Router,
private route: ActivatedRoute,
) {}
) {
this.router.events
.pipe(filter((event) => event instanceof NavigationEnd))
// eslint-disable-next-line @typescript-eslint/no-explicit-any
.subscribe((val: any) => {
if (val.url.startsWith("/detail") || val.url.startsWith("/reader")) {
this.menuOpened = false;
}
});
}
changeMenu() {
this.menuOpened = !this.menuOpened;
}
@@ -25,7 +35,7 @@ export class HeaderComponent implements AfterViewInit {
}
get searchBarClass(): string {
return `search-bar bg-slate-300 md:w-[50%] w-full md:m-0 ms-2 me-2 max-h-6 md:flex justify-start flex-row items-center rounded-md ${this.menuOpened ? "flex" : "hidden"}`;
return `search-bar bg-slate-300 md:w-[50%] w-full md:m-0 ms-2 me-2 md:h-6 h-10 md:flex justify-start flex-row items-center rounded-md ${this.menuOpened ? "flex" : "hidden"}`;
}
search() {