github-starred/open-webui
2
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-05-06 10:58:17 -05:00
Code Issues 1.3k Packages Projects Releases 126 Wiki Activity

[PR #13566] [MERGED] feat: Accessibility enhancements #10033

New Issue
Closed
opened 2025-11-11 18:37:38 -06:00 by GiteaMirror · 0 comments
GiteaMirror commented 2025-11-11 18:37:38 -06:00
Owner
Copy Link

📋 Pull Request Information

Original PR: https://github.com/open-webui/open-webui/pull/13566
Author: @sinejespersen
Created: 5/6/2025
Status: ✅ Merged
Merged: 5/7/2025
Merged by: @tjbck

Base: dev ← Head: 8908-accessibility-enhancements

📝 Commits (6)

  • 0889dd3 add close label to close button in changelog modal, only accessible for screen readers
  • 86ce111 Add aria-labelledby to icon-button to make assistive tech able to give info on what user can expect from button
  • 8c6f4f6 change divs to labels, as this is what they semantically are
  • c4a3a9c fix text-contrast from 3.71 to 7.55 on dark mode
  • 9d8d439 remove alt text from logo, as this is decorative and provides no value for assistive tech users
  • 263086a break and indent divs

📊 Changes

3 files changed (+23 additions, -10 deletions)

View changed files

📝 src/lib/components/ChangelogModal.svelte (+1 -0)
📝 src/lib/components/OnBoarding.svelte (+4 -3)
📝 src/routes/auth/+page.svelte (+18 -7)

📄 Description

Pull Request Checklist

Note to first-time contributors: Please open a discussion post in Discussions and describe your changes before submitting a pull request.

Before submitting, make sure you've checked the following:

  • Target branch: Please verify that the pull request targets the dev branch.
  • Description: Provide a concise description of the changes made in this pull request.
  • Changelog: Ensure a changelog entry following the format of Keep a Changelog is added at the bottom of the PR description.
  • Documentation: Have you updated relevant documentation Open WebUI Docs, or other documentation sources?
  • Dependencies: Are there any new dependencies? Have you updated the dependency versions in the documentation?
  • Testing: Have you written and run sufficient tests to validate the changes?
  • Code review: Have you performed a self-review of your code, addressing any coding standard issues and ensuring adherence to the project's coding standards?
  • Prefix: To clearly categorize this pull request, prefix the pull request title using one of the following:
    • BREAKING CHANGE: Significant changes that may affect compatibility
    • build: Changes that affect the build system or external dependencies
    • ci: Changes to our continuous integration processes or workflows
    • chore: Refactor, cleanup, or other non-functional code changes
    • docs: Documentation update or addition
    • feat: Introduces a new feature or enhancement to the codebase
    • fix: Bug fix or error correction
    • i18n: Internationalization or localization changes
    • perf: Performance improvement
    • refactor: Code restructuring for better maintainability, readability, or scalability
    • style: Changes that do not affect the meaning of the code (white space, formatting, missing semi-colons, etc.)
    • test: Adding missing tests or correcting existing tests
    • WIP: Work in progress, a temporary label for incomplete or ongoing work

Changelog Entry

Description

As per https://github.com/open-webui/open-webui/discussions/8908

Added

N/A

Changed

  • Improved accessibility

Deprecated

N/A

Removed

N/A

Fixed

N/A

Security

N/A

Breaking Changes

N/A

Additional Information

N/A

Screenshots or Videos

Example of button label in html:

Screenshot 2025-05-06 at 09 13 04

Contrast:

image

Contributor License Agreement

By submitting this pull request, I confirm that I have read and fully agree to the Contributor License Agreement (CLA), and I am providing my contributions under its terms.

Changelog entry

Description

There are a bunch of accessibility issues with the frontend. This solves some of them: labels for inputs, labels for buttons and contrast. It is described better in: https://github.com/open-webui/open-webui/discussions/8908

Changed

Additional information

N/A

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/open-webui/open-webui/pull/13566 **Author:** [@sinejespersen](https://github.com/sinejespersen) **Created:** 5/6/2025 **Status:** ✅ Merged **Merged:** 5/7/2025 **Merged by:** [@tjbck](https://github.com/tjbck) **Base:** `dev` ← **Head:** `8908-accessibility-enhancements` --- ### 📝 Commits (6) - [`0889dd3`](https://github.com/open-webui/open-webui/commit/0889dd3a510993b83adf0aaa521e3d29b1151dcd) add close label to close button in changelog modal, only accessible for screen readers - [`86ce111`](https://github.com/open-webui/open-webui/commit/86ce111edde71e59c59b277b7406f9c9fb4cde46) Add aria-labelledby to icon-button to make assistive tech able to give info on what user can expect from button - [`8c6f4f6`](https://github.com/open-webui/open-webui/commit/8c6f4f6579bfd148555ce04494eb7fd800cb80c0) change divs to labels, as this is what they semantically are - [`c4a3a9c`](https://github.com/open-webui/open-webui/commit/c4a3a9c6166813ec646462b2ccd788180d522c09) fix text-contrast from 3.71 to 7.55 on dark mode - [`9d8d439`](https://github.com/open-webui/open-webui/commit/9d8d4393a6277984d45fe5fed3bd076fdc213674) remove alt text from logo, as this is decorative and provides no value for assistive tech users - [`263086a`](https://github.com/open-webui/open-webui/commit/263086aa91f51e6a41e72476f4bfedac93a1b154) break and indent divs ### 📊 Changes **3 files changed** (+23 additions, -10 deletions) <details> <summary>View changed files</summary> 📝 `src/lib/components/ChangelogModal.svelte` (+1 -0) 📝 `src/lib/components/OnBoarding.svelte` (+4 -3) 📝 `src/routes/auth/+page.svelte` (+18 -7) </details> ### 📄 Description # Pull Request Checklist ### Note to first-time contributors: Please open a discussion post in [Discussions](https://github.com/open-webui/open-webui/discussions) and describe your changes before submitting a pull request. **Before submitting, make sure you've checked the following:** - [x] **Target branch:** Please verify that the pull request targets the `dev` branch. - [x] **Description:** Provide a concise description of the changes made in this pull request. - [x] **Changelog:** Ensure a changelog entry following the format of [Keep a Changelog](https://keepachangelog.com/) is added at the bottom of the PR description. - [ ] **Documentation:** Have you updated relevant documentation [Open WebUI Docs](https://github.com/open-webui/docs), or other documentation sources? - [ ] **Dependencies:** Are there any new dependencies? Have you updated the dependency versions in the documentation? - [ ] **Testing:** Have you written and run sufficient tests to validate the changes? - [x] **Code review:** Have you performed a self-review of your code, addressing any coding standard issues and ensuring adherence to the project's coding standards? - [x] **Prefix:** To clearly categorize this pull request, prefix the pull request title using one of the following: - **BREAKING CHANGE**: Significant changes that may affect compatibility - **build**: Changes that affect the build system or external dependencies - **ci**: Changes to our continuous integration processes or workflows - **chore**: Refactor, cleanup, or other non-functional code changes - **docs**: Documentation update or addition - **feat**: Introduces a new feature or enhancement to the codebase - **fix**: Bug fix or error correction - **i18n**: Internationalization or localization changes - **perf**: Performance improvement - **refactor**: Code restructuring for better maintainability, readability, or scalability - **style**: Changes that do not affect the meaning of the code (white space, formatting, missing semi-colons, etc.) - **test**: Adding missing tests or correcting existing tests - **WIP**: Work in progress, a temporary label for incomplete or ongoing work # Changelog Entry ### Description As per https://github.com/open-webui/open-webui/discussions/8908 - Change `<div` to `<label` as per [Success Criterion 1.3.1: Info and Relationships](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships) - Add `aria-labelledby`to `<button`as per [Success Criterion 1.3.1: Info and Relationships](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships) - Add label to `<button` as per [Success Criterion 1.3.1: Info and Relationships](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships) and [2.4.6 – Headings and Labels (Level AA)](https://www.w3.org/WAI/WCAG21/Understanding/headings-and-labels.html) and [4.1.2 – Name, Role, Value (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/name-role-value.html). - Make `alt` text in logo an empty text string `""`, as per [SC 1.1.1: Non-text Content (Level A)](https://w3.org/TR/WCAG21#non-text-content), with the argument that the logo is decorative, not a link and also the text `"logo"` doesn't matter. - Improve text contrast from 3.71 to 7.55 in light mode, preserve dark mode look (yay tailwind), as per [1.4.3 – Contrast (Minimum) (Level AA)](https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html) and [1.4.6 – Contrast (Enhanced) (Level AAA)](https://www.w3.org/WAI/WCAG21/Understanding/contrast-enhanced.html) ### Added N/A ### Changed - Improved accessibility ### Deprecated N/A ### Removed N/A ### Fixed N/A ### Security N/A ### Breaking Changes N/A ### Additional Information N/A ### Screenshots or Videos Example of button label in html: <img width="1680" alt="Screenshot 2025-05-06 at 09 13 04" src="https://github.com/user-attachments/assets/f9e7becf-bcfc-4041-9554-7ff4de44d49c" /> Contrast: <img width="439" alt="image" src="https://github.com/user-attachments/assets/10923822-23f1-4732-b39d-72c9555df934" /> ### Contributor License Agreement By submitting this pull request, I confirm that I have read and fully agree to the [Contributor License Agreement (CLA)](/CONTRIBUTOR_LICENSE_AGREEMENT), and I am providing my contributions under its terms. # Changelog entry ## Description There are a bunch of accessibility issues with the frontend. This solves some of them: labels for inputs, labels for buttons and contrast. It is described better in: https://github.com/open-webui/open-webui/discussions/8908 ## Changed - Change `<div` to `<label` as per [Success Criterion 1.3.1: Info and Relationships](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships) - Add `aria-labelledby`to `<button`as per [Success Criterion 1.3.1: Info and Relationships](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships) - Add label to `<button` as per [Success Criterion 1.3.1: Info and Relationships](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships) and [2.4.6 – Headings and Labels (Level AA)](https://www.w3.org/WAI/WCAG21/Understanding/headings-and-labels.html) and [4.1.2 – Name, Role, Value (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/name-role-value.html). - Make `alt` text in logo an empty text string `""`, as per [SC 1.1.1: Non-text Content (Level A)](https://w3.org/TR/WCAG21#non-text-content), with the argument that the logo is decorative, not a link and also the text `"logo"` doesn't matter. - Improve text contrast from 3.71 to 7.55 in light mode, preserve dark mode look (yay tailwind), as per [1.4.3 – Contrast (Minimum) (Level AA)](https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html) and [1.4.6 – Contrast (Enhanced) (Level AAA)](https://www.w3.org/WAI/WCAG21/Understanding/contrast-enhanced.html) ## Additional information N/A --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2025-11-11 18:37:38 -06:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
bug
confirmed
confirmed issue
core
documentation
enhancement
good first issue
help wanted
non-core
pull-request
Mirrored from GitHub Pull Request
 python
question
testing wanted
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/open-webui#10033
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?