nico/byhaider-homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(navigation-bar): add theme- and language-buttons to mobile-menu

Browse Source
This commit is contained in:
nico.hdr8
2025-10-07 13:59:07 +02:00
parent 9b83c162f3
commit 610328129d
2 changed files with 19 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/app/core/components/navigation-bar/navigation-bar.html
View File

@@ -51,8 +51,24 @@
<a routerLink="/projects" routerLinkActive="active" (click)="showMobileMenu.set(false)">
{{ 'common.projects' | translate }}
</a>
<hr class="h-[1px] w-[80%] bg-(--content-color) mx-auto"/>
<div class="options flex flex-row gap-[10px] items-center justify-center">
@if (themeSwitchService.darkMode()) {
<div class="dark-mode size-[50px]" (click)="themeSwitchService.switchToLight()">
<fa-icon [icon]="faMoon"/>
</div>
} @else {
<div class="dark-mode size-[50px]" (click)="themeSwitchService.switchToDark()">
<fa-icon [icon]="faSun"/>
</div>
}
<div class="language size-[50px]" (click)="toggleLanguage()">
{{ translateService.getCurrentLang().toUpperCase() }}
</div>
</div>
</li>
</ul>
</div>
<div class="block md:hidden w-full h-full fixed top-0 left-0 z-40 backdrop-blur-md"></div>
}

6
src/app/core/components/navigation-bar/navigation-bar.scss
View File

@@ -1,4 +1,3 @@
nav {
.options > div {
display: grid;
place-items: center;
@@ -8,12 +7,11 @@ nav {
transition: border .5s ease;
&:hover {
border-color: var(--content-hover-background);
border-color: rgb(from var(--content-color) r g b / 0.5);
}
&:active {
border-color: var(--content-border-color);
}
border-color: var(--content-color);
}
}