add color and routing

components/QuestionChoice.vue

@@ -1,6 +1,7 @@
 <template>
     <div class="emphased">
-        <div v-for="(val, index) in values" :id="`${questionId}-${val}`" :key="index">
+        <div v-for="(val, index) in values" :id="`${questionId}-${val}`" :key="index"
+            :style="{ background: colors[index] }">
             <input type="radio" :value="val" :name="String(questionId)">
             <label :for="`${questionId}-${val}`">{{ val }}</label>
         </div>
@@ -11,10 +12,11 @@
 <script setup lang="ts">
 interface Props {
     values?: string[]
+    colors?: string[]
     questionId: string
 }
 
-const { values = ["Très bien", "Bien", "Passable", "Insuffisant", "À rejeter"], questionId } = defineProps<Props>()
+const { values = ["Très bien", "Bien", "Passable", "Insuffisant", "À rejeter"], colors = ["#4DB544", "#87E169", "#FFC33C", "#FF824B", "#E94A4D"], questionId } = defineProps<Props>()
 
 </script>