feat: add emmet.md cheatsheet.

README.md

@@ -27,6 +27,7 @@ Quick Reference
 
 ## 工具包
 
+[Emmet](./docs/emmet.md)<!--rehype:style=background: rgb(122 203 23/var(\-\-bg\-opacity));-->
 [npm](./docs/npm.md)<!--rehype:style=background: rgb(203 2 0/var(\-\-bg\-opacity));-->
 [package.json](./docs/package.json.md)<!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
 [Semver](./docs/semver.md)<!--rehype:style=background: rgb(106 111 141/var(\-\-bg\-opacity));-->

docs/npm.md

@@ -138,6 +138,16 @@ npm unpublish <package-name>@<version>
 
 注意：如果您取消发布整个包，则必须在 24 小时后才能发布该包的任何新版本。
 
+### 发布包 npmjs.org
+
+```bash
+npm publish
+# 第一次需要指定公开参数
+npm publish --access public
+```
+
+发布公开包，到 npmjs.org
+
 配置
 ---
 

docs/quickreference.md

@@ -208,6 +208,7 @@ const school = <div>学校</div>;
 `<yel>` | <yel>黄色</yel>
 `<pur>` | <pur>紫色</pur>
 `<code>` 或 <code>\`\`</code> | <code>绿</code>`色`
+`<del>` 或 `~~删除~~` | <del>~~红色~~</del>
 <!--rehype:className=shortcuts-->
 
 

docs/typescript.md

@@ -1258,6 +1258,7 @@ class MyComponent extends React.Component<Props, {}> {
 ```
 
 ### 泛型组件
+<!--rehype:wrap-class=col-span-2-->
 
 ```tsx
 // 一个泛型组件

scripts/assets/emmet.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em" viewBox="0 0 153 151">
+  <path d="M76.2378757,0 C118.342892,0 152.475751,33.7082594 152.475751,75.2895046 C152.475751,116.87075 118.342892,150.579009 76.2378757,150.579009 C34.1328596,150.579009 0,116.87075 0,75.2895046 C0,33.7082594 34.1328596,0 76.2378757,0 Z M60.5934369,46.9019586 L19.8384036,56.9645627 L92.6150779,128.835332 L102.803239,88.5872762 L94.3131047,80.2021662 L87.0356763,108.950356 L70.5395345,92.6594199 L75.3909542,73.9732442 L56.2267408,78.5252622 L39.7305989,62.2343264 L68.8415078,55.0474265 L60.5934369,46.9019586 Z M116.873372,33.007443 L76.1189361,43.0694569 L84.367007,51.2149248 L102.561176,47.1421909 L98.1944795,64.8703887 L106.684613,73.2549084 L116.873372,33.007443 Z" transform="translate(0 .421)"/>
+</svg>

scripts/style.css

@@ -203,8 +203,7 @@ table td:first-child>code {
   --text-opacity: 1;
   color: rgb(5 150 105/var(--text-opacity));
 }
-table td:first-child>del>code {
-  text-decoration: inherit;
+table td > del, table td:first-child > del > code, .wrap-body p > del > code {
   color: var(--color-danger-fg);
 }
 
@@ -844,16 +843,7 @@ body:not(.home) .h2wrap > h2 a::after {
   }
 }
 
-@media (min-width: 768px) {
-  .home-card {
-    grid-template-columns: repeat(4,minmax(0,1fr));
-  }
-  .wrap-header.h3wrap > .wrap-body {
-    overflow: initial;
-  }
-}
-
-@media (min-width: 375px) {
+@media only screen and (max-width: 375px) {
   .header-nav .title {
     font-size: 1rem;
   }
@@ -877,6 +867,9 @@ body:not(.home) .h2wrap > h2 a::after {
   .wrap-header.h3wrap > .wrap-body {
     overflow: auto;
   }
+  .tooltip:hover .tooltiptext {
+    display: none;
+  }
   .h1wrap-body {
     gap: 2rem;
   }
@@ -893,4 +886,16 @@ body:not(.home) .h2wrap > h2 a::after {
   .footer-wrap {
     font-size: 0.75rem;
   }
-}
+}
+
+@media (min-width: 768px) {
+  .home-card {
+    grid-template-columns: repeat(4,minmax(0,1fr));
+  }
+  .wrap-header.h3wrap > .wrap-body {
+    overflow: initial;
+  }
+  .tooltip:hover .tooltiptext {
+    display: inline-block;
+  }
+}