📚 Improved database structure & templates for job scheduling 🚀

backend/app/templates/jobs.html

@@ -363,6 +363,93 @@
         outline: 2px solid #0073ce;
         outline-offset: 2px;
     }
+    
+    /* ===== DEZENTE SCROLLBALKEN ===== */
+    
+    /* Webkit-Browser (Chrome, Safari, Edge) */
+    ::-webkit-scrollbar {
+        width: 4px;
+        height: 4px;
+    }
+    
+    ::-webkit-scrollbar-track {
+        background: transparent;
+        border-radius: 4px;
+    }
+    
+    ::-webkit-scrollbar-thumb {
+        background: rgba(0, 0, 0, 0.1);
+        border-radius: 4px;
+        transition: all 0.3s ease;
+    }
+    
+    ::-webkit-scrollbar-thumb:hover {
+        background: rgba(0, 0, 0, 0.2);
+    }
+    
+    /* Dark Mode Scrollbalken */
+    .dark ::-webkit-scrollbar-thumb {
+        background: rgba(255, 255, 255, 0.1);
+    }
+    
+    .dark ::-webkit-scrollbar-thumb:hover {
+        background: rgba(255, 255, 255, 0.2);
+    }
+    
+    /* Firefox-Scrollbalken */
+    * {
+        scrollbar-width: thin;
+        scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
+    }
+    
+    .dark * {
+        scrollbar-color: rgba(255, 255, 255, 0.1) transparent;
+    }
+    
+    /* Hover-Effekt für bessere Sichtbarkeit */
+    body:hover ::-webkit-scrollbar-thumb,
+    .dashboard-card:hover ::-webkit-scrollbar-thumb,
+    .mercedes-modal:hover ::-webkit-scrollbar-thumb {
+        background: rgba(0, 0, 0, 0.15);
+    }
+    
+    .dark body:hover ::-webkit-scrollbar-thumb,
+    .dark .dashboard-card:hover ::-webkit-scrollbar-thumb,
+    .dark .mercedes-modal:hover ::-webkit-scrollbar-thumb {
+        background: rgba(255, 255, 255, 0.15);
+    }
+    
+    /* Auto-Hide Scrollbars (nur bei Bedarf sichtbar) */
+    .jobs-container,
+    .filter-section,
+    .dashboard-card {
+        overflow: auto;
+        scrollbar-width: thin;
+    }
+    
+    /* Smooth Scrolling für bessere UX */
+    html {
+        scroll-behavior: smooth;
+    }
+    
+    /* Spezielle Modal-Scrollbalken */
+    .mercedes-modal {
+        max-height: 90vh;
+        overflow-y: auto;
+    }
+    
+    .mercedes-modal::-webkit-scrollbar {
+        width: 6px;
+    }
+    
+    .mercedes-modal::-webkit-scrollbar-thumb {
+        background: rgba(0, 115, 206, 0.2);
+        border-radius: 3px;
+    }
+    
+    .mercedes-modal::-webkit-scrollbar-thumb:hover {
+        background: rgba(0, 115, 206, 0.3);
+    }
 </style>
 {% endblock %}
 
@@ -582,7 +669,7 @@
                     <p class="text-sm text-mercedes-gray dark:text-slate-400">Reservieren Sie einen Drucker für eine bestimmte Zeit</p>
                 </div>
             </button>
-            <a href="{{ url_for('new_job_page') }}" 
+            <button onclick="toggleFormExpansion()" 
                class="p-6 border-2 border-dashed border-mercedes-silver hover:border-mercedes-blue rounded-xl transition-colors group">
                 <div class="text-center">
                     <svg class="w-8 h-8 mx-auto mb-3 text-mercedes-silver group-hover:text-mercedes-blue transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -591,7 +678,7 @@
                     <h3 class="font-semibold text-mercedes-black dark:text-white mb-1">Vollständiger Auftrag</h3>
                     <p class="text-sm text-mercedes-gray dark:text-slate-400">Erstellen Sie einen kompletten Druckauftrag mit Datei</p>
                 </div>
-            </a>
+            </button>
         </div>
         
         <!-- Expanded Form (Hidden by default) -->
@@ -754,13 +841,13 @@
                     </div>
                     <h3 class="text-xl font-semibold text-mercedes-black dark:text-white mb-2">Keine Aufträge gefunden</h3>
                     <p class="text-mercedes-gray dark:text-slate-400 mb-6">Sie haben derzeit keine Druckaufträge, die den Filterkriterien entsprechen.</p>
-                    <a href="{{ url_for('new_job_page') }}" 
+                    <button onclick="toggleFormExpansion()" 
                        class="btn-primary flex items-center gap-2">
                         <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
                         </svg>
                         Ersten Auftrag erstellen
-                    </a>
+                    </button>
                 </div>
             </div>
         </div>
@@ -1724,7 +1811,7 @@ class JobManager {
             
             if (data.success) {
                 this.showSuccess('Schnell-Reservierung erfolgreich erstellt!');
-                closeQuickReservationModal();
+                closeQuickModal();
                 this.loadJobs(); // Refresh job list
                 
                 // Reset form