From 75b825cddec31cb9fe98b04b937927bf6384e4b4 Mon Sep 17 00:00:00 2001
From: Cotes Chung <11371340+cotes2020@users.noreply.github.com>
Date: Sun, 24 Nov 2019 22:08:17 +0800
Subject: [PATCH] Add animation to ToC.

---
 _includes/head.html  |  4 ++--
 assets/css/main.scss |  1 +
 assets/css/post.scss | 14 ++++++++++++++
 3 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/_includes/head.html b/_includes/head.html
index b5609c1..dc80e12 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -84,8 +84,8 @@
     <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/post.css">
     {% if site.toc and page.toc %}
       <link rel="stylesheet" href="{{ site.baseurl }}/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.css" />
-      <script src="{{ site.baseurl }}/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.js"></script>
-      <script src="{{ site.baseurl }}/assets/js/dist/toc.min.js"></script>
+      <script src="{{ site.baseurl }}/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.js" async></script>
+      <script src="{{ site.baseurl }}/assets/js/dist/toc.min.js" async></script>
     {% endif %}
   {% endif %}
 
diff --git a/assets/css/main.scss b/assets/css/main.scss
index 2a3dfa9..9ec8c9d 100644
--- a/assets/css/main.scss
+++ b/assets/css/main.scss
@@ -404,6 +404,7 @@ footer .license a {
 
 
 /*--- Panels ---*/
+
 .access {
   top: 2rem;
   transition: top 0.2s ease-in-out;
diff --git a/assets/css/post.scss b/assets/css/post.scss
index 0f60a49..9c4a41c 100644
--- a/assets/css/post.scss
+++ b/assets/css/post.scss
@@ -7,12 +7,26 @@
   MIT License
 */
 
+@keyframes fade-up {
+  from {
+    opacity: 0;
+    position: relative;
+    top: 2rem;
+  }
+  to {
+    opacity: 1;
+    position: relative;
+    top: 0;
+  }
+}
+
 #toc-wrap {
   border-left: 1px solid rgba(158, 158, 158, 0.17);
   position: -webkit-sticky;
   position: sticky;
   top: 2rem;
   transition: top 0.2s ease-in-out;
+  animation: fade-up .8s;
 }
 
 #toc-wrap.topbar-down {