diff options
| author | Shpuld Shpludson <shp@cock.li> | 2020-12-01 11:02:46 +0000 |
|---|---|---|
| committer | Shpuld Shpludson <shp@cock.li> | 2020-12-01 11:02:46 +0000 |
| commit | fdfb8810c1d8ab64969c38aa1a6bce1daf013249 (patch) | |
| tree | 14efedfdbbfca297da51819235c71ca685cc9902 /src/components/status/status.vue | |
| parent | c655699935ce6fd8b5d0a744dafd6403e32277b7 (diff) | |
| parent | 655d985a82d194cd38c5ec75f1b0153804965d5f (diff) | |
Merge branch 'fix/use-semantically-correct-buttons' into 'develop'
Fix #1001 Accessibility: Use semantically correct buttons (almost) everywhere
Closes #1001
See merge request pleroma/pleroma-fe!1293
Diffstat (limited to 'src/components/status/status.vue')
| -rw-r--r-- | src/components/status/status.vue | 35 |
1 files changed, 17 insertions, 18 deletions
diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 21412faa..896635ee 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -47,16 +47,15 @@ > {{ muteWordHits.join(', ') }} </small> - <a - href="#" - class="unmute fa-scale-110 fa-old-padding" + <button + class="unmute button-unstyled" @click.prevent="toggleMute" > <FAIcon icon="eye-slash" class="fa-scale-110 fa-old-padding" /> - </a> + </button> </div> </template> <template v-else> @@ -201,9 +200,9 @@ icon="external-link-square-alt" /> </a> - <a + <button v-if="expandable && !isPreview" - href="#" + class="button-unstyled" title="Expand" @click.prevent="toggleExpanded" > @@ -211,17 +210,17 @@ class="fa-scale-110 fa-old-padding" icon="plus-square" /> - </a> - <a + </button> + <button v-if="unmuted" - href="#" + class="button-unstyled" @click.prevent="toggleMute" > <FAIcon icon="eye-slash" class="fa-scale-110 fa-old-padding" /> - </a> + </button> </span> </div> @@ -237,9 +236,8 @@ style="min-width: 0" :class="{ '-strikethrough': !status.parent_visible }" > - <a - class="reply-to" - href="#" + <button + class="button-unstyled reply-to" :aria-label="$t('tool_tip.reply')" @click.prevent="gotoOriginal(status.in_reply_to_status_id)" > @@ -253,7 +251,7 @@ > {{ $t('status.reply_to') }} </span> - </a> + </button> </StatusPopover> <span @@ -286,11 +284,12 @@ :key="reply.id" :status-id="reply.id" > - <a - href="#" - class="reply-link" + <button + class="button-unstyled -link reply-link" @click.prevent="gotoOriginal(reply.id)" - >{{ reply.name }}</a> + > + {{ reply.name }} + </button> </StatusPopover> </div> </div> |