Update package-lock.json and package.json to include 'globals' dependency and improve code formatting in various components for better readability.

pages/cms/geschichte.vue

@@ -4,46 +4,126 @@
     <div class="fixed top-20 left-0 right-0 z-40 bg-white border-b border-gray-200 shadow-sm">
       <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-3 sm:py-4">
         <div class="flex items-center justify-between">
-          <h1 class="text-xl sm:text-3xl font-display font-bold text-gray-900">Geschichte bearbeiten</h1>
+          <h1 class="text-xl sm:text-3xl font-display font-bold text-gray-900">
+            Geschichte bearbeiten
+          </h1>
           <div class="space-x-3">
-            <button @click="save" class="inline-flex items-center px-3 py-1.5 sm:px-4 sm:py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700 text-sm sm:text-base">Speichern</button>
+            <button
+              class="inline-flex items-center px-3 py-1.5 sm:px-4 sm:py-2 rounded-lg bg-primary-600 text-white hover:bg-primary-700 text-sm sm:text-base"
+              @click="save"
+            >
+              Speichern
+            </button>
           </div>
         </div>
       </div>
     </div>
     
     <!-- Fixed Toolbar below header -->
-    <div class="fixed left-0 right-0 z-30 bg-white border-b border-gray-200 shadow-sm" style="top: 9.5rem;">
+    <div
+      class="fixed left-0 right-0 z-30 bg-white border-b border-gray-200 shadow-sm"
+      style="top: 9.5rem;"
+    >
       <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
         <div class="flex flex-wrap items-center gap-1 sm:gap-2 py-1.5 sm:py-2">
           <!-- Formatierung -->
           <div class="flex items-center gap-1 border-r pr-2 mr-2">
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="format('bold')"><strong>B</strong></button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="format('italic')"><em>I</em></button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="formatHeader(1)">H1</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="formatHeader(2)">H2</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="formatHeader(3)">H3</button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="format('bold')"
+            >
+              <strong>B</strong>
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="format('italic')"
+            >
+              <em>I</em>
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="formatHeader(1)"
+            >
+              H1
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="formatHeader(2)"
+            >
+              H2
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="formatHeader(3)"
+            >
+              H3
+            </button>
           </div>
           
           <!-- Listen -->
           <div class="flex items-center gap-1 border-r pr-2 mr-2">
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="format('insertUnorderedList')">•</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="format('insertOrderedList')">1.</button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="format('insertUnorderedList')"
+            >
+              •
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="format('insertOrderedList')"
+            >
+              1.
+            </button>
           </div>
           
           <!-- Schnellzugriff für Geschichts-Abschnitte -->
           <div class="flex items-center gap-1 border-r pr-2 mr-2">
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-gray-100 hover:bg-gray-200 text-gray-700 text-xs sm:text-sm" @click="insertHistoryTemplate('generic')">Neuer Abschnitt</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-blue-100 hover:bg-blue-200 text-blue-700 text-xs sm:text-sm" @click="insertHistoryTemplate('founding')">Gründung</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-green-100 hover:bg-green-200 text-green-700 text-xs sm:text-sm" @click="insertHistoryTemplate('milestone')">Meilenstein</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-yellow-100 hover:bg-yellow-200 text-yellow-700 text-xs sm:text-sm" @click="insertHistoryTemplate('achievement')">Erfolg</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-red-100 hover:bg-red-200 text-red-700 text-xs sm:text-sm" @click="deleteCurrentSection()">Abschnitt löschen</button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-gray-100 hover:bg-gray-200 text-gray-700 text-xs sm:text-sm"
+              @click="insertHistoryTemplate('generic')"
+            >
+              Neuer Abschnitt
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-blue-100 hover:bg-blue-200 text-blue-700 text-xs sm:text-sm"
+              @click="insertHistoryTemplate('founding')"
+            >
+              Gründung
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-green-100 hover:bg-green-200 text-green-700 text-xs sm:text-sm"
+              @click="insertHistoryTemplate('milestone')"
+            >
+              Meilenstein
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-yellow-100 hover:bg-yellow-200 text-yellow-700 text-xs sm:text-sm"
+              @click="insertHistoryTemplate('achievement')"
+            >
+              Erfolg
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded bg-red-100 hover:bg-red-200 text-red-700 text-xs sm:text-sm"
+              @click="deleteCurrentSection()"
+            >
+              Abschnitt löschen
+            </button>
           </div>
           
           <!-- Weitere Tools -->
           <div class="flex items-center gap-1">
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="createLink()">Link</button>
-            <button class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm" @click="removeFormat()">Clear</button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="createLink()"
+            >
+              Link
+            </button>
+            <button
+              class="px-2 py-1 sm:px-3 sm:py-1 rounded border hover:bg-gray-50 text-xs sm:text-sm"
+              @click="removeFormat()"
+            >
+              Clear
+            </button>
           </div>
         </div>
       </div>
@@ -52,14 +132,13 @@
     <!-- Content with top padding -->
     <div class="pt-36 sm:pt-44 pb-16">
       <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
-
-      <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4">
-        <div
-          ref="editor"
-          class="min-h-[320px] p-3 sm:p-4 outline-none prose max-w-none text-sm sm:text-base"
-          contenteditable
-        />
-      </div>
+        <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4">
+          <div
+            ref="editor"
+            class="min-h-[320px] p-3 sm:p-4 outline-none prose max-w-none text-sm sm:text-base"
+            contenteditable
+          />
+        </div>
       </div>
     </div>
   </div>