Spaces:
Running
Running
| <div id="app-container"> | |
| <!-- Page Accueil / Liste Séances --> | |
| <!-- SEULE CELLE-CI A 'active' AU DÉBUT --> | |
| <div id="home-page" class="active"> | |
| <div class="flex-between"> | |
| <h2>Mes séances</h2> | |
| <button id="new-workout-btn" class="btn">Nouvelle séance</button> | |
| </div> | |
| <div id="workouts-list" class="workout-list"> | |
| <div class="spinner"></div> | |
| <p id="empty-workout-message" class="hidden" style="text-align: center; margin-top: 2rem;"> | |
| Aucune séance enregistrée pour cet utilisateur. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- Page Nouvelle Séance --> | |
| <!-- !!! ENLEVER class="hidden" !!! --> | |
| <div id="new-workout-page"> | |
| <div class="flex-between"> | |
| <h2>Nouvelle séance</h2> | |
| <div> <!-- Conteneur pour les boutons --> | |
| <button id="cancel-new-workout-btn" class="btn btn-outline" style="margin-right: 0.5rem;">Annuler</button> | |
| <button id="save-workout-btn" class="btn">Enregistrer</button> | |
| </div> | |
| </div> | |
| <!-- ... reste du contenu de new-workout-page ... --> | |
| <div class="card"> | |
| <div class="form-group"> | |
| <label for="workout-name">Nom de la séance</label> | |
| <input type="text" id="workout-name" placeholder="Ex: Push, Legs, Full Body..."> | |
| </div> | |
| <div class="form-row"> | |
| <div class="form-group"> | |
| <label for="workout-date">Date</label> | |
| <input type="date" id="workout-date"> | |
| </div> | |
| <div class="form-group"> | |
| <label for="workout-duration">Durée (min)</label> | |
| <input type="number" id="workout-duration" min="1" placeholder="60"> | |
| </div> | |
| </div> | |
| </div> | |
| <h3 style="margin: 1rem 0;">Exercices</h3> | |
| <div id="exercises-container"></div> | |
| <button id="add-exercise-btn" class="btn btn-outline" style="width: 100%; margin-top: 1rem;">+ Ajouter Exercice</button> | |
| <div class="card" style="margin-top: 2rem;"> | |
| <div class="form-group"> | |
| <label for="satisfaction">Niveau de satisfaction (1-100%)</label> | |
| <input type="range" id="satisfaction" min="1" max="100" value="75"> | |
| <div class="satisfaction"> | |
| <span>Satisfaction</span> | |
| <div class="satisfaction-value">75%</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Page Détail Séance --> | |
| <!-- !!! ENLEVER class="hidden" !!! --> | |
| <div id="workout-details-page"> | |
| <div class="flex-between"> | |
| <h2 id="detail-workout-name">Détail Séance</h2> | |
| <button id="back-to-home" class="btn btn-outline">Retour</button> | |
| </div> | |
| <!-- ... reste du contenu de workout-details-page ... --> | |
| <div class="card"> | |
| <div class="workout-details-info"> | |
| <div class="form-row"> | |
| <p><strong>Date:</strong> <span id="detail-date"></span></p> | |
| <p><strong>Durée:</strong> <span id="detail-duration"></span> min</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="stats-grid" style="margin-top: 1rem;"> | |
| <div class="card stat-card"> | |
| <div class="stat-value" id="detail-tonnage">0</div> | |
| <div>Tonnage Total (kg)</div> | |
| </div> | |
| <div class="card stat-card"> | |
| <div class="stat-value" id="detail-satisfaction">0%</div> | |
| <div>Satisfaction</div> | |
| </div> | |
| <div class="card stat-card"> | |
| <div class="stat-value" id="detail-exercises-count">0</div> | |
| <div>Exercices</div> | |
| </div> | |
| </div> | |
| <h3 style="margin: 1.5rem 0 1rem;">Exercices Réalisés</h3> | |
| <div id="detail-exercises-container"></div> | |
| <button id="delete-workout-btn" class="btn btn-danger" style="width: 100%; margin-top: 2rem;">Supprimer cette séance</button> | |
| </div> | |
| <!-- Page Statistiques --> | |
| <!-- !!! ENLEVER class="hidden" !!! --> | |
| <div id="stats-page"> | |
| <h2>Statistiques</h2> | |
| <!-- ... reste du contenu de stats-page ... --> | |
| <div class="stats-grid"> | |
| <div class="card stat-card"> | |
| <div class="stat-value" id="stats-workout-count">0</div> | |
| <div>Séances Totales</div> | |
| </div> | |
| <div class="card stat-card"> | |
| <div class="stat-value" id="stats-avg-tonnage">0</div> | |
| <div>Tonnage Moyen</div> | |
| </div> | |
| <div class="card stat-card"> | |
| <div class="stat-value" id="stats-avg-satisfaction">0%</div> | |
| <div>Satisfaction Moyenne</div> | |
| </div> | |
| </div> | |
| <h3 style="margin: 1.5rem 0 1rem;">Tendances Récentes</h3> | |
| <div class="card"> | |
| <p style="text-align: center; margin: 1rem 0;"> | |
| Les statistiques détaillées seront affichées après plusieurs séances enregistrées. | |
| </p> | |
| </div> | |
| </div> | |
| </div> |