Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add ARIA labels to TO DO page - Vue #73

Open
12 tasks
Tracked by #63
blackgirlbytes opened this issue Aug 28, 2024 · 4 comments
Open
12 tasks
Tracked by #63

Add ARIA labels to TO DO page - Vue #73

blackgirlbytes opened this issue Aug 28, 2024 · 4 comments

Comments

@blackgirlbytes
Copy link
Contributor

blackgirlbytes commented Aug 28, 2024

Add ARIA labels to To-Do page - Vue

🚀 Goal

Improve the accessibility of the To-Do page in our Vue DWA starter by adding appropriate ARIA labels to key elements.

🤔 Background

Adding ARIA (Accessible Rich Internet Applications) labels will make our To-Do page more usable for people relying on assistive technologies.

This is part of our larger project to create a Vue.js DWA starter. See our main issue here for the full context and list of all related tasks.

Important: For reference, please see the DWA React starter app. While the implementation details will differ for Vue, this example provides a good overview of the structure and functionalities of a DWA.

🔑 Tasks and Acceptance Criteria

  • Review the current structure of the To-Do page
  • Add ARIA labels to the following elements:
    • The main To-Do list container
    • The form for adding new tasks
    • The input field for new task titles
    • The button for adding new tasks
    • Checkboxes for completing tasks
    • Buttons for editing tasks
    • Buttons for deleting tasks
  • Ensure all interactive elements are keyboard accessible
  • Test the page with a screen reader to verify labels are read correctly
  • Update any relevant documentation or comments in the code

🌟 Resources

Getting Started

  1. Comment ".take" on this issue to get assigned
  2. Fork the repository and create a new branch for this task
  3. Follow the tasks outlined above
  4. Submit a pull request with your changes
  5. Respond to any feedback during the review process

Questions?

If you have any questions or need clarification, please comment on this issue or join our Discord community.

Happy coding! 🎉

@29deepanshutyagi
Copy link
Contributor

.take

Copy link

Thanks for taking this issue! Let us know if you have any questions!

@blackgirlbytes blackgirlbytes linked a pull request Oct 10, 2024 that will close this issue
@blackgirlbytes
Copy link
Contributor Author

@29deepanshutyagi this component is now complete, so you can add aria labels to the do to do componet for the vue project now! Let me know if you're still interested

@29deepanshutyagi
Copy link
Contributor

sure

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants