client_projects
/
boussole-pluss
4
0
Fork 0
Code Issues 1 Pull Requests Projects Releases 3 Activity

fix(a11y): add axe numbers

pull/3/head
Nicolas Doby 2023-02-28 17:36:17 +01:00
parent 1316ebb70b
commit 474fc988f8
2 changed files with 20 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/components/Legend.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<span class="bold">Légende</span> <span class="bold">Légende</span>
<ul> <ol>
<!-- <li v-for="axe in axes" :key="axe.identifier" :class="'axe-'+axe.identifier">{{ axe.shortTitle }}</li>--> <!-- <li v-for="axe in axes" :key="axe.identifier" :class="'axe-'+axe.identifier">{{ axe.shortTitle }}</li>-->
<li class="axe-1">Pouvoir d'agir</li> <li class="axe-1">Pouvoir d'agir</li>
<li class="axe-2">Multi-secteur</li> <li class="axe-2">Multi-secteur</li>
@ -13,38 +13,20 @@
<li class="axe-8">Finances</li> <li class="axe-8">Finances</li>
<li class="axe-9">Moyens de production</li> <li class="axe-9">Moyens de production</li>
<li class="axe-10">Travail</li> <li class="axe-10">Travail</li>
</ul> </ol>
</div> </div>
</template> </template>
<!--<script lang="ts">-->
<!--import { Component, Vue} from "nuxt-property-decorator";-->
<!--import {axeStore} from "~/utils/store-accessor";-->
<!--import {Axe} from "~/repositories/models/axe.model";-->
<!--@Component-->
<!--export default class Legend extends Vue {-->
<!-- async created() {-->
<!-- await axeStore.getAxes();-->
<!-- }-->
<!-- get axes(): Axe[] {-->
<!-- return axeStore.axes;-->
<!-- }-->
<!--}-->
<!--</script>-->
<style lang="scss" scoped> <style lang="scss" scoped>
@import "assets/css/color"; @import "assets/css/color";
@import "assets/css/spacing"; @import "assets/css/spacing";
ul { ol {
list-style: none;
margin: 0; margin: 0;
position: relative;
} }
ul li::before { ol li::before {
content: ""; content: "";
border: 0 solid; border: 0 solid;
@ -53,16 +35,18 @@ ul li::before {
width: 16px; width: 16px;
height: 16px; height: 16px;
margin-right: $xxx_small; position: absolute;
left: -22px;
} }
ul li+li { ol li+li {
border-top: 1px solid #E8E8E8; border-top: 1px solid #E8E8E8;
} }
ul li { ol li {
line-height: 16px; line-height: 16px;
padding: $xxx_small 0; padding: $xxx_small 0;
list-style-position: inside;
} }
.axe-1::before { color: #CA8AE8; background: #CA8AE8 } .axe-1::before { color: #CA8AE8; background: #CA8AE8 }

20
frontend/components/PolarAreaChart.vue
View File

@ -76,16 +76,16 @@ export default class PolarAreaChart extends Vue {
readonly chartData = { readonly chartData = {
labels: [ labels: [
"Pouvoir d'agir", "1. Pouvoir d'agir",
"Multi-secteur", "2. Multi-secteur",
"Local global", "3. Local global",
"Utilité (sociale et écologique)", "4. Utilité (sociale et écologique)",
"Communs", "5. Communs",
"Démocratie", "6. Démocratie",
"Coopération", "7. Coopération",
"Finances", "8. Finances",
"Moyens de production", "9. Moyens de production",
"Travail" "10. Travail"
], ],
datasets: [ datasets: [
{ {