Header improvements

This commit is contained in:
Olaf
2026-08-24 20:17:46 +02:00
parent 12f3580f60
commit f96a4ab3ad
11 changed files with 183 additions and 93 deletions
+30
View File
@@ -295,3 +295,33 @@ Pressing signout (on the home page) does not log the user out
### Assistant outcome
Found that the home page rendered the shared authenticated session header but did not load `logout.js`, so its sign-out button had no event handler. Added the logout handler to the home and login pages with cache-busted asset references. Verified real token revocation and the full strict backend suite with 12 passing tests.
### User
Instead of the buttons on the top of the page create a 'hamburger' dropdown menu. The menu items are sign in, profile, admin, and sign out with authenticated visibility rules.
### Assistant outcome
Replaced top-level authentication buttons on all web pages with a shared hamburger menu. The menu contains Sign in for signed-out users, Profile and Sign out for authenticated users, and Admin only for administrators. Added accessible toggle state, avatar/username identity display, responsive Mocha styling, and updated route tests. The strict backend suite passed with 12 tests and all browser scripts passed syntax checks.
### User
The menu items on the dropdown render behind <main class='container'>
### Assistant outcome
Fixed the dropdown stacking context by removing header overflow clipping, elevating the header above main content, and raising the menu z-index. Verified the served CSS rules, page rendering, browser scripts, and strict backend suite with 12 passing tests.
### User
The menu should not show the profile, admin and signout items when nobody is authenticated.
### Assistant outcome
Fixed CSS specificity so `.hidden` works inside the hamburger menu. The menu now shows only `Sign in` when no valid session exists; Profile, Admin, and Sign out remain hidden. Served CSS and authentication script checks passed, followed by the strict backend suite with 12 tests.
### User
Add one entry on top of the hamburger menu 'home' that always directs to the home page.
### Assistant outcome
Added `Home` as the first item in the shared hamburger menu on feed, user, login, profile, and admin pages. It always remains visible and links to `/`, independent of authentication state. All page smoke checks and the strict backend suite passed with 12 tests.
### User
where the hamburger menu shows the avatar and username, replace by username only and link to the /user/ page
### Assistant outcome
Replaced the hamburger menu avatar/username row with a username-only link. After authentication, the link dynamically targets `/<username>/`; the separate Profile, Admin, and Sign out menu items retain their session-based visibility. Removed the old menu avatar dependency, bumped the shared header asset to `v3`, and verified all pages plus the strict backend suite with 12 tests.
+5
View File
@@ -52,6 +52,11 @@
48. execute next todo
49. execute final todo (nummer 3)
50. Pressing signout (on the home page) does not log the user out
51. Instead of the buttons on the top of the page create a 'hamburger' dropdown menu. The menu items are sign in, profile, admin, and sign out with authenticated visibility rules.
52. The menu items on the dropdown render behind <main class='container'>
53. The menu should not show the profile, admin and signout items when nobody is authenticated.
54. Add one entry on top of the hamburger menu 'home' that always directs to the home page.
55. where the hamburger menu shows the avatar and username, replace by username only and link to the /user/ page
## Future entries