From b7982ff0f03b839c29e0a3e55a4604e855f2b83e Mon Sep 17 00:00:00 2001
From: "bastien.ollier@etu.uca.fr" <bastien.ollier@etu.uca.fr>
Date: Fri, 9 Dec 2022 11:42:02 +0100
Subject: [PATCH] add componentes NewPoste

---
 Site Web/client/src/components/AjoutLien.js   | 10 ++++-
 Site Web/client/src/components/NewPoste.js    | 41 ++++++++++++++++++
 Site Web/client/src/pages/HomeNavigation.js   |  6 ++-
 .../src/styles/component/_newPoste.scss       | 43 +++++++++++++++++++
 Site Web/client/src/styles/index.scss         |  2 +
 5 files changed, 99 insertions(+), 3 deletions(-)
 create mode 100644 Site Web/client/src/components/NewPoste.js
 create mode 100644 Site Web/client/src/styles/component/_newPoste.scss

diff --git a/Site Web/client/src/components/AjoutLien.js b/Site Web/client/src/components/AjoutLien.js
index d46a5269..a9126f26 100644
--- a/Site Web/client/src/components/AjoutLien.js	
+++ b/Site Web/client/src/components/AjoutLien.js	
@@ -1,9 +1,15 @@
-import React from 'react';
+import React, {useState} from 'react';
+import NewPoste from "./NewPoste";
 
 const AjoutLien = () => {
+
+    const handleModals = (e) => {
+        <NewPoste/>
+    }
+
     return (
         <div className='ajoutLien'>
-            <button className="bouttonAjoutLien" type='bouton'>
+            <button className="bouttonAjoutLien" id="display" type='bouton' onClick={handleModals}>
                 Poster un lien
             </button>
         </div>
diff --git a/Site Web/client/src/components/NewPoste.js b/Site Web/client/src/components/NewPoste.js
new file mode 100644
index 00000000..2cb47101
--- /dev/null
+++ b/Site Web/client/src/components/NewPoste.js	
@@ -0,0 +1,41 @@
+import axios from 'axios';
+import React, { useState } from 'react';
+
+
+//e.preventDefaul(); pour ne pas recharcher la page
+const NewPoste = (props) => {
+    return (
+        <div>
+            <div class="newPoste-form-popup" id="newPoste-popupFormulaireCreationPoste">
+                <form action="/action_page.php" class="newPoste-form-container">
+                    <div class="newPoste-input">
+                        <label for="lien">Lien:</label>
+                        <input type="text" name="lien" required />
+                    </div>
+                    <div class="newPoste-input">
+                        <label for="description">Description:</label>
+                        <textarea name="description" row="250"></textarea>
+                    </div>
+
+                    <div id="newPoste-buttonForm">
+                        <div>
+                            <button type="button" class="newPoste-btn-cancel" onclick="closeForm()">retour</button>
+                        </div>
+                        <div>
+                            <button type="submit" class="newPoste-btn">Poster</button>
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </div>
+
+
+
+
+
+
+    );
+};
+
+//ce qui écrit dans le input est récuperé par le state
+export default NewPoste;
\ No newline at end of file
diff --git a/Site Web/client/src/pages/HomeNavigation.js b/Site Web/client/src/pages/HomeNavigation.js
index dd0519fd..ae672053 100644
--- a/Site Web/client/src/pages/HomeNavigation.js	
+++ b/Site Web/client/src/pages/HomeNavigation.js	
@@ -2,8 +2,10 @@ import React, { useContext } from 'react';
 import { UidContext } from '../components/AppContext';
 import Log from '../components/Log'
 import Home from './Home';
-import Poste from '../components/Poste';
+
 import { NavLink } from 'react-router-dom';
+import NewPoste from "../components/NewPoste";
+import AjoutLien from "../components/AjoutLien";
 //<Link to="/discover"/>
 
 const HomeNavigation = () => {
@@ -18,6 +20,8 @@ const HomeNavigation = () => {
                     <Log  signin={true} signup={false}/>
                 </div>
             )}
+            <AjoutLien></AjoutLien>
+            <NewPoste></NewPoste>
         </div>
     );
 };
diff --git a/Site Web/client/src/styles/component/_newPoste.scss b/Site Web/client/src/styles/component/_newPoste.scss
new file mode 100644
index 00000000..1a47057e
--- /dev/null
+++ b/Site Web/client/src/styles/component/_newPoste.scss	
@@ -0,0 +1,43 @@
+.newPoste-form-popup {
+  background-color: white;
+  display: none;
+  position:fixed;
+
+  margin-left:33%;
+  margin-right: 33%;
+  border: 2px solid #666;
+  border-radius:10px;
+  width: 33%;
+}
+
+/* Largeur complète pour les champs de saisie */
+.newPoste-form-container input[name="lien"],
+.newPoste-form-container textarea[name="description"],
+.newPoste-form-container label{
+  width: 80%;
+  margin: 10px 10% 50px 10%;
+}
+
+textarea{
+  resize: none;
+  height: 100px;
+}
+
+input[name="lien"],
+textarea[name="description"]{
+  margin-left: 100px;
+  border: none;
+  background: #D9D9D9;
+}
+
+.newPoste-input{
+  margin-top:20px;
+}
+
+#newPoste-buttonForm{
+  margin-left:10%;
+  margin-right:10%;
+  margin-bottom:10px;
+  display:flex;
+  justify-content: space-between;
+}
\ No newline at end of file
diff --git a/Site Web/client/src/styles/index.scss b/Site Web/client/src/styles/index.scss
index 8a8218e3..d99c6fa9 100644
--- a/Site Web/client/src/styles/index.scss	
+++ b/Site Web/client/src/styles/index.scss	
@@ -5,3 +5,5 @@
 @import './component/poste';
 @import './pages/configuration';
 @import './component/ajoutLien';
+@import './component/newPoste';
+