From 415e378ab49d3770c03af8c886032919012e51d5 Mon Sep 17 00:00:00 2001
From: Scheianu Ionut <scheianuionut@gmail.com>
Date: Thu, 2 Oct 2025 18:13:37 +0300
Subject: [PATCH] Fix modal display with inline styles

The CSS class 'show' was being overridden by global styles causing display:block instead of display:flex. Using inline style.display='flex' to force the modal to show properly with flexbox centering.

Changes:
- Added modal.style.display = 'flex' when showing modal
- Added modal.style.display = 'none' when hiding modal
- Added debug logging for inline style verification
- This ensures modal displays regardless of CSS conflicts
---
 py_app/app/templates/print_module.html | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/py_app/app/templates/print_module.html b/py_app/app/templates/print_module.html
index a2551af..80ceb37 100644
--- a/py_app/app/templates/print_module.html
+++ b/py_app/app/templates/print_module.html
@@ -1500,8 +1500,11 @@ async function handleQZTrayPrint(selectedRow) {
         // Show modal with show class for proper display
         console.log('👉 Adding show class to modal...');
         modal.classList.add('show');
+        // Force display with inline style to override any CSS conflicts
+        modal.style.display = 'flex';
         console.log('🔍 Modal classList after:', modal.classList.toString());
         console.log('🔍 Modal computed display:', window.getComputedStyle(modal).display);
+        console.log('🔍 Modal inline display:', modal.style.display);
         
         log.innerHTML = '';
         addLogEntry(`Starting print job: ${quantity} labels`, 'info');
@@ -1657,6 +1660,7 @@ async function handleQZTrayPrint(selectedRow) {
                 
                 // Close modal
                 modal.classList.remove('show');
+                modal.style.display = 'none';
                 
                 // Show success notification
                 showNotification(`✅ Successfully printed ${quantity} labels!`, 'success');
@@ -1667,16 +1671,19 @@ async function handleQZTrayPrint(selectedRow) {
                 // Job was cancelled
                 await new Promise(resolve => setTimeout(resolve, 2000));
                 modal.classList.remove('show');
+                modal.style.display = 'none';
                 showNotification(`⚠️ Print job cancelled. ${printController.lastPrintedLabel} of ${quantity} labels printed.`, 'warning');
             }
             
         } catch (printError) {
             modal.classList.remove('show');
+            modal.style.display = 'none';
             throw new Error(`Print failed: ${printError.message}`);
         }
         
     } catch (error) {
         modal.classList.remove('show');
+        modal.style.display = 'none';
         console.error('QZ Tray print error:', error);
         showNotification('❌ QZ Tray print error: ' + error.message, 'error');
     }