nextcloud-libraries / nextcloud-libraries/nextcloud-vue

[NcAppSidebar] Close button not satisfies contrast for accessibility

Open
#6,392 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

1. to develop accessibility feature: app-sidebar
Dominant language
Vue
Stars
246
Forks
99
Avg merge
1d 20h
Merged PRs (30d)
103

Description

Close button in app info panel is hard to see when screenshot is white or light coloured

Originally reported by @Justinzobel at https://github.com/nextcloud/server/issues/50045

Bug description

When opening the app info sidebar e.g. https://nextcloud.domain/settings/apps/enabled/whiteboard it is not possible to see the circular x button to close the sidebar as it is low contrast.

Image

Steps to reproduce
  1. Install/enable whiteboard app
  2. Go to https://nextcloud.domain/settings/apps/enabled/whiteboard
  3. Look at screenshot and try to find the close button
Expected behavior

Close button has higher visibility.

Suggestion: The x button has an on-hover circular background. Make this background always present and increase the contrast between the X image and the circle image so it is clear to the user where to click to close that sidebar.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue in the NcAppSidebar app info panel at the whiteboard settings page and locate the close button component. Compare its appearance against a white or light screenshot, then adjust the close control so its circular background and X have higher visibility. Done means the button is clearly visible and remains easy to identify as the sidebar close action.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
accessibility, frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.