From fe7677ea8b857e05cfcc6f1caea2c33afb990a10 Mon Sep 17 00:00:00 2001
From: thomas <toma.laforge@gmail.com>
Date: Mon, 31 Aug 2026 09:34:40 +0200
Subject: [PATCH] fix(website): improve landing page mobile view

Hide hamburger menu icon on landing page (no sidebar needed) and
shorten sponsor banner text on mobile to keep it on one line.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 website/src/app/layout/site-header.html    | 2 ++
 website/src/app/layout/site-header.ts      | 3 ++-
 website/src/app/pages/landing/landing.html | 8 ++++----
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/website/src/app/layout/site-header.html b/website/src/app/layout/site-header.html
index 655308166..57f30a568 100644
--- a/website/src/app/layout/site-header.html
+++ b/website/src/app/layout/site-header.html
@@ -1,5 +1,6 @@
 <header class="sticky top-0 z-40 border-b border-neutral-200 bg-white/90 backdrop-blur dark:border-neutral-800 dark:bg-neutral-950/90">
   <div class="flex h-14 items-center gap-3 px-4 sm:px-6">
+    @if (showMenu()) {
     <button
       type="button"
       aria-label="Toggle navigation"
@@ -9,6 +10,7 @@
         <path stroke-linecap="round" d="M4 6h16M4 12h16M4 18h16" />
       </svg>
     </button>
+    }
     <a routerLink="/" class="flex items-center gap-2.5">
       <img src="/angular-challenge.webp" alt="" class="h-7 w-7" />
       <span class="hidden font-semibold tracking-tight min-[480px]:inline">Angular Challenges</span>
diff --git a/website/src/app/layout/site-header.ts b/website/src/app/layout/site-header.ts
index b1616185a..befc0326b 100644
--- a/website/src/app/layout/site-header.ts
+++ b/website/src/app/layout/site-header.ts
@@ -1,4 +1,4 @@
-import { Component, PLATFORM_ID, computed, inject, output } from '@angular/core';
+import { Component, PLATFORM_ID, computed, inject, input, output } from '@angular/core';
 import { isPlatformBrowser } from '@angular/common';
 import { httpResource } from '@angular/common/http';
 import { RouterLink } from '@angular/router';
@@ -11,6 +11,7 @@ import { Theme } from '../theme';
   templateUrl: './site-header.html',
 })
 export class SiteHeader {
+  readonly showMenu = input(true);
   readonly menuToggled = output<void>();
   protected readonly auth = inject(Auth);
   protected readonly theme = inject(Theme);
diff --git a/website/src/app/pages/landing/landing.html b/website/src/app/pages/landing/landing.html
index b5858177a..f7e717305 100644
--- a/website/src/app/pages/landing/landing.html
+++ b/website/src/app/pages/landing/landing.html
@@ -6,14 +6,14 @@
     class="pointer-events-none absolute top-40 -right-40 h-96 w-96 rounded-full bg-violet-600/5 blur-3xl dark:bg-violet-600/10"
     aria-hidden="true"></div>
 
-  <app-site-header />
+  <app-site-header [showMenu]="false" />
 
   <!-- Sponsors banner -->
   <div class="relative z-10 border-b border-neutral-200/60 bg-neutral-100/40 dark:border-neutral-800/60 dark:bg-neutral-900/40">
     <div
-      class="mx-auto flex w-full max-w-6xl flex-wrap items-center justify-between gap-3 px-4 py-2.5 text-sm text-neutral-700 sm:px-6 dark:text-neutral-300">
-      <div class="flex flex-wrap items-center gap-3">
-        <span>This project is sustained by its sponsors</span>
+      class="mx-auto flex w-full max-w-6xl items-center justify-between gap-3 px-4 py-2.5 text-sm text-neutral-700 sm:px-6 dark:text-neutral-300">
+      <div class="flex min-w-0 items-center gap-3">
+        <span class="truncate"><span class="sm:hidden">Sustained by sponsors</span><span class="hidden sm:inline">This project is sustained by its sponsors</span></span>
         @if (sponsors().length > 0) {
           <span class="flex -space-x-1.5">
             @for (sponsor of sponsors(); track sponsor.login) {