new ui header and video add to modal

views/legal.ejs

@@ -113,6 +113,27 @@
             text-decoration: none;
             font-size: 1.2rem;
         }
+
+        .firstpage {
+            position: relative; /* Nécessaire pour le positionnement du pseudo-élément */
+            height: 100vh;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+        }
+
+        .firstpage::before {
+            content: ""; /* Nécessaire pour que le pseudo-élément soit généré */
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background-image: url('/public/src/photo-1714548213565-9d241b6809d6.png');
+            background-size: cover; /* Assure que l'image de fond couvre tout l'espace disponible */
+            filter: brightness(50%); /* Applique le filtre uniquement à l'image de fond */
+            z-index: -1; /* S'assure que le pseudo-élément reste en arrière-plan */
+        }
     </style>
 </head>
 
@@ -145,7 +166,7 @@
     </div>
 </div>
 
-<section id="home" class="py-24 px-4">
+<section id="home" class="firstpage py-24 px-4">
     <div class="container mx-auto text-center">
         <h1 class="text-5xl font-bold mb-6 gradient-text">Raphael, votre bot Discord polyvalent</h1>
         <p class="text-xl mb-10 max-w-2xl mx-auto">Nos différents documents légaux</p>
@@ -156,6 +177,7 @@
             Conditions générales d'utilisation
         </a>
     </div>
+    <iframe src="https://discord.com/widget?id=1197149888857784380&theme=dark" width="350" height="500" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>
 </section>
 <script>