Moved legend + number of results

src/components/IndexRepartitions.vue

@@ -9,8 +9,8 @@ section.repartitions
                 span {{ repartition[`name${$root.$i18n.locale}`] }}
             div.repartition__legend
                 aside(v-for="(variable, index) in repartition.variables" :key="index")
-                    div.elevation-fair(:style="{ backgroundColor: repartition.colors[index] }")
-                    span {{ variable[`name${$root.$i18n.locale}`] }}
+                    span {{ variable[`name${$root.$i18n.locale}`] }}: 
+                    div.elevation-fair(:style="{ backgroundColor: repartition.colors[index], color: repartition.colors.textColor[index] }") {{ getRepartitionWidth(repartition, variable) }}
             div.repartition__bar
                 div(v-for="(variable, index) in repartition.variables" :key="index" :style="{ backgroundColor: repartition.colors[index], flex: getRepartitionWidth(repartition, variable), color: repartition.colors.textColor[index] }") 
 
@@ -129,6 +129,7 @@ export default {
 
 .repartition__legend {
     display: flex;
+    flex-wrap: wrap;
     margin-bottom: .5rem;
     justify-content: center;
     margin-left: -2rem;
@@ -142,9 +143,11 @@ export default {
 
 .repartition__legend > aside > div {
     border-radius: 50%;
-    height: 1rem;
-    width: 1rem;
-    margin-right: .5rem;
+    height: 2rem;
+    width: 2rem;
+    margin-left: .5rem;
+    line-height: 2rem;
+    text-align: center;
 }