| | <!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> |
