mirror of
https://github.com/HabitRPG/habitica.git
synced 2025-12-19 07:37:25 +01:00
Replace button tag with ARIA button role
Add `role`, `aria-pressed`, `tabindex`, and keypress handlers, and remove the `<button>` tag. Add `isPressed` computed function. Use this to set the value of `aria-pressed`.
This commit is contained in:
@@ -3,8 +3,8 @@ A simplified dropdown component that doesn't rely on buttons as toggles like bo
|
||||
-->
|
||||
|
||||
<template lang="pug">
|
||||
.habitica-menu-dropdown.dropdown(@click="toggleDropdown()", :class="{open: isOpen}")
|
||||
button.habitica-menu-dropdown-toggle
|
||||
.habitica-menu-dropdown.dropdown(@click="toggleDropdown()", @keypress.enter.space.stop.prevent="toggleDropdown()", role="button", tabindex="0", :class="{open: isOpen}", :aria-pressed="isPressed")
|
||||
.habitica-menu-dropdown-toggle
|
||||
slot(name="dropdown-toggle")
|
||||
.dropdown-menu(:class="{'dropdown-menu-right': right}")
|
||||
slot(name="dropdown-content")
|
||||
@@ -66,6 +66,9 @@ export default {
|
||||
if (this.openStatus !== undefined) return this.openStatus === 1 ? true : false;
|
||||
return this.isDropdownOpen;
|
||||
},
|
||||
isPressed () {
|
||||
return this.isOpen ? 'true' : 'false';
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
document.documentElement.addEventListener('click', this._clickOutListener);
|
||||
|
||||
Reference in New Issue
Block a user