From fe1a9d55a32d70f8942a0b228d5747aa86e7ac1c Mon Sep 17 00:00:00 2001
From: ben <ben.voydie64@gmail.com>
Date: Fri, 5 Dec 2025 15:27:44 +0100
Subject: [PATCH] modification page modifier article + page modifier categorie

---
 blog/categories/articles/ajouter_article.html | 18 ++++---
 .../categories/articles/modifier_article.html | 50 +++++++++++++------
 2 files changed, 45 insertions(+), 23 deletions(-)

diff --git a/blog/categories/articles/ajouter_article.html b/blog/categories/articles/ajouter_article.html
index 2ebe537..b45a2da 100644
--- a/blog/categories/articles/ajouter_article.html
+++ b/blog/categories/articles/ajouter_article.html
@@ -39,15 +39,17 @@
     <div id="successMsg" class="alert alert-success d-none">Article ajouté avec succès !</div>
 
          <!--Catégorie-->
-        <div class="mb-4">
+        <div class="mb-3">
             <label class="form-label fw-bold">Catégorie de l'article</label>
-            <select id="articleCategory" class="form-select">
-                <option value="" selected disabled>Choisissez une catégorie</option>
-                <option value="actualités">Actualités</option>
-                <option value="chien">Chien</option>
-                <option value="chat">Chat</option>
-                <option value="boutique">Boutique</option>
-            </select>
+            <input list="categories" id="articleCategory" class="form-control" placeholder="Entrez une catégorie">
+
+            <datalist id="categories">
+            <option value="actualités">
+            <option value="chien">
+            <option value="chat">
+            <option value="boutique">
+            </datalist>
+
 
         <!--Titre-->
         <div class="mb-4">
diff --git a/blog/categories/articles/modifier_article.html b/blog/categories/articles/modifier_article.html
index f6ef016..6cf174c 100644
--- a/blog/categories/articles/modifier_article.html
+++ b/blog/categories/articles/modifier_article.html
@@ -5,6 +5,8 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Modifier un article</title>
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
+    <script src="https://cdn.ckeditor.com/ckeditor5/39.0.1/classic/ckeditor.js"></script>
+
 
     <style>
         body {
@@ -49,16 +51,11 @@
   <!-- Formulaire -->
   <form id="editArticleForm">
 
-    <!-- Image actuelle -->
-    <label class="fw-bold">Image actuelle</label>
-    <div class="mb-3">
-      <img src="images/article1.jpg" alt="Image actuelle" class="preview-img mb-2">
-      <input type="file" id="articleImage" class="form-control" accept="image/*">
-    </div>
+   
 
     <!--Titre-->
     <div class="mb-3">
-      <label class="form-label fw-bold">Titre de l'article *</label>
+      <label class="form-label fw-bold">Titre de l'article (obligatoire)</label>
       <input type="text" id="articleTitle" class="form-control" value="Titre de l'article actuel" placeholder="Modifier le titre">
     </div>
 
@@ -69,14 +66,29 @@
     </div>
 
     <!--Catégorie-->
-    <div class="mb-3">
+    <div class="mb-4">
       <label class="form-label fw-bold">Catégorie de l'article</label>
-      <select id="articleCategory" class="form-select">
-        <option value="actualités">Actualités</option>
-        <option value="chien">Chien</option>
-        <option value="chat">Chat</option>
-        <option value="boutique">Boutique</option>
-      </select>
+      <input
+      type="text"
+      id="articleCategory"
+      class="form-control"
+      list="categories"
+      placeholder="Entrez une catégorie">
+
+      <datalist id="categories">
+      <option value="actualités">
+      <option value="chien">
+      <option value="chat">
+      <option value="boutique">
+      </datalist>
+
+    </div>
+
+    <!-- Image actuelle -->
+    <label class="fw-bold">Image actuelle</label>
+    <div class="mb-4">
+      <img src="/blog/categories/images/article1.jpg" alt="Image actuelle" class="preview-img mb-2">
+      <input type="file" id="articleImage" class="form-control" accept="image/*">
     </div>
 
     <!--Publié-->
@@ -87,7 +99,7 @@
 
     <!--Boutons-->
     <div class="d-flex gap-3 mt-4">
-      <a href="liste_articles.html" class="btn btn-danger w-50">Annuler</a>
+      <a href="liste_articles.html" class="btn btn-secondary w-50">Annuler</a>
       <button type="submit" class="btn btn-primary w-50">Enregistrer</button>
     </div>
 
@@ -95,6 +107,14 @@
 
 </div>
 
+<script>
+  ClassicEditor
+    .create(document.querySelector('#articleContent'))
+    .catch(error => {
+      console.error(error);
+    });
+</script>
+
 <script src="modifier_article.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>