From 5a94926837c3bd3b8e77c562886f27cdf8a91457 Mon Sep 17 00:00:00 2001
From: jaywcjlove <jaywcjlove@users.noreply.github.com>
Date: Fri, 30 Sep 2022 06:16:05 +0000
Subject: [PATCH] website: add icons for home page list.
 410c8f09da29d455a3ce6f5b132878f594bafa75

---
 index.html      | 102 ++++++++++++++++++++++++++++++++++++++----------
 style/style.css |   7 +++-
 2 files changed, 87 insertions(+), 22 deletions(-)

diff --git a/index.html b/index.html
index 5c77b20e..3fd9410d 100644
--- a/index.html
+++ b/index.html
@@ -14,36 +14,96 @@
 <p>如果您发现此处的备忘单不合适，您可以通过提交 PR 来修复它或提供更好的备忘清单，只针对【中文】用户。以下是开源天使提供的一些备忘清单和快速参考 :)。</p>
 </div></header><div class="h1wrap-body"><div class="wrap"><div class="wrap-header h2wrap"><h2>编程</h2><div class="wrap-body">
 <p class="home-card">
-  <a href="./docs/toml.html" style="background: rgb(132 132 132/var(\-\-bg\-opacity));">TOML</a><!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
-  <a href="./docs/typescript.html" style="background: rgb(49 120 198/var(\-\-bg\-opacity));">TypeScript</a><!--rehype:style=background: rgb(49 120 198/var(\-\-bg\-opacity));-->
-  <a href="./docs/javascript.html" style="background: rgb(203 183 31/var(\-\-bg\-opacity));">JavaScript</a><!--rehype:style=background: rgb(203 183 31/var(\-\-bg\-opacity));-->
-  <a href="./docs/json.html" style="background: rgb(57 59 60/var(\-\-bg\-opacity));">JSON</a><!--rehype:style=background: rgb(57 59 60/var(\-\-bg\-opacity));-->
-  <a href="./docs/markdown.html" style="background: rgb(78 57 104/var(\-\-bg\-opacity));">Markdown</a><!--rehype:style=background: rgb(78 57 104/var(\-\-bg\-opacity));-->
+  <a href="./docs/toml.html" style="background: rgb(132 132 132/var(\-\-bg\-opacity));"><svg viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" height="1em" width="1em">
+  <path fill="currentColor" d="M198.472 0v28.764h25.888v198.472h-25.888V256H256V0z"></path>
+  <path fill="currentColor" d="M64.72 83.416v-31.64h126.56v31.64h-47.46v138.067h-31.64V83.416z"></path>
+  <path fill="currentColor" d="M57.528 0v28.764H31.64v198.472h25.888V256H0V0z"></path>
+</svg>
+<span>TOML</span></a><!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
+  <a href="./docs/typescript.html" style="background: rgb(49 120 198/var(\-\-bg\-opacity));"><svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 14" height="1em" width="1em">
+  <path d="M1 7v6h12V1H1v6zm7.36-.21v.538H6.811v4.922H5.547V7.328H4V6.25h4.36v.54zm3.046-.474c.192.037.408.089.483.117l.127.051v.586c0 .324-.01.586-.02.586-.009 0-.107-.051-.22-.112-.421-.24-1.096-.328-1.509-.207a.894.894 0 0 0-.319.193c-.112.108-.135.173-.135.347 0 .187.023.239.178.384.098.094.464.31.82.487.75.37 1.13.685 1.303 1.074.155.347.16 1.078.01 1.406-.141.31-.45.624-.755.769-.647.305-1.702.333-2.527.06l-.295-.098v-1.303l.234.169c.305.22.699.356 1.111.384.413.029.717-.047.905-.225.117-.107.14-.168.14-.346 0-.343-.196-.52-1.003-.915-.712-.351-.937-.51-1.148-.82-.469-.68-.328-1.72.3-2.194.534-.407 1.42-.557 2.32-.393Z"></path>
+</svg>
+<span>TypeScript</span></a><!--rehype:style=background: rgb(49 120 198/var(\-\-bg\-opacity));-->
+  <a href="./docs/javascript.html" style="background: rgb(203 183 31/var(\-\-bg\-opacity));"><svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 14" height="1em" width="1em">
+  <path d="M1 1h12v12H1V1Zm11.017 9.138c-.087-.547-.444-1.008-1.502-1.437-.367-.172-.777-.292-.898-.57-.046-.165-.053-.255-.023-.352.075-.323.458-.42.757-.33.195.06.375.21.488.45.517-.338.517-.338.878-.563a2.08 2.08 0 0 0-.293-.39c-.315-.352-.734-.532-1.417-.516l-.352.044c-.338.082-.66.263-.855.502-.57.646-.406 1.771.284 2.236.682.51 1.68.622 1.808 1.103.12.584-.435.772-.983.704-.406-.09-.63-.293-.878-.668l-.915.526c.105.24.225.344.405.554.87.879 3.045.834 3.436-.501.014-.046.12-.353.037-.826l.023.034zM7.525 6.515H6.401c0 .97-.004 1.932-.004 2.903 0 .616.031 1.181-.069 1.355-.165.345-.59.301-.783.24-.198-.098-.298-.232-.415-.427-.032-.053-.055-.098-.064-.098l-.912.563c.152.314.375.585.662.758.427.255 1.002.338 1.603.203.392-.114.73-.346.906-.706.255-.465.201-1.035.198-1.673.006-1.027 0-2.054 0-3.09l.002-.028z"></path>
+</svg>
+<span>JavaScript</span></a><!--rehype:style=background: rgb(203 183 31/var(\-\-bg\-opacity));-->
+  <a href="./docs/json.html" style="background: rgb(57 59 60/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 32 32" height="1em" width="1em">
+  <path d="M16.057 31.958a15.416 15.416 0 0 0 1.901-.125 15.825 15.825 0 0 0 4.193-1.151 16.528 16.528 0 0 0 5.057-3.391 15.922 15.922 0 0 0 3.255-4.573c.677-1.458 1.161-3.031 1.359-4.63.198-1.547.182-3.13-.057-4.667a16.195 16.195 0 0 0-1.057-3.719 15.426 15.426 0 0 0-1.141-2.156c-1.557-2.448-3.813-4.417-6.411-5.734A17.13 17.13 0 0 0 20.26.656h-.01c.161.083.323.172.464.266.156.099.318.198.469.302.755.51 1.458 1.099 2.078 1.771 1.417 1.526 2.396 3.401 2.953 5.391.38 1.307.583 2.661.661 4.021.057.99.057 1.99-.063 2.974-.198 1.693-.74 3.344-1.635 4.792a10.012 10.012 0 0 1-2.536 2.781c-1.661 1.234-3.839 1.974-5.917 1.484a5.091 5.091 0 0 1-.995-.344 6.254 6.254 0 0 1-1.042-.599 8.116 8.116 0 0 1-1.656-1.474 8.605 8.605 0 0 1-1.401-2.328 9.76 9.76 0 0 1-.656-3.391c-.042-1.698.297-3.401 1.135-4.891a8.503 8.503 0 0 1 2.219-2.557c.302-.24.62-.443.938-.641l.021-.01a6.976 6.976 0 0 0-1.922-.156 6.564 6.564 0 0 0-1.635.318 7.701 7.701 0 0 0-1.359.599 8.041 8.041 0 0 0-.974.661c-.281.24-.563.479-.823.74-1.495 1.536-2.359 3.573-2.698 5.672-.198 1.302-.198 2.615-.12 3.938.141 1.859.521 3.714 1.26 5.411a11.348 11.348 0 0 0 1.797 2.901 10.868 10.868 0 0 0 4.177 2.974c.901.359 1.859.62 2.818.719.099.021.198.021.276.021zm-3.911-.531a5.861 5.861 0 0 1-.599-.302c-.198-.115-.401-.224-.599-.349a11.13 11.13 0 0 1-2.12-1.698c-1.458-1.516-2.438-3.422-2.995-5.443-.38-1.38-.583-2.802-.661-4.229a16.458 16.458 0 0 1 .063-2.776c.177-1.677.661-3.333 1.5-4.771a9.098 9.098 0 0 1 2.375-2.74 8.147 8.147 0 0 1 2.177-1.198 7.079 7.079 0 0 1 3.417-.359c.443.057.88.156 1.281.297.036 0 .036 0 .057.042.021.021.063.021.083.036.057.026.135.063.219.099.318.161.635.365.938.563a8.408 8.408 0 0 1 2.797 3.333c.557 1.219.818 2.583.839 3.922.021 1.438-.24 2.875-.859 4.193a8.558 8.558 0 0 1-3.516 3.776c.12.042.24.057.359.099.302.057.599.099.917.099 1.958.063 3.859-.88 5.255-2.198.26-.24.5-.5.719-.776.302-.359.583-.719.823-1.099.318-.5.578-1 .818-1.536.302-.719.536-1.458.677-2.219.26-1.339.281-2.698.198-4.036-.177-2.698-.896-5.396-2.453-7.63-.24-.339-.479-.661-.74-.958a13.11 13.11 0 0 0-1.422-1.38A10.994 10.994 0 0 0 19.876.97a12.981 12.981 0 0 0-2.255-.797L17.22.09c-.276-.042-.557-.057-.844-.078a10.636 10.636 0 0 0-1.354.021c-.938.057-1.88.214-2.813.448C7.735 1.637 3.818 4.757 1.735 8.892A15.851 15.851 0 0 0 .177 18.1c.161 1.359.5 2.698 1.036 3.969.307.76.682 1.5 1.104 2.198 1.458 2.38 3.578 4.318 6.01 5.656.917.521 1.88.917 2.875 1.26.302.099.604.198.922.276z"></path>
+</svg>
+<span>JSON</span></a><!--rehype:style=background: rgb(57 59 60/var(\-\-bg\-opacity));-->
+  <a href="./docs/markdown.html" style="background: rgb(78 57 104/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 16 16" height="1em" width="1em">
+  <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4zm11.5 1a.5.5 0 0 0-.5.5v3.793L9.854 8.146a.5.5 0 1 0-.708.708l2 2a.5.5 0 0 0 .708 0l2-2a.5.5 0 0 0-.708-.708L12 9.293V5.5a.5.5 0 0 0-.5-.5zM3.56 7.01h.056l1.428 3.239h.774l1.42-3.24h.056V11h1.073V5.001h-1.2l-1.71 3.894h-.039l-1.71-3.894H2.5V11h1.06V7.01z"></path>
+</svg><span>Markdown</span></a><!--rehype:style=background: rgb(78 57 104/var(\-\-bg\-opacity));-->
 </p><!--rehype:class=home-card-->
 </div></div></div><div class="wrap"><div class="wrap-header h2wrap"><h2>工具包</h2><div class="wrap-body">
 <p class="home-card">
-  <a href="./docs/docker.html" style="background: rgb(72 143 223/var(\-\-bg\-opacity));">Docker</a><!--rehype:style=background: rgb(72 143 223/var(\-\-bg\-opacity));-->
-  <a href="./docs/npm.html" style="background: rgb(203 2 0/var(\-\-bg\-opacity));">npm</a><!--rehype:style=background: rgb(203 2 0/var(\-\-bg\-opacity));-->
-  <a href="./docs/package.json.html" style="background: rgb(132 132 132/var(\-\-bg\-opacity));">package.json</a><!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
-  <a href="./docs/semver.html" style="background: rgb(106 111 141/var(\-\-bg\-opacity));">Semver</a><!--rehype:style=background: rgb(106 111 141/var(\-\-bg\-opacity));-->
-  <a href="./docs/sketch.html" style="background: rgb(223 148 0/var(\-\-bg\-opacity));">Sketch</a><!--rehype:style=background: rgb(223 148 0/var(\-\-bg\-opacity));-->
-  <a href="./docs/jest.html" style="background: rgb(153 66 91/var(\-\-bg\-opacity));">Jest</a><!--rehype:style=background: rgb(153 66 91/var(\-\-bg\-opacity));-->
-  <a href="./docs/vscode.html" style="background: rgb(91 163 230/var(\-\-bg\-opacity));">VSCode</a><!--rehype:style=background: rgb(91 163 230/var(\-\-bg\-opacity));-->
-  <a href="./docs/xpath.html" style="background: rgb(91 163 230/var(\-\-bg\-opacity));">XPath</a><!--rehype:style=background: rgb(91 163 230/var(\-\-bg\-opacity));-->
+  <a href="./docs/docker.html" style="background: rgb(72 143 223/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 640 512" height="1em" width="1em">
+  <path d="M349.9 236.3h-66.1v-59.4h66.1v59.4zm0-204.3h-66.1v60.7h66.1V32zm78.2 144.8H362v59.4h66.1v-59.4zm-156.3-72.1h-66.1v60.1h66.1v-60.1zm78.1 0h-66.1v60.1h66.1v-60.1zm276.8 100c-14.4-9.7-47.6-13.2-73.1-8.4-3.3-24-16.7-44.9-41.1-63.7l-14-9.3-9.3 14c-18.4 27.8-23.4 73.6-3.7 103.8-8.7 4.7-25.8 11.1-48.4 10.7H2.4c-8.7 50.8 5.8 116.8 44 162.1 37.1 43.9 92.7 66.2 165.4 66.2 157.4 0 273.9-72.5 328.4-204.2 21.4.4 67.6.1 91.3-45.2 1.5-2.5 6.6-13.2 8.5-17.1l-13.3-8.9zm-511.1-27.9h-66v59.4h66.1v-59.4zm78.1 0h-66.1v59.4h66.1v-59.4zm78.1 0h-66.1v59.4h66.1v-59.4zm-78.1-72.1h-66.1v60.1h66.1v-60.1z"></path>
+</svg>
+<span>Docker</span></a><!--rehype:style=background: rgb(72 143 223/var(\-\-bg\-opacity));-->
+  <a href="./docs/npm.html" style="background: rgb(203 2 0/var(\-\-bg\-opacity));"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z"></path>
+</svg>
+<span>npm</span></a><!--rehype:style=background: rgb(203 2 0/var(\-\-bg\-opacity));-->
+  <a href="./docs/package.json.html" style="background: rgb(132 132 132/var(\-\-bg\-opacity));"><svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M107.946667 838.4l57.173333 23.893333v-385.28l-103.68 250.026667c-17.493333 43.52 3.413333 93.44 46.506667 111.36z m832-157.866667L728.32 169.813333a85.888 85.888 0 0 0-77.226667-52.48c-11.093333 0-22.613333 1.706667-33.706666 6.4L302.933333 253.866667a85.290667 85.290667 0 0 0-46.08 110.933333l211.626667 510.72a85.248 85.248 0 0 0 110.933333 46.08l314.026667-130.133333a85.077333 85.077333 0 0 0 46.506667-110.933334zM336.213333 373.333333c-23.466667 0-42.666667-19.2-42.666666-42.666666s19.2-42.666667 42.666666-42.666667 42.666667 19.2 42.666667 42.666667-19.2 42.666667-42.666667 42.666666z m-85.333333 469.333334c0 46.933333 38.4 85.333333 85.333333 85.333333h61.866667l-147.2-355.84v270.506667z"></path>
+</svg><span>package.json</span></a><!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
+  <a href="./docs/semver.html" style="background: rgb(106 111 141/var(\-\-bg\-opacity));"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M.357 9.024A12.07 12.07 0 0 0 2.97 19.867a12.051 12.051 0 0 0 10.38 4.063c7.768-.703 13.086-9.799 9.517-16.8-.416-1.19-2.07-.368-1.903.596.287.7.526 1.421.713 2.155a9.983 9.983 0 0 1-3.926 10.25 9.965 9.965 0 0 1-14.807-3.809A9.984 9.984 0 0 1 4.44 5.448a9.968 9.968 0 0 1 4.85-3.044 9.868 9.868 0 0 1 7.02.631.333.333 0 0 1 .155.429l-3.962 10.62c-.107.81-.69.786-.797 0l-2.38-7.37a1.572 1.572 0 0 0-.773-.988c-1.19-.56-3.093.667-2.379 2.155l3.914 10.441c.524 1.393 1.023 1.834 2.058 1.834s1.535-.44 2.058-1.834L20 3.94a1.036 1.036 0 0 0-.369-1.19C13.1-2.907 2.32.641.357 9.023z"></path>
+</svg>
+<span>Semver</span></a><!--rehype:style=background: rgb(106 111 141/var(\-\-bg\-opacity));-->
+  <a href="./docs/sketch.html" style="background: rgb(223 148 0/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 512 512" height="1em" width="1em">
+  <path d="M27.5 162.2 9 187.1h90.5l6.9-130.7-78.9 105.8zM396.3 45.7 267.7 32l135.7 147.2-7.1-133.5zM112.2 218.3l-11.2-22H9.9L234.8 458zm2-31.2h284l-81.5-88.5L256.3 33zm297.3 9.1L277.6 458l224.8-261.7h-90.9zM415.4 69 406 56.4l.9 17.3 6.1 113.4h90.3zM113.5 93.5l-4.6 85.6L244.7 32 116.1 45.7zm287.7 102.7h-290l42.4 82.9L256.3 480l144.9-283.8z"></path>
+</svg>
+<span>Sketch</span></a><!--rehype:style=background: rgb(223 148 0/var(\-\-bg\-opacity));-->
+  <a href="./docs/jest.html" style="background: rgb(153 66 91/var(\-\-bg\-opacity));"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M22.251 11.82a3.117 3.117 0 0 0-2.328-3.01L22.911 0H8.104L11.1 8.838a3.116 3.116 0 0 0-2.244 2.988 3.12 3.12 0 0 0 1.313 2.536 8.279 8.279 0 0 1-1.084 1.244 8.14 8.14 0 0 1-2.55 1.647c-.834-.563-1.195-1.556-.869-2.446a3.11 3.11 0 0 0-.91-6.08 3.117 3.117 0 0 0-3.113 3.113c0 .848.347 1.626.903 2.182-.048.097-.097.195-.146.299-.465.959-.993 2.043-1.195 3.259-.403 2.432.257 4.384 1.849 5.489A5.093 5.093 0 0 0 5.999 24c1.827 0 3.682-.917 5.475-1.807 1.279-.632 2.599-1.292 3.898-1.612.48-.118.98-.187 1.508-.264 1.07-.153 2.175-.312 3.168-.89a4.482 4.482 0 0 0 2.182-3.091c.174-.994 0-1.994-.444-2.87.298-.48.465-1.042.465-1.647zm-1.355 0c0 .965-.785 1.75-1.75 1.75a1.753 1.753 0 0 1-1.085-3.126l.007-.007c.056-.042.118-.084.18-.125 0 0 .008 0 .008-.007.028-.014.055-.035.083-.05.007 0 .014-.006.021-.006.028-.014.063-.028.097-.042.035-.014.07-.027.098-.041.007 0 .013-.007.02-.007.028-.007.056-.021.084-.028.007 0 .02-.007.028-.007.034-.007.062-.014.097-.02h.007l.104-.022c.007 0 .02 0 .028-.007.028 0 .055-.007.083-.007h.035c.035 0 .07-.007.111-.007h.09c.028 0 .05 0 .077.007h.014c.055.007.111.014.167.028a1.766 1.766 0 0 1 1.396 1.723zM10.043 1.39h10.93l-2.509 7.4c-.104.02-.208.055-.312.09l-2.64-5.385-2.648 5.35c-.104-.034-.216-.055-.327-.076l-2.494-7.38zm4.968 9.825a3.083 3.083 0 0 0-.938-1.668l1.438-2.904 1.452 2.967c-.43.43-.743.98-.868 1.605H15.01zm-3.481-1.098c.034-.007.062-.014.097-.02h.02c.029-.008.056-.008.084-.015h.028c.028 0 .049-.007.076-.007h.271c.028 0 .049.007.07.007.014 0 .02 0 .035.007.027.007.048.007.076.014.007 0 .014 0 .028.007l.097.02h.007c.028.008.056.015.083.029.007 0 .014.007.028.007.021.007.049.014.07.027.007 0 .014.007.02.007.028.014.056.021.084.035h.007a.374.374 0 0 1 .09.049h.007c.028.014.056.034.084.048.007 0 .007.007.013.007.028.014.05.035.077.049l.007.007c.083.062.16.132.236.201l.007.007a1.747 1.747 0 0 1 .48 1.209 1.752 1.752 0 0 1-3.502 0 1.742 1.742 0 0 1 1.32-1.695zm-6.838-.049c.966 0 1.751.786 1.751 1.751s-.785 1.751-1.75 1.751-1.752-.785-1.752-1.75.786-1.752 1.751-1.752zm16.163 6.025a3.07 3.07 0 0 1-1.508 2.133c-.758.438-1.689.577-2.669.716a17.29 17.29 0 0 0-1.64.291c-1.445.355-2.834 1.05-4.182 1.717-1.724.854-3.35 1.66-4.857 1.66a3.645 3.645 0 0 1-2.154-.688c-1.529-1.056-1.453-3.036-1.272-4.12.167-1.015.632-1.966 1.077-2.877.028-.055.049-.104.077-.16.152.056.312.098.479.126-.264 1.473.486 2.994 1.946 3.745l.264.139.284-.104c1.216-.431 2.342-1.133 3.336-2.071a9.334 9.334 0 0 0 1.445-1.716c.16.027.32.034.48.034a3.117 3.117 0 0 0 3.008-2.327h1.167a3.109 3.109 0 0 0 3.01 2.327c.576 0 1.11-.16 1.57-.43.18.52.236 1.063.139 1.605z"></path>
+</svg>
+<span>Jest</span></a><!--rehype:style=background: rgb(153 66 91/var(\-\-bg\-opacity));-->
+  <a href="./docs/vscode.html" style="background: rgb(91 163 230/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150" fill="currentColor" height="1em" width="1em">
+  <path d="M111.856 0v128.829L0 112.122 111.856 150l37.289-15.6V17.925l.012-.005-.012-.025V15.6L111.856 0z"></path>
+  <path d="M74.069 21.95 39.807 56.008 19.18 40.386l-8.5 2.854 20.985 20.862-20.985 20.86 8.501 2.857 20.627-15.623 34.26 34.055 20.519-8.767V30.718L74.068 21.95zm-.002 24.3v35.7L50.497 64.1l23.57-17.85z"></path>
+</svg>
+<span>VSCode</span></a><!--rehype:style=background: rgb(91 163 230/var(\-\-bg\-opacity));-->
+  <a href="./docs/xpath.html" style="background: rgb(91 163 230/var(\-\-bg\-opacity));"><svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M107.946667 838.4l57.173333 23.893333v-385.28l-103.68 250.026667c-17.493333 43.52 3.413333 93.44 46.506667 111.36z m832-157.866667L728.32 169.813333a85.888 85.888 0 0 0-77.226667-52.48c-11.093333 0-22.613333 1.706667-33.706666 6.4L302.933333 253.866667a85.290667 85.290667 0 0 0-46.08 110.933333l211.626667 510.72a85.248 85.248 0 0 0 110.933333 46.08l314.026667-130.133333a85.077333 85.077333 0 0 0 46.506667-110.933334zM336.213333 373.333333c-23.466667 0-42.666667-19.2-42.666666-42.666666s19.2-42.666667 42.666666-42.666667 42.666667 19.2 42.666667 42.666667-19.2 42.666667-42.666667 42.666666z m-85.333333 469.333334c0 46.933333 38.4 85.333333 85.333333 85.333333h61.866667l-147.2-355.84v270.506667z"></path>
+</svg><span>XPath</span></a><!--rehype:style=background: rgb(91 163 230/var(\-\-bg\-opacity));-->
 </p><!--rehype:class=home-card-->
 </div></div></div><div class="wrap"><div class="wrap-header h2wrap"><h2>Linux 命令</h2><div class="wrap-body">
 <p class="home-card">
-  <a href="./docs/cron.html" style="background: rgb(239 68 68/var(\-\-bg\-opacity));">Cron</a><!--rehype:style=background: rgb(239 68 68/var(\-\-bg\-opacity));-->
-  <a href="./docs/git.html" style="background: rgb(215 89 62/var(\-\-bg\-opacity));">Git</a><!--rehype:style=background: rgb(215 89 62/var(\-\-bg\-opacity));-->
-  <a href="./docs/find.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));">find</a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
-  <a href="./docs/sed.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));">Sed</a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
+  <a href="./docs/cron.html" style="background: rgb(239 68 68/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" height="1em" width="1em">
+  <path d="M11 8v5l4.25 2.52.77-1.28-3.52-2.09V8H11zm10 2V3l-2.64 2.64A8.937 8.937 0 0 0 12 3a9 9 0 1 0 9 9h-2c0 3.86-3.14 7-7 7s-7-3.14-7-7 3.14-7 7-7c1.93 0 3.68.79 4.95 2.05L14 10h7z"></path>
+</svg>
+<span>Cron</span></a><!--rehype:style=background: rgb(239 68 68/var(\-\-bg\-opacity));-->
+  <a href="./docs/git.html" style="background: rgb(215 89 62/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 16 16" height="1em" width="1em">
+  <path d="M15.698 7.287 8.712.302a1.03 1.03 0 0 0-1.457 0l-1.45 1.45 1.84 1.84a1.223 1.223 0 0 1 1.55 1.56l1.773 1.774a1.224 1.224 0 0 1 1.267 2.025 1.226 1.226 0 0 1-2.002-1.334L8.58 5.963v4.353a1.226 1.226 0 1 1-1.008-.036V5.887a1.226 1.226 0 0 1-.666-1.608L5.093 2.465l-4.79 4.79a1.03 1.03 0 0 0 0 1.457l6.986 6.986a1.03 1.03 0 0 0 1.457 0l6.953-6.953a1.031 1.031 0 0 0 0-1.457"></path>
+</svg>
+<span>Git</span></a><!--rehype:style=background: rgb(215 89 62/var(\-\-bg\-opacity));-->
+  <a href="./docs/find.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));"><svg viewBox="0 0 1024 1024" fill="currentColor" xmlns="http://www.w3.org/2000/svg" height="1em" width="1em"><path d="M384 554.666667C384 625.493333 441.173333 682.666667 512 682.666667 582.826667 682.666667 640 625.493333 640 554.666667 640 483.84 582.826667 426.666667 512 426.666667 441.173333 426.666667 384 483.84 384 554.666667M853.333333 835.84 853.333333 341.333333 597.333333 85.333333 256 85.333333C209.066667 85.333333 170.666667 123.733333 170.666667 170.666667L170.666667 853.333333C170.666667 900.266667 209.066667 938.666667 256 938.666667L768 938.666667C787.2 938.666667 804.266667 932.266667 818.773333 921.6L629.76 732.586667C595.626667 754.773333 554.666667 768 512 768 394.24 768 298.666667 672.426667 298.666667 554.666667 298.666667 436.906667 394.24 341.333333 512 341.333333 629.76 341.333333 725.333333 436.906667 725.333333 554.666667 725.333333 597.333333 712.106667 638.293333 689.92 672L853.333333 835.84Z"></path>
+</svg><span>find</span></a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
+  <a href="./docs/sed.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));"><svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M107.946667 838.4l57.173333 23.893333v-385.28l-103.68 250.026667c-17.493333 43.52 3.413333 93.44 46.506667 111.36z m832-157.866667L728.32 169.813333a85.888 85.888 0 0 0-77.226667-52.48c-11.093333 0-22.613333 1.706667-33.706666 6.4L302.933333 253.866667a85.290667 85.290667 0 0 0-46.08 110.933333l211.626667 510.72a85.248 85.248 0 0 0 110.933333 46.08l314.026667-130.133333a85.077333 85.077333 0 0 0 46.506667-110.933334zM336.213333 373.333333c-23.466667 0-42.666667-19.2-42.666666-42.666666s19.2-42.666667 42.666666-42.666667 42.666667 19.2 42.666667 42.666667-19.2 42.666667-42.666667 42.666666z m-85.333333 469.333334c0 46.933333 38.4 85.333333 85.333333 85.333333h61.866667l-147.2-355.84v270.506667z"></path>
+</svg><span>Sed</span></a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
 </p><!--rehype:class=home-card-->
 </div></div></div><div class="wrap"><div class="wrap-header h2wrap"><h2>其它</h2><div class="wrap-body">
 <p class="home-card">
-  <a href="./docs/quickreference.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));">Quick Reference</a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
-  <a href="./docs/http-status-code.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));">HTTP 状态码</a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
-  <a href="./docs/html-char.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));">HTML 字符实体</a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
-  <a href="./docs/emoji.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));">Emoji</a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
+  <a href="./docs/quickreference.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" height="1em" width="1em">
+  <path opacity=".4" d="m21.66 10.44-.98 4.18c-.84 3.61-2.5 5.07-5.62 4.77-.5-.04-1.04-.13-1.62-.27l-1.68-.4c-4.17-.99-5.46-3.05-4.48-7.23l.98-4.19c.2-.85.44-1.59.74-2.2 1.17-2.42 3.16-3.07 6.5-2.28l1.67.39c4.19.98 5.47 3.05 4.49 7.23Z" fill="currentColor"></path>
+  <path d="M15.06 19.39c-.62.42-1.4.77-2.35 1.08l-1.58.52c-3.97 1.28-6.06.21-7.35-3.76L2.5 13.28c-1.28-3.97-.22-6.07 3.75-7.35l1.58-.52c.41-.13.8-.24 1.17-.31-.3.61-.54 1.35-.74 2.2l-.98 4.19c-.98 4.18.31 6.24 4.48 7.23l1.68.4c.58.14 1.12.23 1.62.27Zm2.43-8.88c-.06 0-.12-.01-.19-.02l-4.85-1.23a.75.75 0 0 1 .37-1.45l4.85 1.23a.748.748 0 0 1-.18 1.47Z" fill="currentColor"></path>
+  <path d="M14.56 13.89c-.06 0-.12-.01-.19-.02l-2.91-.74a.75.75 0 0 1 .37-1.45l2.91.74c.4.1.64.51.54.91-.08.34-.38.56-.72.56Z" fill="currentColor"></path>
+</svg>
+<span>Quick Reference</span></a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
+  <a href="./docs/http-status-code.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));"><svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M107.946667 838.4l57.173333 23.893333v-385.28l-103.68 250.026667c-17.493333 43.52 3.413333 93.44 46.506667 111.36z m832-157.866667L728.32 169.813333a85.888 85.888 0 0 0-77.226667-52.48c-11.093333 0-22.613333 1.706667-33.706666 6.4L302.933333 253.866667a85.290667 85.290667 0 0 0-46.08 110.933333l211.626667 510.72a85.248 85.248 0 0 0 110.933333 46.08l314.026667-130.133333a85.077333 85.077333 0 0 0 46.506667-110.933334zM336.213333 373.333333c-23.466667 0-42.666667-19.2-42.666666-42.666666s19.2-42.666667 42.666666-42.666667 42.666667 19.2 42.666667 42.666667-19.2 42.666667-42.666667 42.666666z m-85.333333 469.333334c0 46.933333 38.4 85.333333 85.333333 85.333333h61.866667l-147.2-355.84v270.506667z"></path>
+</svg><span>HTTP 状态码</span></a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
+  <a href="./docs/html-char.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));"><svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em">
+  <path d="M107.946667 838.4l57.173333 23.893333v-385.28l-103.68 250.026667c-17.493333 43.52 3.413333 93.44 46.506667 111.36z m832-157.866667L728.32 169.813333a85.888 85.888 0 0 0-77.226667-52.48c-11.093333 0-22.613333 1.706667-33.706666 6.4L302.933333 253.866667a85.290667 85.290667 0 0 0-46.08 110.933333l211.626667 510.72a85.248 85.248 0 0 0 110.933333 46.08l314.026667-130.133333a85.077333 85.077333 0 0 0 46.506667-110.933334zM336.213333 373.333333c-23.466667 0-42.666667-19.2-42.666666-42.666666s19.2-42.666667 42.666666-42.666667 42.666667 19.2 42.666667 42.666667-19.2 42.666667-42.666667 42.666666z m-85.333333 469.333334c0 46.933333 38.4 85.333333 85.333333 85.333333h61.866667l-147.2-355.84v270.506667z"></path>
+</svg><span>HTML 字符实体</span></a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
+  <a href="./docs/emoji.html" style="background: rgb(16 185 129/var(\-\-bg\-opacity));"><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-emoji-kiss-fill" viewBox="0 0 16 16" height="1em" width="1em">
+  <path fill-rule="evenodd" d="M16 8a8 8 0 1 0-2.697 5.99c-.972-.665-1.632-1.356-1.99-2.062-.388-.766-.419-1.561-.075-2.23.496-.97 1.73-1.466 2.762-1.05.65-.262 1.38-.162 1.957.19.028-.275.043-.555.043-.838ZM7 6.5C7 7.328 6.552 8 6 8s-1-.672-1-1.5S5.448 5 6 5s1 .672 1 1.5Zm1.512 3.647c-.347.08-.737.198-1.107.319a.5.5 0 1 1-.31-.95c.38-.125.802-.254 1.192-.343.37-.086.78-.153 1.103-.108.16.022.394.085.561.286.188.226.187.497.131.705a1.894 1.894 0 0 1-.31.593c-.077.107-.168.22-.275.343.107.124.199.24.276.347.142.197.256.397.31.595.055.208.056.479-.132.706-.168.2-.404.262-.563.284-.323.043-.733-.027-1.102-.113a14.87 14.87 0 0 1-1.191-.345.5.5 0 1 1 .31-.95c.371.12.761.24 1.109.321.176.041.325.069.446.084a5.609 5.609 0 0 0-.502-.584.5.5 0 0 1 .002-.695 5.52 5.52 0 0 0 .5-.577 4.465 4.465 0 0 0-.448.082Zm.766-.086-.006-.002c.004 0 .006.002.006.002Zm.002 1.867h-.001l-.005.001a.038.038 0 0 1 .006-.002Zm.157-4.685a.5.5 0 0 1-.874-.486A1.934 1.934 0 0 1 10.25 5.75c.73 0 1.356.412 1.687 1.007a.5.5 0 1 1-.874.486.934.934 0 0 0-.813-.493.934.934 0 0 0-.813.493ZM14 9.828c1.11-1.14 3.884.856 0 3.422-3.884-2.566-1.11-4.562 0-3.421Z"></path>
+</svg>
+<span>Emoji</span></a><!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
 </p><!--rehype:class=home-card-->
 </div></div></div><div class="wrap" style="text-align: center;max-width: 650px;margin: 0 auto;padding-top:4rem;"><div class="wrap-header h2wrap"><h2 class="home-title-reset">看到缺少什么了吗？</h2><div class="wrap-body"><!--rehype:wrap-style=text-align: center;max-width: 650px;margin: 0 auto;padding-top:4rem;&class=home-title-reset-->
 <p>上面的列表没有看到你想要的？ 您是否正在寻找一些备忘清单或参考资料，或者您有一些片段备忘清单要分享，这是一个最好的机会！</p>
diff --git a/style/style.css b/style/style.css
index fb718173..616ee04c 100644
--- a/style/style.css
+++ b/style/style.css
@@ -3,7 +3,7 @@ body {
   tab-size: 4;
   margin: 0;
   line-height: inherit;
-  font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
+  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
 }
 
 body {
@@ -173,6 +173,7 @@ body.home .h1wrap p {
 .home-card a {
   display: flex;
   align-items: center;
+  gap: 0.5rem;
   cursor: pointer;
   border-radius: 0.5rem;
   padding: 1rem;
@@ -186,6 +187,10 @@ body.home .h1wrap p {
 .home-card a:hover {
   --bg-opacity: 1;
 }
+.home-card a svg {
+  min-width: 1.5rem;
+  height: 1.8rem;
+}
 
 .home-title-reset {
   padding-right: 0 !important;