Ajout de la fonctionnalité de vue de tous les évènements. Ajout de la réservation d'un évènement. Fix incomplet de la modification d'un utilisateur. CSS.

Co-authored-by: Charpentier Juliette <juliette.charpentier1@etu.u-pec.fr

styles/main.css

@@ -465,3 +465,87 @@ button.new-event:hover {
   font-family: "RobotoFlex";
   color: #8e8c8c;
 }
+
+.events-flex-container {
+  background: #26272b; /* Dark background for contrast */
+  padding: 3rem;
+  border-radius: 10px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
+  width: 75%;
+  margin: 2rem auto; /* Center the element horizontally */
+  color: #ffffff; /* Ensure text is readable on dark background */
+  overflow: hidden; /* Ensures no spillover from the inner table */
+}
+
+.event-table {
+  width: 100%; /* Full width of its container */
+  border-collapse: collapse; /* Collapse borders */
+  table-layout: fixed; /* Fixed layout for consistent column sizing */
+
+  font-size: 0.9em;
+  min-width: 400px;
+}
+
+.event-table thead th {
+  background-color: #34353a; /* Dark background for contrast */
+  color: #ffffff;
+  text-align: left;
+  font-weight: bold;
+  position: sticky;
+  z-index: 2;
+  top: 0;
+}
+
+.event-table th,
+.event-table td {
+  padding: 12px 15px;
+}
+
+.event-table tbody tr {
+  border-bottom: 1px solid #dddddd;
+}
+
+.event-table tbody tr:nth-of-type(even) {
+  background-color: #242427; /* Dark background for contrast */
+}
+
+.event-table tbody tr:last-of-type {
+  border-bottom: 2px solid #26272b; /* Dark background for contrast */
+}
+
+.scrollable {
+  height: 600px;
+  overflow-y: scroll;
+  border-bottom: 1px solid #ddd;
+}
+
+.order-by {
+  margin-bottom: 1rem;
+  text-align: center;
+  width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+}
+.order-by label {
+  display: block;
+  margin-bottom: 0.5rem;
+  color: #b1aeae;
+  padding-right: 11%;
+}
+
+.order-by select {
+  width: 15%;
+  padding: 0.5rem;
+  border: 1px solid #121216;
+  border-radius: 5px;
+  background-color: #34353a;
+  color: #fffe;
+  transition: all 0.3s ease;
+  appearance: none; /* Pour supprimer le style par défaut */
+  -webkit-appearance: none; /* Pour Safari */
+  -moz-appearance: none; /* Pour Firefox */
+  background-image: url("https://cdn-icons-png.flaticon.com/16/8442/8442683.png"); /* Ajoutez votre icône personnalisée */
+  background-repeat: no-repeat;
+  background-position: right 0.5rem center; /* Ajustez selon la taille de votre padding */
+  background-size: 1.5rem; /* Ajustez selon la taille souhaitée pour l'icône */
+}