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.

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

Add anchor indicator #33

Closed
renintw opened this issue May 30, 2022 Discussed in #26 · 4 comments · Fixed by #46
Closed

Add anchor indicator #33

renintw opened this issue May 30, 2022 Discussed in #26 · 4 comments · Fixed by #46
Assignees
@iandunn
Labels
ui

Comments

@renintw
Copy link
Contributor

renintw commented May 30, 2022

Discussed in #26

Originally posted by iandunn May 28, 2022
Our pages already have anchors for deep-linking to sections, but it's helpful to show a visual indicator of that.

Example: https://api.slack.com/reference/surfaces/formatting#escaping

Screen Shot 2022-05-27 at 1 20 16 PM
@renintw renintw added the ui label May 30, 2022
@iandunn iandunn self-assigned this May 30, 2022
@ryelle
Copy link
Contributor

ryelle commented May 31, 2022

FYI, there's already a pattern for this on the handbooks, if you hover or focus over a heading you can see a link icon:

Screen Shot 2022-05-31 at 12 20 53 PM

See https://meta.trac.wordpress.org/ticket/6171

@iandunn
Copy link
Member

iandunn commented May 31, 2022

Nice, thanks!

bazza pushed a commit to WordPress/wordpress.org that referenced this issue May 31, 2022
@iandunn
Developer: Use modern clearfix to restore heading anchor image.
d90623f 
Using `overflow: auto` as a clearfix prevented the `.toc-heading a` Dashicon from showing up on hover. 

This also replaces the various `padding-left` values with a single value that works across all breakpoints, to ensure that there's enough room for the icon.

See WordPress/wporg-developer#33



git-svn-id: https://meta.svn.wordpress.org/sites/trunk@11901 74240141-8908-4e6f-9713-ba540dce6ec7
@iandunn
Copy link
Member

iandunn commented May 31, 2022

I made WordPress/wordpress.org@d90623f on the production theme, since it fixes a bug there. I'll backport it to this repo, and then add any experimental stuff.

iandunn added a commit that referenced this issue May 31, 2022
@iandunn
Backport indicator bug fix
d7bc654 
See https://meta.trac.wordpress.org/changeset/11901/
See #33
@iandunn iandunn mentioned this issue May 31, 2022
Merged
@joyously
Copy link

joyously commented Jun 9, 2022

As mentioned on Slack on June 2, the fix caused other problems with the Table of Contents, which are still present.
code-ref

Today I noticed also that a heading with a link gets split into two a tags which both have a negative margin for the link icon, so the text overlaps. See https://developer.wordpress.org/reference/classes/wp_rewrite/ for an example.
WP_Rewrite Class WordPress Developer Resources-27

bazza pushed a commit to WordPress/wordpress.org that referenced this issue Jun 9, 2022
@iandunn
Developer: Remove unintended layout wrapping.
9c9bed9 
Introduced in r11901

See https://wordpress.slack.com/archives/C02QB8GMM/p1654203529934789
See WordPress/wporg-developer#33 (comment)
Props joyously, dd32


git-svn-id: https://meta.svn.wordpress.org/sites/trunk@11910 74240141-8908-4e6f-9713-ba540dce6ec7
bazza pushed a commit to WordPress/wordpress.org that referenced this issue Jun 9, 2022
@iandunn
Handbooks: Increase target specificity to prevent overlap.
8add3d7 
See WordPress/wporg-developer#33 (comment)
Props joyously


git-svn-id: https://meta.svn.wordpress.org/sites/trunk@11911 74240141-8908-4e6f-9713-ba540dce6ec7
johnolson2219 pushed a commit to johnolson2219/dev_wpMed that referenced this issue Aug 26, 2023
Backport indicator bug fix
72d7341 
See https://meta.trac.wordpress.org/changeset/11901/
See WordPress/wporg-developer#33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@iandunn iandunn

Labels
ui
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Always show heading link indicator WordPress/wporg-developer
4 participants
@iandunn @ryelle @joyously @renintw