Skip to content
Snippets Groups Projects
Commit 6c580bc4 authored by Agate's avatar Agate :speech_balloon:
Browse files

Added aria-landmarks on important pieces of content

parent baf15c73
No related branches found
No related tags found
No related merge requests found
......@@ -15,7 +15,7 @@
<transition name="queue">
<queue @touch-progress="$refs.player.setCurrentTime($event)" v-if="$store.state.ui.queueFocused"></queue>
</transition>
<router-view :class="{hidden: $store.state.ui.queueFocused}"></router-view>
<router-view role="main" :class="{hidden: $store.state.ui.queueFocused}"></router-view>
<player ref="player"></player>
<app-footer
:class="{hidden: $store.state.ui.queueFocused}"
......
<template>
<footer id="footer" role="contentinfo" class="ui vertical footer segment">
<footer id="footer" role="contentinfo" class="ui vertical footer segment" aria-labelledby="footer-label">
<h1 id="footer-label" class="visually-hidden">
<translate translate-context="*/*/*">Application footer</translate>
</h1>
<div class="ui container">
<div class="ui stackable equal height stackable grid">
<section class="four wide column">
......
......@@ -107,7 +107,10 @@
<translate translate-context="*/Signup/Link/Verb">Create an account</translate>
</router-link>
</div>
<nav class="secondary" role="navigation">
<nav class="secondary" role="navigation" aria-labelledby="navigation-label">
<h1 id="navigation-label" class="visually-hidden">
<translate translate-context="*/*/*">Main navigation</translate>
</h1>
<div class="ui small hidden divider"></div>
<section :class="['ui', 'bottom', 'attached', {active: selectedTab === 'library'}, 'tab']" :aria-label="labels.mainMenu">
<nav class="ui vertical large fluid inverted menu" role="navigation" :aria-label="labels.mainMenu">
......
<template>
<section v-if="currentTrack" class="player-wrapper ui bottom-player component-player">
<section role="complementary" v-if="currentTrack" class="player-wrapper ui bottom-player component-player" aria-labelledby="player-label">
<h1 id="player-label" class="visually-hidden">
<translate translate-context="*/*/*">Audio player and controls</translate>
</h1>
<div class="ui inverted segment fixed-controls" @click.prevent.stop="toggleMobilePlayer">
<div
:class="['ui', 'top attached', 'small', 'inverted', {'indicating': isLoadingAudio}, 'progress']">
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment