Skip to content

Add class to the Skip Link in the accessibility.md #2123

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.

Sign up for GitHub

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

Jump to bottom
Merged
merged 1 commit into from
Jan 2, 2023
Merged

Add class to the Skip Link in the accessibility.md #2123

merged 1 commit into from
Jan 2, 2023

Conversation

orbanszlrd
Copy link
Contributor

  • CSS syntax is case-insensitive so it is better to use kebab case (skip-link) instead of camel case (skipLink)
  • The anchor tag must have a class of skip-link

@orbanszlrd
Add class to the Skip Link in the accessibility.md
a1d34c2 
- CSS syntax is case-insensitive so it is better to use kebab case (skip-link) instead of camel case (skipLink)
- The anchor tag must have a class of skip-link
@netlify
Copy link

netlify bot commented Dec 11, 2022 •
edited
Loading

✅ Deploy Preview for vuejs ready!

Name Link
🔨 Latest commit a1d34c2
🔍 Latest deploy log https://app.netlify.com/sites/vuejs/deploys/63961d0c64e51e00086c8042
😎 Deploy Preview https://deploy-preview-2123--vuejs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

@skirtles-code
Copy link
Contributor

Thanks for the PR! Something definitely seems off here with the current example, with a class of skip-links and CSS for .skipLink.

I'm a bit confused by the original code. I don't understand why the <a> is wrapped in a <ul>/<li>. The :focus styling should surely be applied to the <a>, but I'm not so sure about the rest of the CSS.

@NataliaTepluhina Any idea why this example needs the <ul>/<li> wrapper? That seems just to be complicating things. The docs themselves have a skip link and don't have a wrapper like that.

@NataliaTepluhina
Copy link
Member

@skirtles-code I am equally confused (I am not the author of the original code 😅 ). Let's merge this PR and handle removing ul/li tags in the follow-up

@NataliaTepluhina NataliaTepluhina merged commit 7f3b9a5 into vuejs:main Jan 2, 2023
Alex-Sokolov referenced this pull request in vuejs-translations/docs-ru Jan 2, 2023
@Alex-Sokolov @orbanszlrd @skirtles-code
Add a comment about not importing defineExpose (#117) (#118)
3405cd9 
* Add class to the Skip Link in the accessibility.md (#2123)

- CSS syntax is case-insensitive so it is better to use kebab case (skip-link) instead of camel case (skipLink)
- The anchor tag must have a class of skip-link

* Add a comment about not importing defineExpose (#2140)

Co-authored-by: Szilard Orban <orbanszlrd@yahoo.com>
Co-authored-by: skirtle <65301168+skirtles-code@users.noreply.github.com>
Alex-Sokolov referenced this pull request in vuejs-translations/docs-ru Jan 2, 2023
@Alex-Sokolov @orbanszlrd
Add class to the Skip Link in the accessibility.md (#2123) (#116)
954740c 
- CSS syntax is case-insensitive so it is better to use kebab case (skip-link) instead of camel case (skipLink)
- The anchor tag must have a class of skip-link

Co-authored-by: Szilard Orban <orbanszlrd@yahoo.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@NataliaTepluhina NataliaTepluhina NataliaTepluhina approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@orbanszlrd @skirtles-code @NataliaTepluhina