style: polish /about/

Author: OverflowCat

package.json

@@ -50,7 +50,7 @@
     "@shikijs/twoslash": "^3.12.2",
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
-    "astro": "5.13.8",
+    "astro": "5.13.9",
     "astro-remote": "^0.3.4",
     "astro-typst": "0.12.1",
     "bilibili-bv-av-convert": "^1.0.0",
@@ -63,7 +63,7 @@
     "gridsome-remark-figure-caption": "^1.2.2",
     "hastscript": "^9.0.1",
     "iso-639-1": "^3.1.5",
-    "jsdom": "^26.1.0",
+    "jsdom": "^27.0.0",
     "jszip": "^3.10.1",
     "less": "4.3.0",
     "logical-astro-tweet": "^0.0.5",
@@ -86,7 +86,7 @@
     "remark-math": "^6.0.0",
     "remark-ruby": "^0.4.0",
     "remark-samp-kbd": "^0.1.3",
-    "sharp": "^0.34.3",
+    "sharp": "^0.34.4",
     "shiki-git-diff": "^0.0.4",
     "spoiled": "^0.4.0",
     "svelte": "^5.38.10",
@@ -97,7 +97,7 @@
   },
   "devDependencies": {
     "@biomejs/biome": "^2.2.4",
-    "@iconify/json": "^2.2.385",
+    "@iconify/json": "^2.2.386",
     "@iconify/utils": "^3.0.2",
     "@types/hast": "^3.0.4",
     "@types/jsdom": "^21.1.7",

pnpm-lock.yaml

@@ -1,14 +1,22 @@
 ---
 // 专名号（Proper Name/Noun）
+export type Props = {
+  title?: string;
+}
+
+const { title = "专名号" } = Astro.props;
 ---
 
-<span class="proper-noun outer"><span class="inner"><slot /></span></span><style lang="less">
+<u class="proper-noun outer" title={title}><span class="inner"><slot /></span></u><style lang="less">
   .proper-noun.outer {
+    // discard u
+    text-decoration: none;
+    text-decoration-style: none;
     // margin-inline: 0.5px;
     > .inner {
       margin-inline: -1px;
     }
-    border-block-end: 1px solid;
+    border-block-end: 1.6px solid;
     border-inline: 0;
     box-sizing: content-box;
     & + & {

src/components/Pn.astro

@@ -11,28 +11,27 @@ import Del from "@/components/diff/Del.astro";
 import Pn from "@/components/Pn.astro";
 
 import "@/styles/a.less";
+import "@/styles/article.less";
+import "@/styles/manchu.less";
 
-{/* <Article> */}
-{/* <article class="text-1.3em!" id="post"> */}
+<style set:html="article#post { font-size: 1.25em; }"></style>
 
 # 关于
 
 欢迎打开新世界的大门！这里是 [OverflowCat](https://github.com/OverflowCat) 的博客。我在这里分享编程、光学、测控、语言和生活。
 
-<br />
-<section class="write-vertical-right max-h-57ch overflow-x-auto w-full">
+<section lang="zh-Hant" class="write-vertical-right max-h-[min(50ch,75svh)] text-justify overflow-x-auto w-full font-serif text-1.1em line-height-175% my-8">
 
 ## 自云
 
-長於<Pn>淮左</Pn>，負笈<Pn>京畿</Pn>。身兼南北之氣，血承<Pn>燕</Pn><Pn>蜀</Pn>之風。<Pn>廣陵</Pn>音韻，<Pn>川北</Pn>言語，略通一二。能操<Pn>珠申</Pn>遺響，間作<Pn>東瀛</Pn>弦歌。學在<Pn>北航</Pn>，行將卒業。性耽前端之術，欲築賽博<Pn>蘭臺</Pn>；偶窺機巧之微，或躬耕於方寸。若見如左之屬，皆某化形耳：曰 <Pn>:en[OverflowCat]</Pn>，曰<Pn>前端之貓</Pn>，曰<Pn>溢出貓</Pn>，曰<Pn>:mnc[ᡥᠠᡳᡤᡳᠶᠠ ᡥᠠᠯᠠ·ᠨᡝᡴᠣ]</Pn>。
+長於<Pn>淮左</Pn>，負笈<Pn>京畿</Pn>。身兼南北之氣，血承<Pn>燕</Pn><Pn>蜀</Pn>之風。[<Pn>廣陵</Pn>音韻](https://zh.wikipedia.org/wiki/%E6%89%AC%E5%B7%9E%E8%AF%9D)，<Pn>川北</Pn>言語，略通一二。能操<Pn>珠申</Pn>遺響，間作<Pn>東瀛</Pn>弦歌。學在<Pn>北航</Pn>，行將卒業。性耽前端之術，欲築[賽博<Pn>蘭臺</Pn>](https://saveweb.org/)；偶窺[機巧](https://en.wikipedia.org/wiki/Embedded_system)之微，或躬耕於方寸。若見如左之屬，皆某化形耳：曰 <Pn>:en[OverflowCat]</Pn>，曰<Pn>前端之貓</Pn>，曰<Pn>溢出貓</Pn>，曰<Pn>:mnc[ᡥᠠᡳᡤᡳᠶᠠ ᡥᠠᠯᠠ·ᠨᡝᡴᠣ]</Pn>。
 
 ## 此间
 
-觀吾域名之玄，乃藏字於其中，是爲 domain hack。所謂「<span lang="zh"><ruby>新<rt>xīn</rt></ruby><ruby>世<rt>shì</rt></ruby><ruby>界<rt>jiè</rt></ruby><ruby>的<rt>de</rt></ruby><ruby>大<rt>dà</rt></ruby><ruby>門<rt>mén</rt></ruby></span>」者，非獨新異之途，亦啓牖之鑰。冀拙文若晨星點夜，微光可照君懷。髫年惯听叩首之机声，今铸字为碑，恍闻铿然。若欲覽新墨，當循 RSS。新篇既就，自當飛驛相報。
+觀吾域名之玄，乃藏字於其中，是爲 domain hack。所謂「<span lang="zh"><ruby>新<rt>xīn</rt></ruby><ruby>世<rt>shì</rt></ruby><ruby>界<rt>jiè</rt></ruby><ruby>的<rt>de</rt></ruby><ruby>大<rt>dà</rt></ruby><ruby>門<rt>mén</rt></ruby></span>」者，非獨新異之途，亦啓牖之鑰。冀拙文若晨星點夜，微光可照君懷。髫年惯听叩首之机声，今铸[字](https://atelier-anchor.com/typefaces/sart-sans)为碑，恍闻铿然。若欲覽新墨，當循 RSS。新篇既就，自當飛驛相報。
 
-斯棧以{天星}^(Astro)爲基，託身於 GitHub 之頁。源碼盡藏[「部落格」之倉](https://github.com/OverflowCat/blog)。篇末可按圖索驥，抵各文章本源。有疑竇則啓{疑敘}^(issue)，或{復刻}^(fork)呈樣，或灑潘江於篇末，或魚傳尺素，皆見納焉。
+斯棧以[{天星}^(Astro)](https://astro.build/)爲基，委身於 <Pn>GitHub 之{頁}^(Pages)</Pn>。源碼盡藏[<span class="bn">部落格</span>之倉](https://github.com/OverflowCat/blog)。篇末可按圖索驥，抵各文本源。有疑竇則啓{疑敘}^(issue)，或{復刻}^(fork)呈樣，或灑<Pn title="人名">潘</Pn><Pn title="地名">江</Pn>於篇末，或魚[傳尺素](mailto:[email protected])，皆見納焉。
 </section>
-<br />
 
 ## 关于本站（白话文版）
 
@@ -46,6 +45,3 @@ import "@/styles/a.less";
 The blog system <Del>will be changed in the near future</Del> <Del>is under construction</Del>
 <Add>has been <a href="/astro/migration">fully migrated to Astro</a></Add>, and comments <Del>will be added later</Del> <Add>has been added</Add>.
 */}
-
-{/* </article> */}
-{/* </Article> */}

src/pages/about.mdx

@@ -45,6 +45,12 @@ export const myRemarkPlugin: RemarkPlugin = () => {
 							lang: "mnc",
 						};
 						break;
+					case "bn":
+						name = "span";
+						props = {
+							className: ["bn"],
+						};
+						break;
 					case "up":
 						name = "span";
 						props = {

src/scripts/remark/custom.ts

@@ -236,7 +236,7 @@ article#post {
 @container html (min-inline-size: 800px) {
   article#post {
     margin-block: 10px;
-    margin-inline: 5px;
+    // margin-inline: 5px;
     padding-block: 8px;
     padding-inline: 24px;
   }
@@ -245,7 +245,7 @@ article#post {
 @container html (min-inline-size: 1200px) {
   article#post {
     margin-block: 14px;
-    margin-inline: 7px;
+    // margin-inline: 7px;
     padding-block: 8px;
     padding-inline: 32px;
   }

src/styles/article.less

@@ -12,7 +12,7 @@ export default defineConfig({
   content: {
     pipeline: {
       include: [
-        /\.(vue|svelte|[jt]sx|mdx?|astro|elm|php|typ|html)($|\?)/,
+        /\.(vue|svelte|[jt]sx?|mdx?|astro|elm|php|typ|html)($|\?)/,
       ]
     }
   },
@@ -28,6 +28,8 @@ export default defineConfig({
     ["upright", { "text-combine-upright": "all" }],
     ["yoko", { "text-combine-upright": "all" }],
 
+    ["bn", { "text-decoration-style": "wavy", "text-decoration-line": "underline" }],
+
     // overflow
     [/overflow-(inline|block)-(hidden|auto|scroll)/, function* ([, axis, type]) {
       yield {