From ddd8a7c27e2bd221d9bf901b9836647313e1c6a0 Mon Sep 17 00:00:00 2001
From: Theo DUPIN <Theo.DUPIN@etu.uca.fr>
Date: Tue, 8 Nov 2022 14:41:34 +0100
Subject: [PATCH] modif page calendrier

---
 src/pages/Calendrier.js                |  4 ++--
 src/styles/components/_calendrier.scss | 21 +++++++++++++++++++++
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/pages/Calendrier.js b/src/pages/Calendrier.js
index 502a857..f869924 100644
--- a/src/pages/Calendrier.js
+++ b/src/pages/Calendrier.js
@@ -78,14 +78,14 @@ const Calendrier = () => {
                     <div className="Calendrier">
                     <h2>Ajouter un évènement</h2>
                     <div className="mini_formulaire_evenement">
-                        <input type="text" placeholder="Ajoutez un titre" style={{height: "50%", width: "100%", marginRight: "10px"}} 
+                        <input className="ajout_titre" type="text" placeholder="Ajoutez un titre" style={{height: "20px", width: "100%", marginRight: "10px"}} 
                             value={newEvent.Titre} onChange={(e) => setNewEvent({...newEvent, Titre: e.target.value})}
                         />
                         <DatePicker placeholderText="Date de début" style={{marginRight: "10px"}}
                         selected={newEvent.Début} onChange={(Début) => setNewEvent({...newEvent, Début})} />
                         <DatePicker placeholderText="Date de fin"
                         selected={newEvent.Fin} onChange={(Fin) => setNewEvent({...newEvent, Fin})} />
-                        <button onClick={handleAddEvent}>Ajouter l'évènement</button>
+                        <button className="bouton_ajout" onClick={handleAddEvent}>Ajouter l'évènement</button>
                     </div>
                     <Calendar localizer={localizer} events={allEvents} 
                     startAccessor="start" endAccessor="end" style={{height: "100%", width:"99%"}}/>
diff --git a/src/styles/components/_calendrier.scss b/src/styles/components/_calendrier.scss
index a484b8e..0cfd79e 100644
--- a/src/styles/components/_calendrier.scss
+++ b/src/styles/components/_calendrier.scss
@@ -139,6 +139,27 @@ body {
                 display: flex;
                 flex-direction: row;
                 margin-top: 10px;
+                height: 100px;
+
+                .bouton_ajout {
+                    width: 300px;
+                    height: 50px;
+                    border-radius: 10px;
+                    border: 0.5px solid;
+                    border: 0;
+                    background-color: rgba(163, 163, 163, 0.371);
+                    border: 1px solid rgba(255,255,255,0.1);
+                    backdrop-filter: blur(30px);
+                    color: rgb(255, 255, 255);
+                    cursor: pointer;
+                    font-size: 15px;
+                    &:hover{
+                        background-color: rgba(114, 114, 114, 0.371);   
+                    }
+                    &:active{
+                        background-color:rgba(68, 68, 68, 0.972);   
+                    }
+                }
             }
 
             .rbc-calendar {