reorganize scss files

src/assets/scss/abstracts/_variables.scss

@@ -0,0 +1,30 @@
+// Texte de départ (id: 9)
+$color-starting: white;
+// Texte critique (id: 22)
+$color-critical: #ffba7d;
+// Constellation en écho (id: 63)
+$color-echo: #e191ff;
+// Réflexion théorique (id: 6)
+$color-thinking: #ffeb91;
+// Lecture rapprochée (id: 7)
+$color-reading: #a5a5ff;
+// Expérience sensible (id: 8)
+$color-experience: #cdae87;
+// Kit de désapprentissage (id: 23)
+$color-kit: #ff8873;
+
+$families: (
+  9: $color-starting,
+  22: $color-critical,
+  63: $color-echo,
+  6: $color-thinking,
+  7: $color-reading,
+  8: $color-experience,
+  23: $color-kit
+);
+
+@function setColorFromId($id) {
+  @return map-get($families, $id);
+}
+
+$text-card-header-height: 4rem;