Add FAQ guide and contextual help links

frontend/src/App.tsx

@@ -4,6 +4,7 @@ import {
   ClipboardCheck,
   Command,
   ChartNoAxesCombined,
+  CircleHelp,
   LayoutGrid,
   LogOut,
   Moon,
@@ -33,6 +34,7 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { Separator } from "@/components/ui/separator";
+import { HelpLink } from "@/components/HelpLink";
 import {
   Sidebar,
   SidebarContent,
@@ -56,6 +58,7 @@ import { formatTimer } from "./format";
 import { activeElapsedMs, pauseEntry, readStoredTimers, resumeEntry, storageKeyForUser, ticketPattern, type TimerEntry } from "./timers";
 import { AdminUsersPage } from "./views/AdminUsersPage";
 import { AnalysisPage } from "./views/AnalysisPage";
+import { FaqPage } from "./views/FaqPage";
 import { LoginPage } from "./views/LoginPage";
 import { MonthlyClosePage } from "./views/MonthlyClosePage";
 import { ProfilePage } from "./views/ProfilePage";
@@ -97,6 +100,10 @@ function routeFromPath(pathname: string) {
     return { page: "statistics" as const };
   }
 
+  if (pathname.startsWith("/faq")) {
+    return { page: "faq" as const };
+  }
+
   if (pathname.startsWith("/monthly-close")) {
     return { page: "monthly-close" as const };
   }
@@ -202,6 +209,7 @@ function QuickTimerStarter({ className, inputId, onStartTimer }: QuickTimerStart
         <span className="hidden sm:inline">Timer starten</span>
         <span className="sm:hidden">Start</span>
       </Button>
+      <HelpLink anchor="timer" label="Hilfe zum schnellen Timerstart" className="hidden md:inline-flex" />
     </form>
   );
 }
@@ -516,6 +524,7 @@ export function App() {
     { href: "/monthly-close", label: "Monatsabschluss", icon: ClipboardCheck, active: path.startsWith("/monthly-close") },
     { href: "/statistics", label: "Statistiken", icon: ChartNoAxesCombined, active: path.startsWith("/statistics") },
     { href: "/recurring", label: "Fixe Abrechnung", icon: Repeat, active: path.startsWith("/recurring") },
+    { href: "/faq", label: "FAQ", icon: CircleHelp, active: path.startsWith("/faq") },
     { href: "/profile", label: "Profil", icon: UserCog, active: path.startsWith("/profile") },
     ...(currentUser.role === "admin"
       ? [{ href: "/admin/users", label: "Benutzer", icon: Shield, active: path.startsWith("/admin/users") }]
@@ -702,6 +711,7 @@ export function App() {
             {route.page === "monthly-close" ? <MonthlyClosePage onNavigate={navigate} /> : null}
             {route.page === "statistics" ? <StatisticsPage onNavigate={navigate} /> : null}
             {route.page === "recurring" ? <RecurringBillingsPage /> : null}
+            {route.page === "faq" ? <FaqPage /> : null}
             {route.page === "profile" ? <ProfilePage currentUser={currentUser} onUserUpdated={setCurrentUser} /> : null}
             {route.page === "admin-users" && currentUser.role === "admin" ? <AdminUsersPage currentUser={currentUser} /> : null}
             {route.page === "admin-users" && currentUser.role !== "admin" ? (