feat [front]: a11y time tag and no double tabbable element
This commit is contained in:
parent
04fedf7985
commit
82ffcb17d6
6 changed files with 16 additions and 7 deletions
|
@ -9,6 +9,7 @@
|
||||||
label="Nous contacter"
|
label="Nous contacter"
|
||||||
icon="ri-mail-line"
|
icon="ri-mail-line"
|
||||||
class="is-primary"
|
class="is-primary"
|
||||||
|
tabindex="-1"
|
||||||
/>
|
/>
|
||||||
</a>
|
</a>
|
||||||
</header>
|
</header>
|
||||||
|
|
|
@ -64,6 +64,7 @@
|
||||||
:href="film.facebookEventLink"
|
:href="film.facebookEventLink"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
|
tabindex="-1"
|
||||||
>
|
>
|
||||||
<ButtonIcon
|
<ButtonIcon
|
||||||
label="Événement Facebook"
|
label="Événement Facebook"
|
||||||
|
@ -79,9 +80,9 @@
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
<div class="ml-auto title is-4">
|
<time class="ml-auto title is-4" :datetime="film.projectionDate">
|
||||||
{{ prettyDate.full(film.projectionDate) }}
|
{{ prettyDate.full(film.projectionDate) }}
|
||||||
</div>
|
</time>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
<MovieCardTrailerModal
|
<MovieCardTrailerModal
|
||||||
|
|
|
@ -57,6 +57,7 @@
|
||||||
:href="film.facebookEventLink"
|
:href="film.facebookEventLink"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
|
tabindex="-1"
|
||||||
>
|
>
|
||||||
<ButtonIcon
|
<ButtonIcon
|
||||||
label="Événement Facebook"
|
label="Événement Facebook"
|
||||||
|
@ -74,9 +75,9 @@
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
<div class="ml-auto title is-5">
|
<time class="ml-auto title is-5" :datetime="film.projectionDate">
|
||||||
{{ prettyDate.short(film.projectionDate) }}
|
{{ prettyDate.short(film.projectionDate) }}
|
||||||
</div>
|
</time>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,7 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<main class="section">
|
<main class="section">
|
||||||
<h1 class="title">
|
<h1 class="title">
|
||||||
Modifier la séance du {{ new Date(film.projectionDate).toLocaleString() }}
|
Modifier la séance du
|
||||||
|
<time :datetime="film.projectionDate">{{
|
||||||
|
new Date(film.projectionDate).toLocaleString()
|
||||||
|
}}</time>
|
||||||
</h1>
|
</h1>
|
||||||
<AdminForm v-model="film" @save="saveDraft" @publish="publish" />
|
<AdminForm v-model="film" @save="saveDraft" @publish="publish" />
|
||||||
</main>
|
</main>
|
||||||
|
|
|
@ -5,7 +5,8 @@
|
||||||
{{ film.isConfirmed ? "Publié" : "Brouillon" }}
|
{{ film.isConfirmed ? "Publié" : "Brouillon" }}
|
||||||
</div>
|
</div>
|
||||||
<h1 class="mx-5">
|
<h1 class="mx-5">
|
||||||
{{ new Date(film.projectionDate).toLocaleString() || "À planifier" }} -
|
<time v-if="film.projectionDate" :datetime="film.projectionDate">{{ new Date(film.projectionDate).toLocaleString()}}</time>
|
||||||
|
<template v-else>À planifier</template> -
|
||||||
{{ film.title }}
|
{{ film.title }}
|
||||||
<span class="has-text-grey-lighter">#{{ film.id }}</span>
|
<span class="has-text-grey-lighter">#{{ film.id }}</span>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
|
@ -4,7 +4,9 @@
|
||||||
<ul class="list has-visible-pointer-controls">
|
<ul class="list has-visible-pointer-controls">
|
||||||
<li v-for="film of films" :key="film.id" class="list-item">
|
<li v-for="film of films" :key="film.id" class="list-item">
|
||||||
<nuxt-link :to="`/admin/${film.id}`" class="list-item-content">
|
<nuxt-link :to="`/admin/${film.id}`" class="list-item-content">
|
||||||
{{ new Date(film.projectionDate).toLocaleString() || "À planifier" }}
|
<time v-if="film.projectionDate" :datetime="film.projectionDate">{{ new Date(film.projectionDate).toLocaleString()}}</time>
|
||||||
|
<template v-else>À planifier</template> -
|
||||||
|
{{ film.title }}
|
||||||
- {{ film.title }}
|
- {{ film.title }}
|
||||||
<template v-if="film.director"> de {{ film.director }}</template>
|
<template v-if="film.director"> de {{ film.director }}</template>
|
||||||
</nuxt-link>
|
</nuxt-link>
|
||||||
|
|
Loading…
Reference in a new issue