feat: update darkmode support

lib/_variables.scss

@@ -3,6 +3,9 @@
 
 // 定义赫蹏根 class 名
 $root-selector: '.heti' !default;
+$darkmode: true !default; // true | false | 'manual'
+$manualmode-auto-selector: '[data-darkmode="auto"] &' !default;
+$manualmode-dark-selector: '[data-darkmode="dark"] &' !default;
 
 // 字体 Fonts
 // 字体栈 Font Stacks
@@ -114,6 +117,25 @@ $_css-reset-scheme: "reset";
   text-indent: 0;
 }
 
+@mixin darkmode-style($darkmode: $darkmode, $dark-selector: $manualmode-dark-selector, $auto-selector: $manualmode-auto-selector) {
+  // 'manual' darkmode should provide darkmode selector and auto-darkmode selector
+  @if $darkmode == 'manual' {
+    #{$dark-selector} {
+      @content;
+    }
+
+    @media (prefers-color-scheme: dark) {
+      #{$auto-selector} {
+        @content;
+      }
+    }
+  } @else if $darkmode {
+    @media (prefers-color-scheme: dark) {
+      @content;
+    }
+  }
+}
+
 // 函数 Functions
 // Function: batch prefix/suffix list-item
 // batch-fix-list((2, 3), '#{$root-selector}--columns-') => (.heti--columns-2, .heti--columns-3)