possibilité d'éditer le texte dans header et footer, class JS InputText, Model::findWhateverNode

7 files changed, 103 insertions, 13 deletions

diff --git a/public/assets/close-nb.svg b/public/assets/close-nb.svg
new file mode 100644
index 0000000..c5a6b6b
--- /dev/null
+++ b/public/assets/close-nb.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z"></path></svg>
\ No newline at end of file
diff --git a/public/assets/close.svg b/public/assets/close.svg
new file mode 100644
index 0000000..4dfee8c
--- /dev/null
+++ b/public/assets/close.svg
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   viewBox="0 0 24 24"
+   fill="currentColor"
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="close.svg"
+   inkscape:version="1.4.2 (ebf0e940d0, 2025-05-08)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1" />
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="16.333333"
+     inkscape:cx="13.071429"
+     inkscape:cy="14.785714"
+     inkscape:window-width="1916"
+     inkscape:window-height="1032"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
+  <path
+     style="fill:#dd3333;stroke:#dd3333;stroke-width:0.2314"
+     d="m 6.3513525,17.616704 -0.6567632,-0.658806 2.4486238,-2.44805 c 1.346743,-1.346427 2.4486239,-2.475604 2.4486239,-2.509281 0,-0.03368 -1.1022132,-1.163696 -2.4493624,-2.5111538 L 5.6931123,7.0394909 6.3673453,6.3673486 7.0415783,5.6952062 9.5207892,8.1738503 12,10.652494 l 2.479211,-2.4786437 2.47921,-2.4786441 0.674234,0.6721424 0.674233,0.6721423 -2.449362,2.4499223 C 14.510376,10.836871 13.408163,11.966635 13.408163,12 c 0,0.03337 1.102213,1.163129 2.449363,2.510587 l 2.449362,2.449922 -0.674233,0.672142 -0.674234,0.672143 L 14.479211,15.82615 12,13.347506 9.5354343,15.811508 c -1.3555112,1.355201 -2.4786851,2.464002 -2.4959421,2.464002 -0.017257,0 -0.3269198,-0.296462 -0.6881397,-0.658806 z"
+     id="path2" />
+</svg>
diff --git a/public/css/body.css b/public/css/body.css
index 95f30d4..8ad3a52 100644
--- a/public/css/body.css
+++ b/public/css/body.css
@@ -188,7 +188,7 @@ button .action_icon:hover
 {
     margin-right: 2px;
 }
-section button, section input[type=submit]
+button, section input[type=submit]
 {
     color: #ff1d04;
     font-size: medium;
@@ -196,7 +196,7 @@ section button, section input[type=submit]
     background-color: white;
     border: lightgrey 2px outset; /* rend identiques les boutons firefox et chromium */
 }
-section button:hover, section input[type=submit]:hover
+button:hover, section input[type=submit]:hover
 {
     background-color: yellow;
     border-radius: 4px;
diff --git a/public/css/calendar.css b/public/css/calendar.css
index 2ff5640..d011f03 100644
--- a/public/css/calendar.css
+++ b/public/css/calendar.css
@@ -10,7 +10,6 @@
 #calendar_zone{
     display: flex;
     gap: 5px;
-    /*padding: 15px;*/
     max-width: 1170px;
 }
 #calendar{
diff --git a/public/css/foot.css b/public/css/foot.css
index ad86305..8d0a94d 100644
--- a/public/css/foot.css
+++ b/public/css/foot.css
@@ -11,11 +11,15 @@ footer
 }
 footer > div
 {
-        margin: auto;
         max-width: 1200px;
         display: flex;
         justify-content: space-around;
 }
+
+.contact
+{
+        margin: 16px 0; /* alignement avec la <p> autour du logo */
+}
 .contact a
 {
         color: unset;
@@ -69,11 +73,6 @@ footer > div
         margin: 0 3px;
 }*/
 
-.contact
-{
-        padding: 0 15px;
-}
-
 .footer_logo img
 {
         max-width: 288px;
@@ -115,8 +114,7 @@ footer > div
 }
 .logged_out
 {
-        /*display: none;*/
-        justify-content: start;
+        justify-content: start; /* écrase le space-around dans footer > div */
 }
 .logged_out a
 {
diff --git a/public/css/head.css b/public/css/head.css
index be938bb..b173077 100644
--- a/public/css/head.css
+++ b/public/css/head.css
@@ -24,6 +24,8 @@ header
         grid-template-columns: 1fr 1fr 1fr;
         align-items: end;
 }
+/*.header_left_col
+{}*/
 @media screen and (max-width: 1000px){
         .header-content{
                 padding: 18px 0;
@@ -36,7 +38,7 @@ header
                 display: block;
                 padding: 18px;
         }
-        .head_logo
+        #header_logo
         {
                 display: none;
         }
@@ -74,12 +76,18 @@ header a
         color: unset; /* ne plus hériter */
         text-decoration: none;
 }
+#edit_favicon_zone
+{
+        margin-bottom: 10px;
+}
+/*.header_right_col
+{}*/
 .social
 {
         /*align-self: end;*/
         /*padding: 4px;*/
 }
-.social img
+.social a img
 {
         width: 25px;
         background-color: #ffffffb3;
diff --git a/public/js/InputText.js b/public/js/InputText.js
new file mode 100644
index 0000000..ba7e8e4
--- /dev/null
+++ b/public/js/InputText.js
@@ -0,0 +1,47 @@
+// s'en servir dans menu et chemin
+class InputText{
+        constructor(name){
+                this.name = name;
+                this.parent = document.getElementById(name);
+        }
+        openTextInput(){
+                this.parent.querySelector('#' + this.name + '_span').classList.add('hidden');
+                this.parent.querySelector('#' + this.name + '_input').classList.remove('hidden');
+                this.parent.querySelector('#' + this.name + '_open').classList.add('hidden');
+                this.parent.querySelector('#' + this.name + '_submit').classList.remove('hidden');
+                this.parent.querySelector('#' + this.name + '_cancel').classList.remove('hidden');
+        }
+        closeTextInput(){
+                this.parent.querySelector('#' + this.name + '_span').classList.remove('hidden');
+                this.parent.querySelector('#' + this.name + '_input').classList.add('hidden');
+                this.parent.querySelector('#' + this.name + '_open').classList.remove('hidden');
+                this.parent.querySelector('#' + this.name + '_submit').classList.add('hidden');
+                this.parent.querySelector('#' + this.name + '_cancel').classList.add('hidden');
+        }
+        submitTextInput(){
+                const new_text = this.parent.querySelector('#' + this.name + '_input').value;
+
+                fetch('index.php?entire_site_edit=' + this.name, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({new_text: new_text})
+            })
+            .then(response => response.json())
+            .then(data => {
+                if(data.success){
+                        this.parent.querySelector('#' + this.name + '_span').innerHTML = new_text;
+                                this.closeTextInput(this.name);
+                }
+                else{
+                    console.error("Erreur: le serveur n'a pas enregistré le nouveau texte.");
+                }
+            })
+            .catch(error => {
+                console.error('Erreur:', error);
+            });
+        }
+        cancelTextInput(){
+                this.parent.querySelector('#' + this.name + '_input').value = this.parent.querySelector('#' + this.name + '_span').innerHTML;
+                this.closeTextInput(this.name);
+        }
+}
\ No newline at end of file