diff --git a/_includes/toc.html b/_includes/toc.html index 0f877267b39..888466d275b 100644 --- a/_includes/toc.html +++ b/_includes/toc.html @@ -3,7 +3,7 @@ {% if enable_toc %}
{% endif %} diff --git a/_javascript/modules/components/mermaid.js b/_javascript/modules/components/mermaid.js index 2b4759f4726..91df4f25497 100644 --- a/_javascript/modules/components/mermaid.js +++ b/_javascript/modules/components/mermaid.js @@ -11,7 +11,7 @@ function refreshTheme(event) { const mermaidList = document.getElementsByClassName(MERMAID); [...mermaidList].forEach((elem) => { - const svgCode = elem.previousSibling.children.item(0).innerHTML; + const svgCode = elem.previousSibling.children.item(0).textContent; elem.textContent = svgCode; elem.removeAttribute('data-processed'); }); diff --git a/_sass/pages/_post.scss b/_sass/pages/_post.scss index 9348c5669f8..9b8fa7e6d75 100644 --- a/_sass/pages/_post.scss +++ b/_sass/pages/_post.scss @@ -220,14 +220,11 @@ header { @-webkit-keyframes fade-up { from { opacity: 0; - position: relative; - top: 2rem; + margin-top: 4rem; } to { opacity: 1; - position: relative; - top: 0; } } @@ -247,6 +244,7 @@ header { %top-cover { content: ''; display: block; + position: -webkit-sticky; position: sticky; top: 0; width: 100%; @@ -257,13 +255,16 @@ header { #toc-wrapper { top: 0; transition: top 0.2s ease-in-out; - -webkit-animation: fade-up 0.8s; - animation: fade-up 0.8s; overflow-y: auto; max-height: 100vh; scrollbar-width: none; margin-top: 2rem; + &:not(.invisible) { + -webkit-animation: fade-up 0.8s; + animation: fade-up 0.8s; + } + ul { list-style: none; font-size: 0.85rem; @@ -275,10 +276,6 @@ header { margin: 0.4rem 0; } - &:first-child { - margin-top: 0; - } - a { padding: 0.2rem 0 0.2rem 1.25rem; }