feat: add world map functionality and admin map management

- Added world map page with interactive marker display
- Implemented admin map management for marker CRUD operations
- Added map layers and markers seed data to database
- Integrated new routes for map functionality
- Updated database configuration for production environment
- Added documentation page route
- Enhanced package.json with required dependencies for map features

components/Layout.tsx

@@ -54,7 +54,7 @@ const Layout: React.FC<LayoutProps> = ({ children, activeTab, onNavigate }) => {
                 {/* Logo */}
                 <div 
                   className="flex items-center gap-3 cursor-pointer group" 
-                  onClick={() => onNavigate('dashboard')}
+                  onClick={() => onNavigate('/')}
                 >
                     <div className="w-8 h-8 bg-gradient-to-br from-accentInfo to-blue-900 rounded flex items-center justify-center shadow-glow group-hover:shadow-lg transition-shadow">
                         <span className="font-bold text-white text-sm">P.V.</span>
@@ -69,6 +69,7 @@ const Layout: React.FC<LayoutProps> = ({ children, activeTab, onNavigate }) => {
                     <NavItem active={activeTab === 'players'} label="Bürger" to="/players" />
                     {/* <NavItem active={activeTab === 'organizations'} label="Organisationen" to="/organizations" />*/}
                     <NavItem active={activeTab === 'projects'} label="Unternehmen" to="/projects" />
+                    <NavItem active={activeTab === 'world-map'} label="Weltkarte" to="/world-map" />
                     {user?.isAdmin && (
                         <NavItem active={activeTab === 'admin'} label="Admin" to="/admin" />
                     )}
@@ -111,6 +112,7 @@ const Layout: React.FC<LayoutProps> = ({ children, activeTab, onNavigate }) => {
              <Link to="/players" onClick={() => setMobileMenuOpen(false)} className="block py-2 text-textMuted hover:text-textMain">Bürger</Link>
              <Link to="/organizations" onClick={() => setMobileMenuOpen(false)} className="block py-2 text-textMuted hover:text-textMain">Organisationen</Link>
              <Link to="/projects" onClick={() => setMobileMenuOpen(false)} className="block py-2 text-textMuted hover:text-textMain">Unternehmen</Link>
+             <Link to="/world-map" onClick={() => setMobileMenuOpen(false)} className="block py-2 text-textMuted hover:text-textMain">Weltkarte</Link>
              {user?.isAdmin && (
                <Link to="/admin" onClick={() => setMobileMenuOpen(false)} className="block py-2 text-red-400 hover:text-red-300">Admin</Link>
              )}
@@ -182,7 +184,12 @@ const Layout: React.FC<LayoutProps> = ({ children, activeTab, onNavigate }) => {
 
                   {/* Links */}
                   <div className="flex gap-8">
-                      <span className="cursor-pointer hover:text-textMain transition-colors">Dokumentation</span>
+                      <button
+                        onClick={() => onNavigate('/dokumentation')}
+                        className="cursor-pointer hover:text-textMain transition-colors"
+                      >
+                        Dokumentation
+                      </button>
                       <span className="cursor-pointer hover:text-textMain transition-colors">Server Status</span>
                       <span className="cursor-pointer hover:text-textMain transition-colors">Datenschutz</span>
                   </div>

components/MarkdownEditor.tsx

@@ -1,4 +1,6 @@
 import React, { useState, useRef } from 'react';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
 import { Icons } from './IconSet';
 
 interface MarkdownEditorProps {
@@ -95,15 +97,24 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ value, onChange, classN
         ))}
       </div>
 
-      {/* Textarea */}
-      <textarea
-        ref={textareaRef}
-        value={value}
-        onChange={(e) => onChange(e.target.value)}
-        className="w-full h-64 md:h-96 bg-[#0b0b0d] border-0 p-4 text-sm font-mono text-gray-300 focus:outline-none resize-none"
-        placeholder="Schreibe dein Journal hier... Verwende die Toolbar für Formatierung."
-        spellCheck={false}
-      />
+      {/* Editor and Preview */}
+      <div className="flex h-64 md:h-96">
+        {/* Textarea */}
+        <textarea
+          ref={textareaRef}
+          value={value}
+          onChange={(e) => onChange(e.target.value)}
+          className="w-1/2 h-full bg-[#0b0b0d] border-0 border-r border-border p-4 text-sm font-mono text-gray-300 focus:outline-none resize-none"
+          placeholder="Schreibe dein Journal hier... Verwende die Toolbar für Formatierung."
+          spellCheck={false}
+        />
+        {/* Preview */}
+        <div className="w-1/2 h-full bg-[#0b0b0d] p-4 text-sm text-gray-300 overflow-auto">
+          <ReactMarkdown remarkPlugins={[remarkGfm]}>
+            {value || 'Hier erscheint die Vorschau deiner Markdown-Formatierung.'}
+          </ReactMarkdown>
+        </div>
+      </div>
 
       {/* Footer */}
       <div className="bg-surfaceHighlight border-t border-border px-4 py-2 text-xs text-textMuted">