Format all code using prettier.

.prettierrc.mjs

@@ -0,0 +1,12 @@
+/** @type {import("prettier").Config} */
+export default {
+  plugins: ['prettier-plugin-astro'],
+  overrides: [
+    {
+      files: '*.astro',
+      options: {
+        parser: 'astro',
+      },
+    },
+  ],
+};

.vscode/settings.json

@@ -0,0 +1,11 @@
+{
+  "[json]": {
+    "editor.tabSize": 2
+  },
+  "[javascript]": {
+    "editor.tabSize": 2
+  },
+  "[typescript]": {
+    "editor.tabSize": 2
+  }
+}

package-lock.json

@@ -14,6 +14,8 @@
         "astro": "^4.9.2",
         "bignumber.js": "^9.1.2",
         "pinyin-pro": "^3.22.0",
+        "prettier": "^3.3.3",
+        "prettier-plugin-astro": "^0.14.1",
         "remark-toc": "^9.0.0",
         "typescript": "^5.4.5",
         "vue": "^3.4.29"
@@ -58,9 +60,10 @@
       }
     },
     "node_modules/@astrojs/compiler": {
-      "version": "2.8.0",
+      "version": "2.10.3",
-      "resolved": "https://registry.npmmirror.com/@astrojs/compiler/-/compiler-2.8.0.tgz",
+      "resolved": "https://registry.npmmirror.com/@astrojs/compiler/-/compiler-2.10.3.tgz",
-      "integrity": "sha512-yrpD1WRGqsJwANaDIdtHo+YVjvIOFAjC83lu5qENIgrafwZcJgSXDuwVMXOgok4tFzpeKLsFQ6c3FoUdloLWBQ=="
+      "integrity": "sha512-bL/O7YBxsFt55YHU021oL+xz+B/9HvGNId3F9xURN16aeqDK9juHGktdkCSXz+U4nqFACq6ZFvWomOzhV+zfPw==",
+      "license": "MIT"
     },
     "node_modules/@astrojs/internal-helpers": {
       "version": "0.4.0",
@@ -5400,6 +5403,35 @@
         "node": ">=8.15"
       }
     },
+    "node_modules/prettier": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmmirror.com/prettier/-/prettier-3.3.3.tgz",
+      "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
+      "license": "MIT",
+      "bin": {
+        "prettier": "bin/prettier.cjs"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
+    "node_modules/prettier-plugin-astro": {
+      "version": "0.14.1",
+      "resolved": "https://registry.npmmirror.com/prettier-plugin-astro/-/prettier-plugin-astro-0.14.1.tgz",
+      "integrity": "sha512-RiBETaaP9veVstE4vUwSIcdATj6dKmXljouXc/DDNwBSPTp8FRkLGDSGFClKsAFeeg+13SB0Z1JZvbD76bigJw==",
+      "license": "MIT",
+      "dependencies": {
+        "@astrojs/compiler": "^2.9.1",
+        "prettier": "^3.0.0",
+        "sass-formatter": "^0.7.6"
+      },
+      "engines": {
+        "node": "^14.15.0 || >=16.0.0"
+      }
+    },
     "node_modules/prismjs": {
       "version": "1.29.0",
       "resolved": "https://registry.npmmirror.com/prismjs/-/prismjs-1.29.0.tgz",
@@ -6114,6 +6146,21 @@
         "queue-microtask": "^1.2.2"
       }
     },
+    "node_modules/s.color": {
+      "version": "0.0.15",
+      "resolved": "https://registry.npmmirror.com/s.color/-/s.color-0.0.15.tgz",
+      "integrity": "sha512-AUNrbEUHeKY8XsYr/DYpl+qk5+aM+DChopnWOPEzn8YKzOhv4l2zH6LzZms3tOZP3wwdOyc0RmTciyi46HLIuA==",
+      "license": "MIT"
+    },
+    "node_modules/sass-formatter": {
+      "version": "0.7.9",
+      "resolved": "https://registry.npmmirror.com/sass-formatter/-/sass-formatter-0.7.9.tgz",
+      "integrity": "sha512-CWZ8XiSim+fJVG0cFLStwDvft1VI7uvXdCNJYXhDvowiv+DsbD1nXLiQ4zrE5UBvj5DWZJ93cwN0NX5PMsr1Pw==",
+      "license": "MIT",
+      "dependencies": {
+        "suf-log": "^2.5.3"
+      }
+    },
     "node_modules/sax": {
       "version": "1.4.1",
       "resolved": "https://registry.npmmirror.com/sax/-/sax-1.4.1.tgz",
@@ -6395,6 +6442,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/suf-log": {
+      "version": "2.5.3",
+      "resolved": "https://registry.npmmirror.com/suf-log/-/suf-log-2.5.3.tgz",
+      "integrity": "sha512-KvC8OPjzdNOe+xQ4XWJV2whQA0aM1kGVczMQ8+dStAO6KfEB140JEVQ9dE76ONZ0/Ylf67ni4tILPJB41U0eow==",
+      "license": "MIT",
+      "dependencies": {
+        "s.color": "0.0.15"
+      }
+    },
     "node_modules/superjson": {
       "version": "2.2.1",
       "resolved": "https://registry.npmmirror.com/superjson/-/superjson-2.2.1.tgz",

package.json

@@ -16,6 +16,8 @@
     "astro": "^4.9.2",
     "bignumber.js": "^9.1.2",
     "pinyin-pro": "^3.22.0",
+    "prettier": "^3.3.3",
+    "prettier-plugin-astro": "^0.14.1",
     "remark-toc": "^9.0.0",
     "typescript": "^5.4.5",
     "vue": "^3.4.29"

src/components/Footer.astro

@@ -1,4 +1,5 @@
 ---
+
 ---
 
 <div class="footer">

src/components/HTMLCommonHead.astro

@@ -7,7 +7,7 @@ const { title } = Astro.props;
 
 <meta charset="UTF-8" />
 <meta name="viewport" content="width=device-width" />
-<link rel="icon" href="/favicon.ico" type="image/x-icon">
+<link rel="icon" href="/favicon.ico" type="image/x-icon" />
 <meta name="generator" content={Astro.generator} />
 <link rel="sitemap" href="/sitemap-index.xml" />
 <title>{title}</title>

src/components/Nav.astro

@@ -1,4 +1,5 @@
 ---
+
 ---
 
 <div class="nav" id="nav">

src/components/article/CollectionSummary.astro

@@ -23,8 +23,8 @@ const allCategories: Array<string> = Array.from(
   new Set(
     allPosts.map((entry) => {
       return entry.data.category;
-    })
+    }),
-  )
+  ),
 );
 
 const categoriedPostList: Array<CategoriedPosts> = allCategories.map((key) => {
@@ -34,7 +34,7 @@ const categoriedPostList: Array<CategoriedPosts> = allCategories.map((key) => {
   // article sort function by article title
   function sortPostByTitlePinyin(
     postA: CollectionEntry<CollectionKey>,
-    postB: CollectionEntry<CollectionKey>
+    postB: CollectionEntry<CollectionKey>,
   ): number {
     let postATitle = pinyinpro.convert(pinyinpro.pinyin(postA.data.title), {
       format: "symbolToNum",
@@ -63,15 +63,15 @@ const categoriedPostList: Array<CategoriedPosts> = allCategories.map((key) => {
       object[key].filter((post) => /^[^a-zA-Z]/.test(post.data.title));
     // sort two Array by article title
     postWithAlphabetStartedTitle.sort((postA, postB) =>
-      sortPostByTitlePinyin(postA, postB)
+      sortPostByTitlePinyin(postA, postB),
     );
     postWithChineseStartedTitle.sort((postA, postB) =>
-      sortPostByTitlePinyin(postA, postB)
+      sortPostByTitlePinyin(postA, postB),
     );
     // articles that have title start with Chinese prior to
     // those which have titles start with the alphabet
     object[key] = postWithChineseStartedTitle.concat(
-      postWithAlphabetStartedTitle
+      postWithAlphabetStartedTitle,
     );
   }
   return object;
@@ -83,7 +83,7 @@ const categoriedPostListSortedByArticleAmount: Array<CategoriedPosts> =
       const aKey: string = Object.keys(a)[0];
       const bKey: string = Object.keys(b)[0];
       return b[bKey].length - a[aKey].length;
-    }
+    },
   );
 ---
 

src/components/article/article_body/ArticleBody.astro

@@ -40,18 +40,19 @@ for (let i = 1; i < arr.length; i++) {
   // The current line ends without [a-zA-Z].
   // AND
   // The next line starts with [a-zA-Z].
-  if (i + 1 < arr.length
+  if (
-    && arr[i].charAt(arr[i].length - 1).match(/[a-zA-Z]/) === null
+    i + 1 < arr.length &&
-    && arr[i + 1].charAt(0).match(/[a-zA-Z]/) !== null
+    arr[i].charAt(arr[i].length - 1).match(/[a-zA-Z]/) === null &&
+    arr[i + 1].charAt(0).match(/[a-zA-Z]/) !== null
   ) {
     arr[i] += " ";
   }
   // rule 5
-  if (arr[i].match(/^(<em>|<strong>|<a>)/) !== null){
+  if (arr[i].match(/^(<em>|<strong>|<a>)/) !== null) {
     arr[i] = " " + arr[i];
   }
   // rule 6
-  if (arr[i].match(/(<\/em>|<\/strong>|<\/a>)$/) !== null){
+  if (arr[i].match(/(<\/em>|<\/strong>|<\/a>)$/) !== null) {
     arr[i] = arr[i] + " ";
   }
   // -------- combine lines
@@ -63,9 +64,9 @@ for (let i = 1; i < arr.length; i++) {
     //   the final character of previous line is not ascii character.
     // ) AND
     // Current line should not belong to area that remains intact.
-    (arr[i].charAt(0).match(/[ -~]/) === null
+    (arr[i].charAt(0).match(/[ -~]/) === null ||
-      || arr[i - 1].charAt(arr[i - 1].length - 1).match(/[ -~]/) === null)
+      arr[i - 1].charAt(arr[i - 1].length - 1).match(/[ -~]/) === null) &&
-    && !remainIntactArea
+    !remainIntactArea
   ) {
     articleHTMLFinal += arr[i];
   } else {

src/components/tool/ToolNav.astro

@@ -1,4 +1,5 @@
 ---
+
 ---
 
 <ul class="tool-list">
@@ -6,14 +7,14 @@
 </ul>
 
 <style>
-.tool-list {
+  .tool-list {
-  list-style: none;
+    list-style: none;
-  padding: 0;
+    padding: 0;
-  margin: 0.5em 0;
+    margin: 0.5em 0;
-}
+  }
 
-.tool-list li {
+  .tool-list li {
-  float: left;
+    float: left;
-  margin: 0 16px 0 0;
+    margin: 0 16px 0 0;
-}
+  }
 </style>

src/components/tool/unit_conversion/DataUnitConversion.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed, ref } from 'vue';
+import { computed, ref } from "vue";
 import BigNumber from "bignumber.js";
 
 /**
@@ -24,7 +24,7 @@ const UnitName = Object.freeze({
   MBIT: "unit-m-bit",
   GBIT: "unit-g-bit",
   TBIT: "unit-t-bit",
-})
+});
 
 /**
  * @enum {number}
@@ -47,20 +47,20 @@ const UnitNameToSize = Object.freeze({
 });
 
 const size = ref({
-  [UnitName.KBYTE]: '',
+  [UnitName.KBYTE]: "",
-  [UnitName.MBYTE]: '',
+  [UnitName.MBYTE]: "",
-  [UnitName.GBYTE]: '',
+  [UnitName.GBYTE]: "",
-  [UnitName.TBYTE]: '',
+  [UnitName.TBYTE]: "",
-  [UnitName.KIBYTE]: '',
+  [UnitName.KIBYTE]: "",
-  [UnitName.MIBYTE]: '',
+  [UnitName.MIBYTE]: "",
-  [UnitName.GIBYTE]: '',
+  [UnitName.GIBYTE]: "",
-  [UnitName.TIBYTE]: '',
+  [UnitName.TIBYTE]: "",
-  [UnitName.BYTE]: '',
+  [UnitName.BYTE]: "",
-  [UnitName.BIT]: '',
+  [UnitName.BIT]: "",
-  [UnitName.KBIT]: '',
+  [UnitName.KBIT]: "",
-  [UnitName.MBIT]: '',
+  [UnitName.MBIT]: "",
-  [UnitName.GBIT]: '',
+  [UnitName.GBIT]: "",
-  [UnitName.TBIT]: '',
+  [UnitName.TBIT]: "",
 });
 
 /**
@@ -74,17 +74,19 @@ function sizeChanged(unitName) {
    */
   let result = {};
   // assign 0 to current input if nothing is passed
-  if (size.value[unitName].length === 0) result[unitName] = '0';
+  if (size.value[unitName].length === 0) result[unitName] = "0";
-  let inputedBytes = new BigNumber(UnitNameToSize[unitName]).multipliedBy(size.value[unitName]);
+  let inputedBytes = new BigNumber(UnitNameToSize[unitName]).multipliedBy(
+    size.value[unitName],
+  );
   for (const key in UnitNameToSize) {
     result[key] = inputedBytes.div(UnitNameToSize[key]).toString();
   }
   result[unitName] = size.value[unitName];
   for (const key in UnitNameToSize) {
-    if (result[key] !== 'NaN') {
+    if (result[key] !== "NaN") {
       size.value[key] = result[key];
-    } else if (result[key] === 'NaN') {
+    } else if (result[key] === "NaN") {
-      size.value[key] = '';
+      size.value[key] = "";
     }
   }
 }
@@ -93,7 +95,7 @@ const isMultipleOf4KiB = computed(() => {
   let userInput = new BigNumber(size.value[UnitName.KIBYTE]);
   if (userInput.toNumber() === 0) return false;
   return userInput.mod(4).toNumber() === 0 ? true : false;
-})
+});
 </script>
 
 <template>
@@ -102,22 +104,22 @@ const isMultipleOf4KiB = computed(() => {
     <p>1000 进制并以 Byte 计:</p>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.KBYTE" type="text" v-model="size[UnitName.KBYTE]"
-        @input="sizeChanged(UnitName.KBYTE)">
+        @input="sizeChanged(UnitName.KBYTE)" />
       <span class="unit-name">KB</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.MBYTE" type="text" v-model="size[UnitName.MBYTE]"
-        @input="sizeChanged(UnitName.MBYTE)">
+        @input="sizeChanged(UnitName.MBYTE)" />
       <span class="unit-name">MB</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.GBYTE" type="text" v-model="size[UnitName.GBYTE]"
-        @input="sizeChanged(UnitName.GBYTE)">
+        @input="sizeChanged(UnitName.GBYTE)" />
       <span class="unit-name">GB</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.TBYTE" type="text" v-model="size[UnitName.TBYTE]"
-        @input="sizeChanged(UnitName.TBYTE)">
+        @input="sizeChanged(UnitName.TBYTE)" />
       <span class="unit-name">TB</span>
     </div>
   </div>
@@ -125,22 +127,22 @@ const isMultipleOf4KiB = computed(() => {
     <p>1024 进制并以 Byte 计:</p>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.KIBYTE" type="text" v-model="size[UnitName.KIBYTE]"
-        @input="sizeChanged(UnitName.KIBYTE)">
+        @input="sizeChanged(UnitName.KIBYTE)" />
       <span class="unit-name">KiB</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.MIBYTE" type="text" v-model="size[UnitName.MIBYTE]"
-        @input="sizeChanged(UnitName.MIBYTE)">
+        @input="sizeChanged(UnitName.MIBYTE)" />
       <span class="unit-name">MiB</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.GIBYTE" type="text" v-model="size[UnitName.GIBYTE]"
-        @input="sizeChanged(UnitName.GIBYTE)">
+        @input="sizeChanged(UnitName.GIBYTE)" />
       <span class="unit-name">GiB</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.TIBYTE" type="text" v-model="size[UnitName.TIBYTE]"
-        @input="sizeChanged(UnitName.TIBYTE)">
+        @input="sizeChanged(UnitName.TIBYTE)" />
       <span class="unit-name">TiB</span>
     </div>
   </div>
@@ -148,12 +150,12 @@ const isMultipleOf4KiB = computed(() => {
     <p>以 Byte (B) / bit (b) 计:</p>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.BYTE" type="text" v-model="size[UnitName.BYTE]"
-        @input="sizeChanged(UnitName.BYTE)">
+        @input="sizeChanged(UnitName.BYTE)" />
       <span class="unit-name">B</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.BIT" type="text" v-model="size[UnitName.BIT]"
-        @input="sizeChanged(UnitName.BIT)">
+        @input="sizeChanged(UnitName.BIT)" />
       <span class="unit-name">b</span>
     </div>
   </div>
@@ -161,22 +163,22 @@ const isMultipleOf4KiB = computed(() => {
     <p>1000 进制并以 bit 计:</p>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.KBIT" type="text" v-model="size[UnitName.KBIT]"
-        @input="sizeChanged(UnitName.KBIT)">
+        @input="sizeChanged(UnitName.KBIT)" />
       <span class="unit-name">Kb</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.MBIT" type="text" v-model="size[UnitName.MBIT]"
-        @input="sizeChanged(UnitName.MBIT)">
+        @input="sizeChanged(UnitName.MBIT)" />
       <span class="unit-name">Mb</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.GBIT" type="text" v-model="size[UnitName.GBIT]"
-        @input="sizeChanged(UnitName.GBIT)">
+        @input="sizeChanged(UnitName.GBIT)" />
       <span class="unit-name">Gb</span>
     </div>
     <div class="unit-conversion-computation-node">
       <input class="size-text" :id="UnitName.TBIT" type="text" v-model="size[UnitName.TBIT]"
-        @input="sizeChanged(UnitName.TBIT)">
+        @input="sizeChanged(UnitName.TBIT)" />
       <span class="unit-name">Tb</span>
     </div>
   </div>
@@ -203,7 +205,7 @@ p {
 
 .unit-conversion-computation-node .size-text {
   margin: 0 6px 0 0;
-  width: 125px
+  width: 125px;
 }
 
 @media screen and (max-width: 395px) {
@@ -217,7 +219,7 @@ p {
 }
 
 .unit-conversion-computation-area::after {
-  content: '';
+  content: "";
   display: block;
   clear: both;
 }

src/components/tool/unit_conversion/UnitConversionWrapper.astro

@@ -5,6 +5,6 @@ import WeightUnitConversion from "./WeightUnitConversion.vue";
 
 <WeightUnitConversion client:load />
 
-<br>
+<br />
 
 <DataUnitConversion client:load />

src/components/tool/unit_conversion/WeightUnitConversion.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed, ref } from 'vue';
+import { computed, ref } from "vue";
 import BigNumber from "bignumber.js";
 
 /**
@@ -15,8 +15,8 @@ const twToMetricUnitName = Object.freeze({
   QIAN: "qian",
   FEN: "fen",
   GRAM: "gram",
-  KILOGRAM: "kilogram"
+  KILOGRAM: "kilogram",
-})
+});
 
 /**
  * @enum {number}
@@ -28,15 +28,15 @@ const twToMetricUnitNameToWeight = Object.freeze({
   [twToMetricUnitName.FEN]: 600 / 16 / 10 / 10,
   [twToMetricUnitName.GRAM]: 1,
   [twToMetricUnitName.KILOGRAM]: 1 * 1000,
-})
+});
 
 const weight = ref({
-  [twToMetricUnitName.JIN]: '',
+  [twToMetricUnitName.JIN]: "",
-  [twToMetricUnitName.LIANG]: '',
+  [twToMetricUnitName.LIANG]: "",
-  [twToMetricUnitName.QIAN]: '',
+  [twToMetricUnitName.QIAN]: "",
-  [twToMetricUnitName.FEN]: '',
+  [twToMetricUnitName.FEN]: "",
-  [twToMetricUnitName.GRAM]: '',
+  [twToMetricUnitName.GRAM]: "",
-  [twToMetricUnitName.KILOGRAM]: '',
+  [twToMetricUnitName.KILOGRAM]: "",
 });
 
 /**
@@ -50,17 +50,19 @@ function weightChanged(unitName) {
    */
   let result = {};
   // assign 0 to current input if nothing is passed
-  if (weight.value[unitName].length === 0) result[unitName] = '0';
+  if (weight.value[unitName].length === 0) result[unitName] = "0";
-  let inputedGram = new BigNumber(twToMetricUnitNameToWeight[unitName]).multipliedBy(weight.value[unitName]);
+  let inputedGram = new BigNumber(
+    twToMetricUnitNameToWeight[unitName],
+  ).multipliedBy(weight.value[unitName]);
   for (const key in twToMetricUnitNameToWeight) {
     result[key] = inputedGram.div(twToMetricUnitNameToWeight[key]).toString();
   }
   result[unitName] = weight.value[unitName];
   for (const key in twToMetricUnitNameToWeight) {
-    if (result[key] !== 'NaN') {
+    if (result[key] !== "NaN") {
       weight.value[key] = result[key];
-    } else if (result[key] === 'NaN') {
+    } else if (result[key] === "NaN") {
-      weight.value[key] = '';
+      weight.value[key] = "";
     }
   }
 }
@@ -72,12 +74,12 @@ function weightChanged(unitName) {
     <p>公制重量:</p>
     <div class="weight-conversion-computation-node">
       <input class="size-text" :id="twToMetricUnitName.KILOGRAM" type="text"
-        v-model="weight[twToMetricUnitName.KILOGRAM]" @input="weightChanged(twToMetricUnitName.KILOGRAM)">
+        v-model="weight[twToMetricUnitName.KILOGRAM]" @input="weightChanged(twToMetricUnitName.KILOGRAM)" />
       <span class="unit-name">千克</span>
     </div>
     <div class="weight-conversion-computation-node">
       <input class="size-text" :id="twToMetricUnitName.GRAM" type="text" v-model="weight[twToMetricUnitName.GRAM]"
-        @input="weightChanged(twToMetricUnitName.GRAM)">
+        @input="weightChanged(twToMetricUnitName.GRAM)" />
       <span class="unit-name">克</span>
     </div>
   </div>
@@ -85,22 +87,22 @@ function weightChanged(unitName) {
     <p>台湾制重量:</p>
     <div class="weight-conversion-computation-node">
       <input class="size-text" :id="twToMetricUnitName.JIN" type="text" v-model="weight[twToMetricUnitName.JIN]"
-        @input="weightChanged(twToMetricUnitName.JIN)">
+        @input="weightChanged(twToMetricUnitName.JIN)" />
       <span class="unit-name">斤</span>
     </div>
     <div class="weight-conversion-computation-node">
       <input class="size-text" :id="twToMetricUnitName.LIANG" type="text" v-model="weight[twToMetricUnitName.LIANG]"
-        @input="weightChanged(twToMetricUnitName.LIANG)">
+        @input="weightChanged(twToMetricUnitName.LIANG)" />
       <span class="unit-name">两</span>
     </div>
     <div class="weight-conversion-computation-node">
       <input class="size-text" :id="twToMetricUnitName.QIAN" type="text" v-model="weight[twToMetricUnitName.QIAN]"
-        @input="weightChanged(twToMetricUnitName.QIAN)">
+        @input="weightChanged(twToMetricUnitName.QIAN)" />
       <span class="unit-name">钱</span>
     </div>
     <div class="weight-conversion-computation-node">
       <input class="size-text" :id="twToMetricUnitName.FEN" type="text" v-model="weight[twToMetricUnitName.FEN]"
-        @input="weightChanged(twToMetricUnitName.FEN)">
+        @input="weightChanged(twToMetricUnitName.FEN)" />
       <span class="unit-name">分</span>
     </div>
   </div>
@@ -124,7 +126,7 @@ p {
 
 .weight-conversion-computation-node .size-text {
   margin: 0 6px 0 0;
-  width: 115px
+  width: 115px;
 }
 
 @media screen and (max-width: 395px) {
@@ -138,7 +140,7 @@ p {
 }
 
 .weight-conversion-computation-area::after {
-  content: '';
+  content: "";
   display: block;
   clear: both;
 }

src/layouts/DefaultLayout.astro

@@ -1,6 +1,6 @@
 ---
 import HTMLCommonHead from "../components/HTMLCommonHead.astro";
-import "../styles/global.css"
+import "../styles/global.css";
 
 interface Props {
   title: string;
@@ -11,7 +11,7 @@ const { title } = Astro.props;
 <!doctype html>
 <html lang="zh">
   <head>
-    <HTMLCommonHead title={title}/>
+    <HTMLCommonHead title={title} />
   </head>
   <body>
     <slot />

src/pages/article/blog/[...blog].astro

@@ -24,7 +24,7 @@ interface Props {
 }
 const { entry } = Astro.props;
 
-const articlePrettyName:string = entry.id.split("/").pop()!.replace(".md", "");
+const articlePrettyName: string = entry.id.split("/").pop()!.replace(".md", "");
 ---
 
 <DefaultLayout title=`${articlePrettyName} - 李守中`>

src/pages/article/note/[...note].astro

@@ -24,7 +24,7 @@ interface Props {
 }
 const { entry } = Astro.props;
 
-const articlePrettyName:string = entry.id.split("/").pop()!.replace(".md", "");
+const articlePrettyName: string = entry.id.split("/").pop()!.replace(".md", "");
 ---
 
 <DefaultLayout title=`${articlePrettyName} - 李守中`>

src/pages/article/translation/[...translation].astro

@@ -24,7 +24,7 @@ interface Props {
 }
 const { entry } = Astro.props;
 
-const articlePrettyName:string = entry.id.split("/").pop()!.replace(".md", "");
+const articlePrettyName: string = entry.id.split("/").pop()!.replace(".md", "");
 ---
 
 <DefaultLayout title=`${articlePrettyName} - 李守中`>

src/styles/global.css

@@ -17,10 +17,19 @@ html {
 body {
   display: flex;
   flex-direction: column;
-  font-family: "Consolas", "Hack", -apple-system,
+  font-family:
-    BlinkMacSystemFont, Tahoma, Arial, "Hiragino Sans GB", "Microsoft YaHei",
+    "Consolas",
-    "WenQuanYi Micro Hei", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+    "Hack",
-    "Segoe UI Symbol", "Noto Color Emoji";
+    Tahoma,
+    Arial,
+    "Hiragino Sans GB",
+    "Microsoft YaHei",
+    "WenQuanYi Micro Hei",
+    sans-serif,
+    "Apple Color Emoji",
+    "Segoe UI Emoji",
+    "Segoe UI Symbol",
+    "Noto Color Emoji";
   font-size: 1em;
   margin: auto;
   overflow-y: scroll;