Update templates/index.html
Browse files- templates/index.html +27 -0
templates/index.html
CHANGED
|
@@ -41,9 +41,30 @@
|
|
| 41 |
.navbar-shadow {
|
| 42 |
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
| 43 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 44 |
</style>
|
| 45 |
</head>
|
| 46 |
<body class="min-h-screen">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 47 |
<!-- Barre de navigation -->
|
| 48 |
<header class="bg-indigo-700 text-white navbar-shadow fixed w-full top-0 z-50">
|
| 49 |
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
|
|
@@ -220,6 +241,12 @@
|
|
| 220 |
`;
|
| 221 |
container.appendChild(div);
|
| 222 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 223 |
</script>
|
| 224 |
</body>
|
| 225 |
</html>
|
|
|
|
| 41 |
.navbar-shadow {
|
| 42 |
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
| 43 |
}
|
| 44 |
+
/* Loader Styles */
|
| 45 |
+
#loader {
|
| 46 |
+
position: fixed;
|
| 47 |
+
top: 0;
|
| 48 |
+
left: 0;
|
| 49 |
+
width: 100%;
|
| 50 |
+
height: 100%;
|
| 51 |
+
background: rgba(0, 0, 0, 0.5);
|
| 52 |
+
z-index: 1000;
|
| 53 |
+
display: flex;
|
| 54 |
+
align-items: center;
|
| 55 |
+
justify-content: center;
|
| 56 |
+
}
|
| 57 |
</style>
|
| 58 |
</head>
|
| 59 |
<body class="min-h-screen">
|
| 60 |
+
<!-- Loader -->
|
| 61 |
+
<div id="loader" class="hidden">
|
| 62 |
+
<svg class="animate-spin h-12 w-12 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
|
| 63 |
+
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
|
| 64 |
+
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"></path>
|
| 65 |
+
</svg>
|
| 66 |
+
</div>
|
| 67 |
+
|
| 68 |
<!-- Barre de navigation -->
|
| 69 |
<header class="bg-indigo-700 text-white navbar-shadow fixed w-full top-0 z-50">
|
| 70 |
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
|
|
|
|
| 241 |
`;
|
| 242 |
container.appendChild(div);
|
| 243 |
}
|
| 244 |
+
|
| 245 |
+
// Affichage du loader lors de la soumission du formulaire
|
| 246 |
+
const form = document.querySelector('form');
|
| 247 |
+
form.addEventListener('submit', function() {
|
| 248 |
+
document.getElementById('loader').classList.remove('hidden');
|
| 249 |
+
});
|
| 250 |
</script>
|
| 251 |
</body>
|
| 252 |
</html>
|