.toc { padding-bottom: 5px; border-bottom: 2px solid $dark; a { color: $dark; text-decoration: underline; } } .frontmatter { padding: 15px 0; border-bottom: 2px solid $dark; a { color: $dark; text-decoration: none; background-image: linear-gradient(120deg,$gradient-left 0%,$gradient-right 100%); background-repeat: no-repeat; background-size: 0 0; background-position: 100% 21%; transition: .15s ease-out; &:hover { background-size: 100% 100%; color: $light; &:after { color: $gradient-right; } } &::after { position: relative; content: "\FEFF°"; margin-left: 0.10em; font-size: 90%; top: -0.10em; color: $light-highlight; font-feature-settings: "caps"; font-variant-numeric: normal; } } .post-title { margin: 10px 0; a { text-decoration: none; background-image: none; &::after { content: ""; } &:hover { background-size: 0 0; color: $dark; } } } p { margin: 0 0; } } .content { h2, h3 { margin-top: 20px; margin-bottom: -10px; } h2, h3, p, li, td { a { color: $dark; text-decoration: none; background-image: linear-gradient(120deg,$gradient-left 0%,$gradient-right 100%); background-repeat: no-repeat; background-size: 0 0; background-position: 100% 21%; transition: .15s ease-out; &:hover { background-size: 100% 100%; color: $light; &:after { color: $gradient-right; } } &::after { position: relative; content: "\FEFF°"; margin-left: 0.10em; font-size: 90%; top: -0.10em; color: $light-highlight; font-feature-settings: "caps"; font-variant-numeric: normal; } } } .footnote-ref { background-size: 100% 1.5px; background-position: 0 90%; &::after { content: ""; } &:hover { background-size: 100% 100%; color: $light; } } .footnote-backref { background-size: 100% 1.5px; background-position: 0 90%; &::after { content: ""; } &:hover { background-size: 100% 100%; color: $light; } } .highlight { a { background-image: none; &::after { content: ""; } } } .anchor-tag { font-size: 70%; margin-left: 7px; background-size: 100% 0; background-position: 0 150%; &::after { content: ""; } } }