Skip to content

Conversation

@illright
Copy link
Contributor

@illright illright commented Dec 7, 2024

Description

Related to #1701. There has been a comment expressing a concern about the accessibility of this redesign, but I'm not sure what exactly was the problem. However, I did find it helpful to increase the thickness of the highlight to make it visually stand out more. I tested without colors and still found it pretty easy to tell which entry is selected. However, I do not have any visual impairments, so my word should not be the last here.

This PR removes the bright background of a selected item in the left sidebar and replaces it with an accent text color and an accent line on the left.

Screenshots

Before, desktop:

LightDarkDark without sidebar BG
Scherm­afbeelding 2024-12-07 om 22 53 06 Scherm­afbeelding 2024-12-07 om 22 53 22 Scherm­afbeelding 2024-12-07 om 22 53 31
Scherm­afbeelding 2024-12-07 om 22 53 39 Scherm­afbeelding 2024-12-07 om 22 54 09 Scherm­afbeelding 2024-12-07 om 22 53 58

After, desktop:

LightDarkDark without sidebar BG
Scherm­afbeelding 2024-12-07 om 22 50 13 Scherm­afbeelding 2024-12-07 om 22 50 25 Scherm­afbeelding 2024-12-07 om 22 50 55
Scherm­afbeelding 2024-12-07 om 22 51 13 Scherm­afbeelding 2024-12-07 om 22 51 34 Scherm­afbeelding 2024-12-07 om 22 51 42

Mobile (dark version is identical to desktop):

Scherm­afbeelding 2024-12-07 om 22 55 02 Scherm­afbeelding 2024-12-07 om 22 55 25
@changeset-bot
Copy link

changeset-bot bot commented Dec 7, 2024

🦋 Changeset detected

Latest commit: 3e909a9

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@astrojs/starlight Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added the 🌟 core Changes to Starlight’s main package label Dec 7, 2024
@netlify
Copy link

netlify bot commented Dec 7, 2024

Deploy Preview for astro-starlight ready!

Name Link
🔨 Latest commit 3e909a9
🔍 Latest deploy log https://app.netlify.com/sites/astro-starlight/deploys/6754cbccb6288800080c58c6
😎 Deploy Preview https://deploy-preview-2662--astro-starlight.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 100 (no change from production)
Accessibility: 100 (no change from production)
Best Practices: 100 (no change from production)
SEO: 100 (no change from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify site configuration.

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

Labels

🌟 core Changes to Starlight’s main package

1 participant