timeline

_config.yml

@@ -184,7 +184,7 @@ plugins:
 
   # https://scrollrevealjs.org/api/reveal.html
   scrollreveal:
-    enable: true
+    enable: #true
     js: https://cdn.jsdelivr.net/npm/scrollreveal@4.0.9/dist/scrollreveal.min.js
     distance: 8px
     duration: 500 # ms

source/css/_defines/func.styl

@@ -32,6 +32,12 @@ trans3($op1, $op2, $op3)
   -webkit-transition: $op1 0.2s ease-out, $op2 0.2s ease-out, $op3 0.2s ease-out
   -o-transition: $op1 0.2s ease-out, $op2 0.2s ease-out, $op3 0.2s ease-out
 
+trans4($op1, $op2, $op3, $op4)
+  transition: $op1 0.2s ease-out, $op2 0.2s ease-out, $op3 0.2s ease-out, $op4 0.2s ease-out
+  -moz-transition: $op1 0.2s ease-out, $op2 0.2s ease-out, $op3 0.2s ease-out, $op4 0.2s ease-out
+  -webkit-transition: $op1 0.2s ease-out, $op2 0.2s ease-out, $op3 0.2s ease-out, $op4 0.2s ease-out
+  -o-transition: $op1 0.2s ease-out, $op2 0.2s ease-out, $op3 0.2s ease-out, $op4 0.2s ease-out
+
 txt-ellipsis()
   white-space: nowrap
   overflow: hidden

source/css/_layout/tag-plugins/timeline.styl

@@ -32,6 +32,7 @@
       background: $color-theme
       height: 16px
       top: 'calc(50% - 0.5 * %s)' % @height
+      transform: scale(1)
 
 .tag-plugin.timeline .header
   display: flex
@@ -43,6 +44,7 @@
     font-weight: 700
     color: var(--text-p3)
     font-family: $ff-code
+    trans1 color
     a
       color: inherit
       font-weight: inherit
@@ -54,8 +56,9 @@
     border-radius: 12px
     height: 4px
     top: 'calc(50% - 0.5 * %s)' % @height
-    background: var(--text-p4)
-    trans3 background height top
+    background: var(--text-meta)
+    trans4 background height top transform
+    transform: scale(2)
 
 
 .tag-plugin.timeline .body