Warning banner (#4)

src/components/header.tsx

@@ -0,0 +1,23 @@
+import { Header as KvibHeader } from "@kvib/react";
+
+export function Header() {
+	return (
+		<header>
+			<WarningBanner />
+			<KvibHeader />
+		</header>
+	);
+}
+
+function WarningBanner() {
+	return (
+		<div className="bg-red-50 text-red-900 text-sm font-medium px-4 py-2 rounded-md flex items-center flex-col">
+			<p>
+				Denne siden er under utvikling. Vi er ikke helt sikre på at alt funker
+				som det skal.
+			</p>
+			<p>Alt innhold blir liggende offentlig tilgjengelig.</p>
+			<p>Vær forsiktig med å legge inn sensitiv/hemmelig informasjon.</p>
+		</div>
+	);
+}

src/routes/__root.tsx

@@ -1,4 +1,5 @@
-import { FooterInline, Header, KvibProvider } from "@kvib/react";
+import { Header } from "@/components/header";
+import { FooterInline, KvibProvider } from "@kvib/react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { createRootRoute, Outlet } from "@tanstack/react-router";
 
@@ -9,9 +10,7 @@ export const Route = createRootRoute({
 		<QueryClientProvider client={queryClient}>
 			<KvibProvider>
 				<div className="flex flex-col min-h-svh">
-					<header>
-						<Header />
-					</header>
+					<Header />
 					<Outlet />
 					<footer>
 						<FooterInline />