Remove visual highlight for anchored method links #1363
Conversation
| @@ -581,7 +581,6 @@ main .method-detail { | |||
|
|
|||
| main .method-detail:target { | |||
| margin-left: -10px; | |||
| border-left: 10px solid var(--border-color); | |||
There was a problem hiding this comment.
The value margin-left: -10px should be "-#{border_left_width}px". If border-left is 0, margin-left should also be 0.
However, this border-left is a highlight of the focused method. Could you suggest a better highlight instead of completely removing it?
There was a problem hiding this comment.
Ah, that makes sense now. Given that the anchor link reliably brings the method to the top of the viewport, I think we could remove both border-left and margin-left.
The method name is easy to spot without extra highlighting. It will look like this if we remove both the border and margin:
CleanShot.2025-05-07.at.23.29.28.mp4
There was a problem hiding this comment.
This is one of the features of RDoc. I don't want to remove it as possible if it is fixable.
This border-left exists in other links to heading tags, not only to method links.
Differences are:
Border-left to method links are applied to the whole div.method-detail content while border-left to other links are only applied to heading tags.
How about changing the border-left target to heading of the method detail?
It will be more consistent between method links and other links to heading tags.
- main .method-detail:target {
+ main .method-detail:target .method-heading {
Since the anchor link always brings people to the top of the page. I think it’s okay to remove both border-left and margin-left which was acting as highlight here. The method name should be easy to spot without extra highlighting.
JuanitoFatas
force-pushed
the
remove-border-left-from-method-details
branch
from
1033728 to
e6fd1f8
Compare
JuanitoFatas
changed the title
|
In SDoc we show a small highlight next to the method as well: |
It feels a bit awkward with the scroll bar on the left 😅 E.g. Process#kill. This PR removes the visual highlight for anchored method links.