Skip to content

Commit

Permalink
Shrink heading anchor links to 1em, fixes links in headings
Browse files Browse the repository at this point in the history
In readonly mode, the heading anchor links spanned the whole width so
far, overlaying potential links in headings.

Fixes: #3822

Signed-off-by: Jonas <jonas@freesources.org>
  • Loading branch information
mejo- committed Feb 28, 2023
1 parent bf6c6bb commit fc802d0
Showing 1 changed file with 2 additions and 9 deletions.
11 changes: 2 additions & 9 deletions src/nodes/Heading/HeadingView.vue
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,8 @@ div.ProseMirror {
h1,h2,h3,h4,h5,h6 {
position: relative;
.heading-anchor[contenteditable="false"] {
// Shrink clickable area of anchor permalinks to not overlay the heading
width: 1em;
opacity: 0;
padding: 0;
left: -1em;
Expand All @@ -110,14 +112,5 @@ div.ProseMirror {
outline: none;
}
}
// Shrink clickable area of anchor permalinks while editing
&[contenteditable="true"] {
h1,h2,h3,h4,h5,h6 {
.heading-anchor {
width: 1em;
}
}
}
}
</style>

0 comments on commit fc802d0

Please sign in to comment.