.

app/page.tsx

@@ -1,21 +1,16 @@
 'use client';
 
 import { useState, useEffect } from 'react';
-import Link from 'next/link';
 import WerteForm from '@/components/WerteForm';
 import WerteList from '@/components/WerteList';
 import { WerteEntry } from '@/types/werte';
-import packageJson from '@/package.json';
-import LogoutButton from '@/components/LogoutButton';
+import TabLayout from '@/components/TabLayout';
 
 export default function Home() {
   const [entries, setEntries] = useState<WerteEntry[]>([]);
   const [isLoading, setIsLoading] = useState(true);
   const [selectedEntry, setSelectedEntry] = useState<WerteEntry | null>(null);
 
-  const version = packageJson.version;
-  const buildDate = process.env.NEXT_PUBLIC_BUILD_DATE || new Date().toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit', year: 'numeric' });
-
   useEffect(() => {
     let isMounted = true;
     
@@ -81,23 +76,8 @@ export default function Home() {
   };
 
   return (
-    <div className="min-h-screen bg-white py-4 px-4">
-      <main className="max-w-6xl mx-auto border-2 border-black rounded-lg p-6 bg-[#FFFFDD]">
-        <div className="flex justify-between items-center mb-6">
-          <h1 className="text-3xl font-bold">Werte - Log</h1>
-          <div className="flex gap-3 items-center">
-            <Link
-              href="/charts"
-              className="px-4 py-2 text-sm rounded-lg transition-colors shadow-md"
-              style={{ backgroundColor: '#374151', color: '#ffffff' }}
-            >
-              {'Verlauf ->'}
-            </Link>
-            <LogoutButton className="px-4 py-2 bg-red-600 hover:bg-red-700 text-white text-sm rounded-lg transition-colors shadow-md" />
-          </div>
-        </div>
-        
-        <div className="mb-8">
+    <TabLayout>
+      <div className="mb-8">
           <h2 className="text-xl font-semibold mb-4">Eingabe</h2>
           <WerteForm onSuccess={handleSuccess} selectedEntry={selectedEntry} />
         </div>
@@ -111,15 +91,6 @@ export default function Home() {
           )}
         </div>
 
-        <footer className="mt-8 flex justify-between items-center text-sm text-gray-600 px-4">
-          <a href="mailto:rxf@gmx.de" className="hover:underline">
-            mailto:rxf@gmx.de
-          </a>
-          <div>
-            Version {version} - {buildDate}
-          </div>
-        </footer>
-      </main>
-    </div>
+      </TabLayout>
   );
 }