yetangitu/funkwhale
1
0
Fork 0
mirror of https://code.eliotberriot.com/funkwhale/funkwhale.git synced 2025-10-04 07:09:16 +02:00
Code Issues Releases Wiki Activity

Fix #612: Improved accessibility by using main/section/nav tags and aria-labels in most critical places

Browse source
This commit is contained in:
Eliot Berriot 2018-11-19 23:33:22 +01:00
parent 9005ebbd6d
commit 29171853b3
No known key found for this signature in database
GPG key ID: DD6965E2476E5C27
42 changed files with 1266 additions and 1122 deletions
Download patch file Download diff file Expand all files Collapse all files

26
front/src/components/library/Library.vue
View file

@ -1,6 +1,6 @@
<template>
<div class="main library pusher">
<div class="ui secondary pointing menu">
<nav class="ui secondary pointing menu" role="navigation" :aria-label="labels.secondaryMenu">
<router-link class="ui item" to="/library" exact>
<translate>Browse</translate>
</router-link>
@ -13,7 +13,7 @@
<router-link class="ui item" to="/library/playlists" exact>
<translate>Playlists</translate>
</router-link>
</div>
</nav>
<router-view :key="$route.fullPath"></router-view>
</div>
</template>
@ -21,8 +21,16 @@
<script>
export default {
computed: {
showImports () {
return this.$store.state.auth.availablePermissions['upload'] || this.$store.state.auth.availablePermissions['library']
showImports() {
return (
this.$store.state.auth.availablePermissions["upload"] ||
this.$store.state.auth.availablePermissions["library"]
)
},
labels() {
return {
secondaryMenu: this.$gettext("Secondary menu")
}
}
}
}
@ -30,7 +38,7 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss">
@import '../../style/vendor/media';
@import "../../style/vendor/media";
.library {
.ui.segment.head {
@ -46,18 +54,16 @@ export default {
}
&.with-background {
.header {
&, .sub {
&,
.sub {
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
color: white !important;
}
}
.segment-content {
background-color: rgba(0, 0, 0, 0.5)
background-color: rgba(0, 0, 0, 0.5);
}
}
}
}
</style>