Version 2.0.0 - update of everything

src/components/Admin/AdminStat.vue

@@ -0,0 +1,81 @@
+<template>
+    <div class="stat">
+        <Icon class="stat-icon" :icon="icon" :style="{ color: color }"/>
+        <div class="stat-info">
+            <p class="stat-label">{{ label }}</p>
+            <p class="stat-value">{{ value }}</p>
+            <p v-if="sub" class="stat-sub">{{ sub }}</p>
+        </div>
+    </div>
+</template>
+<script setup>
+// Tuile de chiffre clé (même hiérarchie de surfaces que Metric.vue)
+defineProps({
+    label: {
+        type: String,
+        required: true
+    },
+    value: {
+        default: 0
+    },
+    sub: {
+        type: String,
+        default: null
+    },
+    icon: {
+        type: String,
+        default: "fa-solid fa-chart-bar"
+    },
+    color: {
+        type: String,
+        default: "var(--text)"
+    }
+});
+</script>
+<style scoped>
+.stat {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 10px;
+    background-color: var(--tertiary);
+    border-radius: 10px;
+    min-width: 0;
+}
+
+.stat-icon {
+    background-color: var(--secondary);
+    padding: 15px;
+    border-radius: 100%;
+    width: 16px;
+    height: 16px;
+    flex-shrink: 0;
+}
+
+.stat-info {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+}
+
+.stat-info p {
+    margin: 0;
+}
+
+.stat-label {
+    color: var(--text-secondary);
+    font-size: 0.8em;
+}
+
+.stat-value {
+    font-weight: bold;
+    font-size: 1.3em;
+    font-family: monospace;
+    word-break: break-word;
+}
+
+.stat-sub {
+    color: var(--text-secondary);
+    font-size: 0.7em;
+}
+</style>