added profil section

src/app/components/profil/profil.css

@@ -0,0 +1,13 @@
+.festive {
+    font-family: "Comic Sans MS", cursive;
+    text-shadow: 2px 2px #8C731A, -2px -2px #8C731A;
+    color: #fff;
+    font-weight: bold;
+}
+
+.festive2 {
+    font-family: "Comic Sans MS", cursive;
+    color: #001529;
+    font-weight: bold;
+}
+

src/app/components/profil/profil.html

@@ -0,0 +1,10 @@
+<div class="mx-auto flex items-center justify-center w-30 h-30 rounded-full bg-blue-900 text-white text-6xl festive">
+    {{ getInitial(data.name) }}
+</div>
+
+<div class="mt-6">
+    <p class="text-2xl festive2 mx-auto flex items-center justify-center">{{data.name}}</p>
+    <p class="text-l festive2 mt-0 flex items-center justify-center">{{data.email}}</p>
+    <p class="text-l festive2 mt-0 flex items-center justify-center">{{data.fonction}}</p>
+    <button nz-button nzType="primary" class="ml-82">Modifier mon profil</button>
+</div>

src/app/components/profil/profil.ts

@@ -0,0 +1,25 @@
+import { Component } from '@angular/core';
+import {UserInfo} from "../../interfaces/user.interface";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+
+@Component({
+  selector: 'app-profil',
+    imports: [
+        NzButtonComponent
+    ],
+  templateUrl: './profil.html',
+  styleUrl: './profil.css',
+})
+export class Profil {
+    data: UserInfo =
+    {
+        name: 'Mathys Sanchez Vendé',
+        email: 'mathys.sanchez@vende.fr',
+        fonction: 'admin',
+    };
+
+    getInitial(name: string): string {
+        if (!name || name.trim() === '') return '?';
+        return name[0].toUpperCase();
+    }
+}