line links in s
This commit is contained in:
+35
-12
@@ -7350,6 +7350,19 @@ dialog::backdrop {
|
||||
scroll-margin-top: 88px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Line linking is opt-in on published notes. When regular line numbers are
|
||||
* hidden, enabling links restores the same gutter so link targets stay inside
|
||||
* the document instead of protruding past its left edge.
|
||||
*/
|
||||
.public-page .public-content {
|
||||
transition: padding-left .18s ease;
|
||||
}
|
||||
|
||||
.public-page.hide-preview-line-numbers.line-links-enabled .public-content {
|
||||
padding-left: clamp(24px, 4vw, 52px);
|
||||
}
|
||||
|
||||
/*
|
||||
* The permalink occupies the same gutter slot as the regular source number.
|
||||
* It stays invisible until the row is approached, then behaves like the
|
||||
@@ -7360,7 +7373,7 @@ dialog::backdrop {
|
||||
top: 0;
|
||||
left: var(--preview-line-left, -50px);
|
||||
z-index: 3;
|
||||
display: block;
|
||||
display: none;
|
||||
width: 32px;
|
||||
height: 1.32em;
|
||||
padding: 0 2px 0 0;
|
||||
@@ -7378,30 +7391,34 @@ dialog::backdrop {
|
||||
transition: opacity .14s ease, transform .14s ease, background-color .14s ease, color .14s ease;
|
||||
}
|
||||
|
||||
.public-content .preview-source-line::before {
|
||||
.public-page.line-links-enabled .public-content .public-permalink {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.public-page.line-links-enabled .public-content .preview-source-line::before {
|
||||
transition: opacity .1s ease;
|
||||
}
|
||||
|
||||
.public-content .preview-source-line:hover::before,
|
||||
.public-content .preview-source-line:focus-within::before {
|
||||
.public-page.line-links-enabled .public-content .preview-source-line:hover::before,
|
||||
.public-page.line-links-enabled .public-content .preview-source-line:focus-within::before {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.public-content .preview-source-line:hover > .public-permalink,
|
||||
.public-content .preview-source-line:focus-within > .public-permalink,
|
||||
.public-content .public-permalink:focus-visible {
|
||||
.public-page.line-links-enabled .public-content .preview-source-line:hover > .public-permalink,
|
||||
.public-page.line-links-enabled .public-content .preview-source-line:focus-within > .public-permalink,
|
||||
.public-page.line-links-enabled .public-content .public-permalink:focus-visible {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.public-content .public-permalink:hover,
|
||||
.public-content .public-permalink:focus-visible {
|
||||
.public-page.line-links-enabled .public-content .public-permalink:hover,
|
||||
.public-page.line-links-enabled .public-content .public-permalink:focus-visible {
|
||||
background: color-mix(in srgb, var(--accent) 14%, transparent);
|
||||
color: var(--text);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.public-content .public-permalink.is-copied {
|
||||
.public-page.line-links-enabled .public-content .public-permalink.is-copied {
|
||||
background: color-mix(in srgb, var(--success) 18%, transparent);
|
||||
color: var(--text);
|
||||
opacity: 1;
|
||||
@@ -7415,16 +7432,22 @@ dialog::backdrop {
|
||||
}
|
||||
|
||||
@media (hover: none), (pointer: coarse) {
|
||||
.public-content .public-permalink {
|
||||
.public-page.line-links-enabled .public-content .public-permalink {
|
||||
opacity: .62;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.public-content .preview-source-line::before {
|
||||
.public-page.line-links-enabled .public-content .preview-source-line::before {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.public-page .public-content {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Per-user, per-note navigation-bar focus mode ---------------------------- */
|
||||
.pad-page .navbar-collapse-toggle {
|
||||
position: fixed;
|
||||
|
||||
Reference in New Issue
Block a user