feat:ajouter avant apres corrigé

This commit is contained in:
2025-12-10 12:48:36 +01:00
parent 33b0c0cab8
commit 7fb728fc00

View File

@@ -12,16 +12,23 @@
.img-preview {
max-width: 150px;
border-radius: 8px;
display: none; /* cachée tant qu'il n'y a pas d'image */
display: none;
/* cachée tant qu'il n'y a pas d'image */
}
.container {
max-width: 600px;
margin-top: 50px;
}
</style>
</head>
<body class="bg-light py-4 py-md-5">
<div class="container" style="max-width: 800px;">
<body>
<h1 class="mb-4 mb-md-5 text-center">Ajouter une paire avant/après</h1>
<div class="container">
<h1 class="mb-5 text-center">Ajouter une paire avant/après</h1>
<!-- Message succès -->
<div id="successMsg" class="alert alert-success d-none">
@@ -42,13 +49,13 @@
<!-- Titre / label -->
<div class="mb-3">
<label class="form-label" for="pairTitle">Titre de la paire (obligatoire)</label>
<label class="form-label fw-bold" for="pairTitle">Titre de la paire (obligatoire)</label>
<input type="text" id="pairTitle" class="form-control" required>
</div>
<!-- Type -->
<div class="mb-3">
<label class="form-label" for="pairType">Type (obligatoire)</label>
<label class="form-label fw-bold" for="pairType">Type (obligatoire)</label>
<select id="pairType" class="form-select" required>
<option value="">-- Choisir --</option>
<option value="Chien">Chien</option>
@@ -58,7 +65,7 @@
<!-- Image AVANT -->
<div class="mb-4">
<label class="form-label" for="beforeImage">Image AVANT (obligatoire)</label>
<label class="form-label fw-bold" for="beforeImage">Image AVANT (obligatoire, formats acceptés : jpg, png, webp)</label>
<input type="file" id="beforeImage" class="form-control" accept="image/*" required>
<img id="beforePreview" class="img-preview border mt-2" src="#" alt="image avant">
@@ -66,7 +73,7 @@
<!-- Image APRÈS -->
<div class="mb-4">
<label class="form-label" for="afterImage">Image APRÈS (obligatoire)</label>
<label class="form-label fw-bold" for="afterImage">Image APRÈS (obligatoire, formats acceptés : jpg, png, webp)</label>
<input type="file" id="afterImage" class="form-control" accept="image/*" required>
<img id="afterPreview" class="img-preview border mt-2" src="#" alt="image après">
@@ -89,10 +96,9 @@
</form>
</div>
<script src="ajouter_avant_apres.js"></script>
<script src="../js/ajouter_avant_apres.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>