From cab0d208c40347e0ec706da286127afdce0516cb Mon Sep 17 00:00:00 2001
From: FazCodeFR <30906528+FazCodeFR@users.noreply.github.com>
Date: Tue, 22 Oct 2024 16:13:51 +0200
Subject: [PATCH] Add modal

---
 src/app/app.component.html | 39 ++++++++++++++++++++++++++++++++++++++
 src/app/app.component.ts   |  1 +
 2 files changed, 40 insertions(+)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index e2a3e12..4088f7b 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,6 +1,45 @@
 <app-header></app-header>
 
 <main>
+
+  <!-- Modal -->
+  <div *ngIf="isModalOpen" class="relative z-10" aria-labelledby="modal-title" role="dialog" aria-modal="true">
+    <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
+  
+    <div class="fixed inset-0 z-10 w-screen overflow-y-auto">
+      <div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
+        <div class="relative transform overflow-hidden rounded-lg bg-white px-4 pb-4 pt-5 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-sm sm:p-6">
+          <div>
+            <div class="mt-3 text-center sm:mt-5">
+              <h3 class="text-base font-semibold leading-6 text-gray-900" id="modal-title">Projet Scolaire</h3>
+              <div class="mt-2">
+                <p class="text-sm text-gray-500">
+                  Ce projet a été développé dans le cadre de nos études en utilisant <strong>Nest.js</strong> et <strong>Angular</strong>.
+                </p>
+                <p class="text-sm text-gray-500">
+                    Il a été réalisé par <strong>Léo Airaudi</strong>, <strong>Marion</strong> et <strong>Sarah</strong>.
+                </p>
+                <p class="text-sm text-gray-500">
+                    Vous pouvez consulter le code source sur GitHub : 
+                    <a href="https://github.com/Potits-chats" class="text-indigo-600 hover:text-indigo-500">Voir le projet sur GitHub</a>.
+                </p>
+              </div>
+            </div>
+          </div>
+          <!-- Modal actions -->
+          <div class="mt-5 sm:mt-6">
+            <button type="button" (click)="isModalOpen = false" class="inline-flex w-full justify-center rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">
+              Fermer
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+<!-- Modal END -->
+  
+
+
     <router-outlet></router-outlet>
     <app-tchat-icon></app-tchat-icon>
 </main>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 5578843..41c63a3 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -5,4 +5,5 @@ import { Component } from '@angular/core';
   styleUrls: ['./app.component.scss'],
 })
 export class AppComponent {
+  isModalOpen = true;
 }