| <!DOCTYPE html> |
| <html lang="fr"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> |
| <title>AuditPro Sync | Expert Cloud Inspection</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet"> |
| <style> |
| body { |
| font-family: 'Inter', sans-serif; |
| background-color: #f8fafc; |
| margin: 0; |
| overflow-x: hidden; |
| -webkit-font-smoothing: antialiased; |
| } |
| #loading-screen { |
| position: fixed; |
| inset: 0; |
| display: flex; |
| flex-direction: column; |
| align-items: center; |
| justify-content: center; |
| background: #ffffff; |
| z-index: 9999; |
| transition: opacity 0.5s ease-out; |
| } |
| .spinner { |
| width: 48px; |
| height: 48px; |
| border: 5px solid #f1f5f9; |
| border-top: 5px solid #4f46e5; |
| border-radius: 50%; |
| animation: spin 1s cubic-bezier(0.4, 0, 0.2, 1) infinite; |
| } |
| @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } |
| </style> |
| <script type="importmap"> |
| { |
| "imports": { |
| "lucide-react": "https://esm.sh/lucide-react@^0.475.0", |
| "react-dom/client": "https://esm.sh/react-dom@19.0.0/client", |
| "react": "https://esm.sh/react@19.0.0", |
| "xlsx": "https://esm.sh/xlsx@0.18.5", |
| "react-dom/": "https://esm.sh/react-dom@^19.2.3/", |
| "react/": "https://esm.sh/react@^19.2.3/" |
| } |
| } |
| </script> |
| </head> |
| <body class="bg-slate-50 text-slate-900"> |
| <div id="loading-screen"> |
| <div class="spinner"></div> |
| <div style="margin-top: 2rem; text-align: center;"> |
| <p style="color: #1e293b; font-weight: 900; font-size: 18px; margin-bottom: 4px;">AuditPro Sync</p> |
| <p style="color: #64748b; font-weight: 700; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;">Sécurisation des données locales...</p> |
| </div> |
| </div> |
|
|
| <div id="root"></div> |
| <script type="module" src="./bundle.js"></script> |
| |
| <script type="module"> |
| window.addEventListener('load', () => { |
| const loader = document.getElementById('loading-screen'); |
| if (loader) { |
| setTimeout(() => { |
| loader.style.opacity = '0'; |
| setTimeout(() => loader.remove(), 500); |
| }, 1000); |
| } |
| }); |
| </script> |
| </body> |
| </html> |
