feat: 新增標籤外掛 timeline closed #644

fix: 自建頁面圖片沒有 blur 效果
improvement: 優化 404 頁面 UI
improvement: lazyload 默認佔位圖改為透明圖片
improvement: 優化 lazyload blur 出現特效
improvement: 優化 css

source/css/_layout/aside.styl

@@ -130,13 +130,7 @@
         height: w
 
         & > img
-          width: 100%
-          height: 100%
-          transition: all .6s
-          object-fit: cover
-
-          &:hover
-            transform: scale(1.1)
+          @extend .imgHover
 
       .content
         flex: 1
@@ -253,6 +247,7 @@
       width: $toc-mobile-width
       opacity: 0
       transform-origin: right bottom
+      transition: none
 
     .toc-percentage
       float: right
@@ -323,7 +318,7 @@
 
   img
     height: 100%
-    transition: all .5s
+    transition: filter 375ms ease-in 0.2s, transform .3s
     object-fit: cover
 
     &:hover

source/css/_layout/footer.styl

@@ -1,7 +1,7 @@
 #footer
   position: relative
   background: $light-blue
-  background-attachment: local
+  background-attachment: scroll
   background-position: bottom
   background-size: cover
 

source/css/_layout/pagination.styl

@@ -8,15 +8,6 @@
       background: $theme-paginator-color
       color: var(--white)
 
-  img.prev-cover,
-  img.next-cover
-    position: absolute
-    width: 100%
-    height: 100%
-    opacity: .4
-    transition: all .6s
-    object-fit: cover
-
   .pagination-info
     position: absolute
     top: 50%
@@ -45,6 +36,7 @@
 
   .prev-post,
   .next-post
+    @extend .postImgHover
     width: 50%
 
     +maxWidth768()
@@ -56,12 +48,6 @@
       overflow: hidden
       height: 150px
 
-    &:hover
-      img.prev-cover,
-      img.next-cover
-        opacity: .8
-        transform: scale(1.1)
-
   &.pagination-post
     overflow: hidden
     margin-top: 40px

source/css/_layout/post.styl

@@ -108,7 +108,7 @@ beautify()
 
       &:hover
         &:before
-          border-color: $pseudo-hover
+          border-color: var(--pseudo-hover)
 
       &:before
         $w = .42em
@@ -152,6 +152,7 @@ no-beautify()
     display: block
     margin: 0 auto 20px
     max-width: 100%
+    transition: filter 375ms ease-in 0.2s
 
   p
     margin: 0 0 16px

source/css/_layout/relatedposts.styl

@@ -16,11 +16,7 @@
       height: 200px
       background: $dark-black
       vertical-align: bottom
-
-      &:hover
-        .cover
-          opacity: .8
-          transform: scale(1.1)
+      @extend .postImgHover
 
       +maxWidth768()
         margin: 2px
@@ -30,13 +26,6 @@
       +maxWidth600()
         width: calc(100% - 4px)
 
-    .cover
-      width: 100%
-      height: 100%
-      opacity: .4
-      transition: all .6s
-      object-fit: cover
-
     .content
       position: absolute
       top: 50%