feat: add cron cheatsheet.

scripts/build.mjs

@@ -1,43 +1,3 @@
-import fs from 'fs-extra';
-import path from 'path';
-import recursiveReaddirFiles from 'recursive-readdir-files';
-import { create } from './create.mjs';
+import { run } from './index.mjs';
 
-const OUTOUT = path.resolve(process.cwd(), 'dist');
-const DOCS = path.resolve(process.cwd(), 'docs');
-const CSSPATH = path.resolve(process.cwd(), 'scripts/style.css');
-const CSS_OUTPUT_PATH = path.resolve(OUTOUT, 'style/style.css');
-
-async function createHTML(files = [], num = 0) {
-  const dataFile = files[num];
-  if (!dataFile) {
-    console.log('\ndone!')
-    return;
-  }
-  ++num;
-  
-  const mdstr = await fs.readFile(dataFile.path);
-  const htmlPath = path.relative(DOCS, dataFile.path);
-  const outputHTMLPath = path.resolve(OUTOUT, 'docs', htmlPath).replace(/README.md$/i, 'index.html').replace(/.md$/, '.html');
-
-  await fs.ensureDir(path.dirname(outputHTMLPath));
-  const html = create(mdstr.toString(), {
-    css: [path.relative(path.dirname(outputHTMLPath), CSS_OUTPUT_PATH)]
-  });
-  await fs.writeFile(outputHTMLPath, html);
-  console.log(`♻️ \x1b[32;1m ${path.relative(OUTOUT, outputHTMLPath)} \x1b[0m`)
-  createHTML(files, num)
-}
-
-;(async () => {
-  await fs.ensureDir(OUTOUT);
-  await fs.emptyDir(OUTOUT);
-  await fs.ensureDir(path.dirname(CSS_OUTPUT_PATH));
-  await fs.copyFile(CSSPATH, CSS_OUTPUT_PATH)
-  const files = await recursiveReaddirFiles(process.cwd(), {
-    ignored: /\/(node_modules|\.git)/,
-    exclude: /(\.json|mjs)$/,
-    filter: (item) => item.ext === 'md',
-  });
-  createHTML(files);
-})();
+run()

scripts/create.mjs

@@ -3,6 +3,7 @@ import rehypeDocument from 'rehype-document';
 import rehypeFormat from 'rehype-format';
 import { rehypeUrls } from './nodes/rehypeUrls.mjs';
 import { htmlTagAddAttri } from './nodes/htmlTagAddAttri.mjs';
+import { footer } from './nodes/footer.mjs';
 
 /** 标记 Number */
 function panelAddNumber(arr = [], result = []) {
@@ -61,10 +62,10 @@ export function getTocsTree(arr = [], result = []) {
 
       if (level === 1) warpCls.push('max-container');
       const warpStyle = toc.properties['data-warp-style'];
-      const bodyStyle = toc.properties['data-body-style'];
       delete toc.properties['data-warp-style']
-      delete toc.properties['data-body-style']
-
+      const warpClass = toc.properties['warp-class'];
+      if (warpClass) warpCls.push(warpClass);
+      delete toc.properties['warp-class'];
       const panle = {
         type: 'element',
         tagName: 'div',
@@ -91,10 +92,15 @@ export function getTocsTree(arr = [], result = []) {
       const childs = getChilds([...data.slice(n + 1)], level);
       const resultChilds = getTocsTree(childs);
       if (resultChilds.length > 0) {
+        const bodyStyle = toc.properties['data-body-style'];
+        delete toc.properties['data-body-style']
+
+        const bodyClass = toc.properties['body-class'];
+        delete toc.properties['body-class']
         panle.children = panle.children.concat({
           type: 'element',
           tagName: 'div',
-          properties: { class: `h${level}warp-body`, style: bodyStyle },
+          properties: { class: [`h${level}warp-body`, bodyClass], style: bodyStyle },
           children: [...resultChilds]
         });
       }
@@ -126,6 +132,7 @@ export function create(str = '', options = {}) {
       rehypeUrls(node);
       if (node.type === 'element' && node.tagName === 'body') {
         node.children = getTocsTree([ ...node.children ]);
+        node.children.push(footer());
       }
     }
   }

scripts/index.mjs

@@ -0,0 +1,43 @@
+import fs from 'fs-extra';
+import path from 'path';
+import recursiveReaddirFiles from 'recursive-readdir-files';
+import { create } from './create.mjs';
+
+const OUTOUT = path.resolve(process.cwd(), 'dist');
+const DOCS = path.resolve(process.cwd(), 'docs');
+const CSSPATH = path.resolve(process.cwd(), 'scripts/style.css');
+const CSS_OUTPUT_PATH = path.resolve(OUTOUT, 'style/style.css');
+
+async function createHTML(files = [], num = 0) {
+  const dataFile = files[num];
+  if (!dataFile) {
+    console.log('\ndone!')
+    return;
+  }
+  ++num;
+  
+  const mdstr = await fs.readFile(dataFile.path);
+  const htmlPath = path.relative(DOCS, dataFile.path);
+  const outputHTMLPath = path.resolve(OUTOUT, 'docs', htmlPath).replace(/README.md$/i, 'index.html').replace(/.md$/, '.html');
+
+  await fs.ensureDir(path.dirname(outputHTMLPath));
+  const html = create(mdstr.toString(), {
+    css: [path.relative(path.dirname(outputHTMLPath), CSS_OUTPUT_PATH)]
+  });
+  await fs.writeFile(outputHTMLPath, html);
+  console.log(`♻️ \x1b[32;1m ${path.relative(OUTOUT, outputHTMLPath)} \x1b[0m`)
+  createHTML(files, num)
+}
+
+export async function run() {
+  await fs.ensureDir(OUTOUT);
+  await fs.emptyDir(OUTOUT);
+  await fs.ensureDir(path.dirname(CSS_OUTPUT_PATH));
+  await fs.copyFile(CSSPATH, CSS_OUTPUT_PATH)
+  const files = await recursiveReaddirFiles(process.cwd(), {
+    ignored: /\/(node_modules|\.git)/,
+    exclude: /(\.json|mjs)$/,
+    filter: (item) => item.ext === 'md',
+  });
+  createHTML(files);
+}

scripts/nodes/footer.mjs

@@ -0,0 +1,22 @@
+
+export function footer() {
+  return {
+    type: 'element',
+    tagName: 'footer',
+    properties: {
+      class: 'footer-warp',
+    },
+    children: [
+      {
+        type: 'element',
+        tagName: 'footer',
+        properties: {
+          class: ['max-container'],
+        },
+        children: [
+          { type: 'text', value: '© 2022 Kenny Wang, All rights reserved.' }
+        ],
+      }
+    ],
+  };
+}

scripts/style.css

@@ -288,6 +288,13 @@ pre {
   overflow-x: auto;
 }
 
+.cols-2 {
+  grid-template-columns: repeat(2,minmax(0,1fr));
+}
+.col-span-2 {
+  grid-column: span 2/span 2;
+}
+
 [data-color-mode*='light'], [data-color-mode*='light'] body {
   --color-prettylights-syntax-comment: #6e7781;
   --color-prettylights-syntax-constant: #0550ae;
@@ -447,4 +454,11 @@ pre {
 .token.italic { font-style: italic; }
 .token.entity { cursor: help; }
 
-/* 代码高亮 End */
+/* 代码高亮 End */
+
+
+.footer-warp {
+  margin-top: 3.5rem;
+  color: rgb(100 116 139/1);
+  background-color: rgb(30 41 59/1);
+}