OpenSourceArk/mkdocs-material
1
0
Fork 0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-06-14 11:52:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

Finished footnotes integration

Browse Source
This commit is contained in:
squidfunk 2016-10-30 11:02:18 +01:00
parent 8cac945757
commit f1af230918
2 changed files with 60 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/assets/stylesheets/extensions/_codehilite.scss
View File

@ -105,12 +105,11 @@ $codehilite-error: #A61717;
$codehilite-whitespace: transparent; $codehilite-whitespace: transparent;
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
// Rules // Rules: syntax highlighting
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
// Codehilite extension // Codehilite extension
.codehilite, .codehilite {
.code {
// Operators // Operators
.o { color: $codehilite-operator; } .o { color: $codehilite-operator; }
@ -207,6 +206,10 @@ $codehilite-whitespace: transparent;
} }
} }
// ----------------------------------------------------------------------------
// Rules: layout
// ----------------------------------------------------------------------------
// Scoped in typesetted content for greater specificity // Scoped in typesetted content for greater specificity
.md-typeset { .md-typeset {

112
src/assets/stylesheets/extensions/_footnotes.scss
View File

@ -24,72 +24,68 @@
// Rules // Rules
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
// Footnotes extension // Scoped in typesetted content for greater specificity
.footnote { .md-typeset {
color: $md-color-black--light;
font-size: 80%;
// Remove additional spacing on footnotes // Footnotes extension
ol { .footnote {
margin-left: 0; color: $md-color-black--light;
} font-size: 80%;
// Single footnote // Remove additional spacing on footnotes
li { ol {
margin-left: 0;
// TODO: this doesn't work entirely
// &::before {
// display: block;
// content: "";
// padding-top: (5.6rem + 2.4rem + 0.4rem);
// margin-top: -(5.6rem + 2.4rem + 0.4rem);
// }
// Make back references visible on hover
&:hover .footnote-backref,
&:target .footnote-backref {
transform: translateX(0);
opacity: 1;
} }
// Active or targeted back reference // Single footnote
&:hover .footnote-backref:hover, li {
&:target .footnote-backref {
color: $md-color-accent;
}
}
// Correct anchor offset // Make back references visible on hover
&-ref::before { &:hover .footnote-backref,
position: absolute; &:target .footnote-backref {
margin-top: -(5.6rem + 2.4rem); transform: translateX(0);
padding-top: (5.6rem + 2.4rem); opacity: 1;
content: ""; }
pointer-events: none;
}
// Make back reference text transparent for icon // Active or targeted back reference
&-backref { &:hover .footnote-backref:hover,
@extend %md-icon; &:target .footnote-backref {
color: $md-color-accent;
position: absolute; }
transform: translateX(0.5rem);
transition: transform 0.25s 0.125s,
color 0.25s,
opacity 0.125s 0.125s;
color: $md-color-black--lighter;
font-size: 2.0rem;
opacity: 0;
vertical-align: middle;
// Hack: remove Unicode arrow for icon
&::first-letter {
font-size: 0;
} }
// Back reference icon // Correct anchor offset
&::after { &-ref::before {
content: "keyboard_return"; position: absolute;
margin-top: -(5.6rem + 2.4rem);
padding-top: (5.6rem + 2.4rem);
content: "";
pointer-events: none;
}
// Make back reference text transparent for icon
&-backref {
@extend %md-icon;
position: absolute;
transform: translateX(0.5rem);
transition: transform 0.25s 0.125s,
color 0.25s,
opacity 0.125s 0.125s;
color: $md-color-black--lighter;
font-size: 2.0rem;
opacity: 0;
vertical-align: middle;
// Hack: remove Unicode arrow for icon
&::first-letter {
font-size: 0;
}
// Back reference icon
&::after {
content: "keyboard_return";
}
} }
} }
} }