donnees_20260325_150809

Fiche Descriptive Complète

🔷 INFORMATIONS GÉNÉRALES

Champ Détail

Nom du template plan_d_equipement_familial_black_friday.html

Version 1.0.0

Date de création 25/03/2026

Auteur / Designer Refoia Jeremy Tech

Type de page Dashboard de Suivi Budgétaire / Personal Finance

Objectif principal Visualiser la progression d’une épargne pour des achats ciblés.

🎯 DESCRIPTION FONCTIONNELLE

📌 Que fait ce template ?

Ce template propose un tableau de bord minimaliste pour la gestion d’un projet d’équipement familial. Il met en avant :

Une liste d’objectifs d’achat avec prix associés.

Un thermomètre de progression dynamique (visuel) pour l’épargne.

Une section stratégique détaillant le plan d’action mois par mois.

📌 Public cible (Persona)

👤 Familles souhaitant planifier leurs dépenses importantes.

👤 Particuliers cherchant un outil visuel simple pour suivre un objectif financier.

⚙️ SPÉCIFICATIONS TECHNIQUES

🌐 Environnement & Compatibilité

Élément Valeur

Standard HTML HTML5

Framework CSS CSS Pur (Variables CSS natives)

Framework JS Aucun (Statique)

Browsers ciblés Chrome ✅ Firefox ✅ Safari ✅ Edge ✅

Responsive ✅ Partiel (Grid layout fluide)

📦 Dépendances / Assets

Polices : ‘Segoe UI’, Tahoma, Geneva, Verdana, sans-serif (Fonts systèmes).

Icônes : Emojis natifs (🛒, 💡).

📥 ENTRÉES — CONTENU DYNAMIQUE

# Nom de la variable Type Obligatoire Description

1 mercury-height string ✅ Oui Pourcentage de remplissage du thermomètre (ex: 70%).

2 total-epargne int ✅ Oui Somme totale des objectifs.

3 current-savings int ✅ Oui Montant actuellement économisé.

📤 INTERACTIONS & SORTIES

🖱️ Événements Utilisateur

Transition visuelle : La barre de mercure possède une transition: height 1s pour un effet fluide lors du chargement.

Mise en avant : L’élément « Total à épargner » utilise une couleur de fond distincte (#eafaf1) pour attirer l’œil.

🧱 STRUCTURE DU FICHIER — DOM

plan_d_equipement_familial_black_friday.html

📌 : Définition des variables de couleurs (–primary-color, –accent-color).

📌 :

🏗️

: Titre H1 « Objectif Black Friday 2024 ».

🏗️

(div.dashboard) :

🧱 Section Gauche : Liste des articles (.goal-item) et bloc stratégie.

🧱 Section Droite : Composant thermomètre (.thermometer-container).

🏗️