Fixed footnote backref target offsets regression

This commit is contained in:
squidfunk 2017-11-22 20:20:35 +01:00 committed by Martin Donath
parent f6c0ea670e
commit 6cabf6d457
3 changed files with 36 additions and 29 deletions

View File

@ -46,7 +46,7 @@
{% endif %}
{% endblock %}
{% block styles %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application.fc485aed.css">
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application.5d3fffba.css">
{% if palette.primary or palette.accent %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-palette.fbd935c7.css">
{% endif %}

View File

@ -27,20 +27,34 @@
// Scoped in typesetted content to match specificity of regular content
.md-typeset {
// All footnote references or back references
[id^="fn:"],
// All footnote references
[id^="fnref:"] {
display: inline-block;
// Targeted anchor
&:target {
margin-top: -(4.8rem + 2.4rem + 1.6rem);
padding-top: (4.8rem + 2.4rem + 1.6rem);
pointer-events: none;
}
}
// All footnote back references
[id^="fn:"] {
// Add spacing to anchor for offset
&::before {
display: inline-block;
display: none;
height: 0;
content: "";
}
// Targeted anchor
&:target::before {
margin-top: -(4.8rem + 2.4rem + 1.8rem);
padding-top: (4.8rem + 2.4rem + 1.8rem);
display: block;
margin-top: -(4.8rem + 2.4rem + 1rem);
padding-top: (4.8rem + 2.4rem + 1rem);
pointer-events: none;
}
}
@ -58,24 +72,11 @@
li {
transition: color 0.25s;
// Un-targeted footnote
&::before {
display: block;
height: 0;
}
// Darken color for targeted footnote
&:target {
color: $md-color-black;
}
// Targeted footnote
&:target::before {
margin-top: -(4.8rem + 2.4rem + 1rem);
padding-top: (4.8rem + 2.4rem + 1rem);
pointer-events: none;
}
// Remove spacing on first element
:first-child {
margin-top: 0;
@ -96,14 +97,20 @@
}
}
// Render a thin line before footnote
.footnote-ref::before {
display: inline;
margin: 0 0.2em;
border-left: 0.1rem solid $md-color-black--lighter;
font-size: 1.25em;
content: "";
vertical-align: -0.5rem;
// Footnote reference
.footnote-ref {
display: inline-block;
pointer-events: initial;
// Render a thin line before footnote
&::before {
display: inline;
margin: 0 0.2em;
border-left: 0.1rem solid $md-color-black--lighter;
font-size: 1.25em;
content: "";
vertical-align: -0.5rem;
}
}
// Footnote back reference