feat: add TypeIt and CountDown

assets/css/_common/_page/post.scss

@@ -38,7 +38,7 @@
     }
 
     .post-content {
-        padding-top: 2rem;
+        padding-top: 1rem;
 
         h2,
         h3,
@@ -150,8 +150,6 @@
             overflow: hidden;
         }
 
-     
-
         img[data-action="zoom"] {
             cursor: zoom-in;
         }
@@ -162,6 +160,42 @@
             height: auto !important;
             margin: 0 !important;
         }
+
+        div.code {
+          padding: 6px;
+          font-size: 14px;
+          font-family: Consolas, Monaco, Menlo, Consolas, monospace;
+          font-weight:bold;
+          word-break: break-all;
+
+          .code-key {
+            color: #D371E3;
+          }
+
+          .code-cvar {
+            color: #ECBF6F;
+          }
+
+          .code-var {
+            color: #F16473;
+          }
+
+          .code-func {
+            color: #41B1F5;
+          }
+
+          .code-str {
+            color: #8BC56F;
+          }
+
+          .code-num {
+            color: #DB975C;
+          }
+
+          .code-comm {
+            color: #7E848F;
+          }
+        }
     }
 
     p {
@@ -177,7 +211,7 @@
         .copyright-item {
             margin: 5px 0;
         }
-        
+
         .dark-theme & {
             border-top: 1px solid $dark-border-color;
             border-bottom: 1px solid $dark-border-color;

assets/css/_custom.scss

@@ -1,4 +1,11 @@
 // ==============================
 // Custom style
 // ==============================
-// You can override the variables in _variables.scss to customize the style
+// You can override the variables in _variables.scss to customize the style
+
+.since {
+  padding: 30px;
+  text-align:center;
+  font-size: 30px;
+  line-height: 50px;
+}

assets/js/main.js

@@ -9,6 +9,31 @@ jQuery(function($) {
         window.prettyPrint && prettyPrint();
     };
 
+    _Blog.typeit = function() {
+        if (window.typeitMap) {
+            for (let id in typeitMap) {
+                new TypeIt(id, {
+                    strings: typeitMap[id],
+                }).go();
+            }
+        }
+    };
+
+    _Blog.countdown = function() {
+        if (window.countdownMap) {
+            for (let id in countdownMap) {
+              $(id).countdown(countdownMap[id], {elapse: true})
+                .on('update.countdown', function(event) {
+                  var $this = $(this).html(event.strftime(''
+                    + '<span>%D</span> 天 <br />'
+                    + '<span>%H</span> 时 '
+                    + '<span>%M</span> 分 '
+                    + '<span>%S</span> 秒'));
+              });
+          }
+        }
+    };
+
     _Blog.externalUrl = function() {
         $.expr[':'].external = function(obj) {
             return !obj.href.match(/^mailto\:/) &&
@@ -48,9 +73,11 @@ jQuery(function($) {
     }
 
     $(document).ready(function() {
-        _Blog.prettify()
-        _Blog.changeTitle()
         _Blog.toggleTheme()
+        _Blog.prettify()
+        _Blog.countdown()
+        _Blog.changeTitle()
         _Blog.toggleMobileMenu()
+        _Blog.typeit()
     });
 });