feat(dashboard): page d'accueil avec bouton planning et layout fixe sans scroll

- Composant dashboard migré vers fichiers HTML/CSS externes avec carte de navigation vers /dashboard/planning
- html, body, app-root et main fixés à 100vw/100vh sans overflow pour remplir la fenêtre navigateur

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/app.css

@@ -1,12 +1,12 @@
 :host {
-  --content-padding: 10px;
-}
-header {
   display: block;
-  height: 60px;
+  width: 100vw;
-  padding: var(--content-padding);
+  height: 100vh;
-  box-shadow: 0px 5px 25px var(--shadow-color);
+  overflow: hidden;
 }
-.content {
+
-  padding: var(--content-padding);
+main {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
 }

src/app/components/pages/dashboard/dashboard.css

@@ -0,0 +1,83 @@
+.background {
+    width: 100%;
+    height: 100vh;
+    background: #f5f4f0;
+    overflow: hidden;
+}
+
+.dashboard {
+    padding: 40px;
+    max-width: 900px;
+}
+
+.dashboard-title {
+    font-size: 1.6rem;
+    font-weight: 600;
+    color: #2c2c2c;
+    margin-bottom: 32px;
+}
+
+.dashboard-cards {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 16px;
+}
+
+.dashboard-card {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+    padding: 20px 24px;
+    background: #fff;
+    border: 1px solid #ede8e0;
+    border-radius: 10px;
+    text-decoration: none;
+    color: inherit;
+    min-width: 280px;
+    transition: box-shadow 0.15s ease, border-color 0.15s ease;
+    cursor: pointer;
+}
+
+.dashboard-card:hover {
+    border-color: #d4a574;
+    box-shadow: 0 4px 16px rgba(212, 165, 116, 0.15);
+}
+
+.card-icon {
+    width: 48px;
+    height: 48px;
+    background: #fdf6ed;
+    border-radius: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #d4a574;
+    flex-shrink: 0;
+}
+
+.card-content {
+    flex: 1;
+}
+
+.card-content h2 {
+    font-size: 1rem;
+    font-weight: 600;
+    color: #2c2c2c;
+    margin: 0 0 4px;
+}
+
+.card-content p {
+    font-size: 0.82rem;
+    color: #888;
+    margin: 0;
+}
+
+.card-arrow {
+    color: #ccc;
+    flex-shrink: 0;
+    transition: color 0.15s ease;
+}
+
+.dashboard-card:hover .card-arrow {
+    color: #d4a574;
+}

src/app/components/pages/dashboard/dashboard.html

@@ -0,0 +1,25 @@
+<div class="background">
+    <div class="dashboard">
+        <h1 class="dashboard-title">Tableau de bord</h1>
+        <div class="dashboard-cards">
+            <a routerLink="planning" class="dashboard-card">
+                <div class="card-icon">
+                    <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+                        <rect x="3" y="4" width="18" height="18" rx="2" ry="2" stroke-width="2"/>
+                        <line x1="16" y1="2" x2="16" y2="6" stroke-width="2" stroke-linecap="round"/>
+                        <line x1="8" y1="2" x2="8" y2="6" stroke-width="2" stroke-linecap="round"/>
+                        <line x1="3" y1="10" x2="21" y2="10" stroke-width="2"/>
+                    </svg>
+                </div>
+                <div class="card-content">
+                    <h2>Planning</h2>
+                    <p>Grille hebdomadaire des spectacles et camions</p>
+                </div>
+                <svg class="card-arrow" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+                    <path d="M9 18L15 12L9 6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
+            </a>
+        </div>
+    </div>
+    <router-outlet></router-outlet>
+</div>

src/app/components/pages/dashboard/dashboard.ts

@@ -1,16 +1,11 @@
 import { Component } from '@angular/core';
-import {RouterOutlet} from "@angular/router";
+import { RouterLink, RouterOutlet } from "@angular/router";
 
 @Component({
   selector: 'app-dashboard',
-  imports: [RouterOutlet],
+  imports: [RouterOutlet, RouterLink],
-  template: `
+  templateUrl: './dashboard.html',
-    <p>
+  styleUrl: './dashboard.css'
-      dashboard works!
-        <router-outlet></router-outlet>
-    </p>
-  `,
-  styles: ``
 })
 export class Dashboard {
 

src/styles.css

@@ -9,9 +9,13 @@
 * {
   margin: 0;
   padding: 0;
+  box-sizing: border-box;
 }
 
-body {
+html, body {
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
   font-family: 'Be Vietnam Pro', sans-serif;
 }
 :root {