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