From af6b45becfa94c0dfbac87562d78637ff74d23b9 Mon Sep 17 00:00:00 2001
From: radishzzz <shuyinsen@gmail.com>
Date: Thu, 17 Apr 2025 03:49:31 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20style:=20optimize=20heti=20css?=
 =?UTF-8?q?=20styles?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/styles/global.css |   4 --
 src/styles/heti.css   | 117 +++++++++++++++++++-----------------------
 2 files changed, 52 insertions(+), 69 deletions(-)

diff --git a/src/styles/global.css b/src/styles/global.css
index cc15935..3fd0aef 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -12,10 +12,6 @@ body {
   --at-apply: 'ios-flash-fix';
 }
 
-article.heti img {
-  --at-apply: 'cursor-zoom-in force-gpu';
-}
-
 /* View Transition with Theme Toggle >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
 ::view-transition-new(theme-transition) {
   animation: reveal 1s cubic-bezier(0.4, 0, 0.2, 1);
diff --git a/src/styles/heti.css b/src/styles/heti.css
index 8808158..5c905b6 100644
--- a/src/styles/heti.css
+++ b/src/styles/heti.css
@@ -25,7 +25,7 @@
 
 /* Images */
 .heti :where(img) {
-  --at-apply: 'mx-auto my-5';
+  --at-apply: 'mx-auto my-5 cursor-zoom-in force-gpu';
 }
 .heti :where(figure) {
   --at-apply: 'mx-auto my-5';
@@ -111,11 +111,6 @@
   --at-apply: 'tracking-0';
 }
 
-/* Blockquotes */
-.heti :where(blockquote) {
-  --at-apply: 'px-1em c-secondary/80 border-l-0.25em border-solid border-secondary/25';
-}
-
 /* Code Blocks */
 .heti :where(pre) {
   --at-apply: 'overflow-auto mb-4 p-4 rounded bg-secondary/5! border border-solid border-secondary/5';
@@ -142,9 +137,24 @@ html.dark .heti pre :where(span) {
   direction: rtl;
 }
 
-/* Horizontal Rules */
-.heti :where(hr) {
-  --at-apply: 'my-6 border-t-2 border-secondary/25';
+/* Blockquotes */
+.heti :where(blockquote) {
+  --at-apply: 'px-1em c-secondary/80 border-l-0.25em border-solid border-secondary/25';
+}
+
+/* Tables */
+.heti :where(table) {
+  --at-apply: 'block box-border table-fixed max-w-full mb-4 overflow-x-auto scrollbar-hidden';
+}
+.heti :where(table)::-webkit-scrollbar {
+  --at-apply: 'hidden';
+}
+.heti :where(th),
+.heti :where(td) {
+  --at-apply: 'px-3 py-1.5 border border-solid border-secondary/40';
+}
+.heti :where(tbody tr:nth-child(even)) {
+  --at-apply: 'bg-secondary/5';
 }
 
 /* Lists */
@@ -178,33 +188,10 @@ html.dark .heti pre :where(span) {
   --at-apply: 'list-unset mt-0.25em';
 }
 
-/* Tables */
-.heti :where(table) {
-  --at-apply: 'block box-border table-fixed w-full max-w-full mt-3 mb-6 overflow-x-auto break-words scrollbar-hidden';
-}
-.heti :where(table)::-webkit-scrollbar {
-  display: none;
-}
-.heti :where(th),
-.heti :where(td) {
-  --at-apply: 'px-3 py-1.5 border border-solid border-secondary/40';
-}
-.heti :where(tbody tr:nth-child(even)) {
-  --at-apply: 'bg-secondary/5';
-}
-
-/* Abbreviations */
-.heti :where(abbr) {
-  --at-apply: 'tracking-0';
-}
-.heti :where(abbr[title]) {
-  --at-apply: 'mx-0.25 pb-0.25 border-dotted border-secondary border-b-1 no-underline cursor-help';
-}
-
-/* Superscript and Subscript */
+/* Superscript and Subscript >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
 .heti :where(sub),
 .heti :where(sup) {
-  --at-apply: 'mx-0.1em relative text-0.75em leading-1 align-baseline';
+  --at-apply: 'relative mx-0.1em text-0.75em leading-1 align-baseline';
 }
 .heti :where(sub) {
   --at-apply: 'bottom--0.25em';
@@ -225,15 +212,28 @@ html.dark .heti sup a:target {
   --at-apply: 'bg-#4d4a00e0';
 }
 
+/* Abbreviations */
+.heti :where(abbr[title]) {
+  --at-apply: 'pb-0.06em border-b-1 border-dotted border-secondary no-underline cursor-help';
+}
+
+/* Wavy Underline */
+.heti :where(u) {
+  --at-apply: 'underline underline-offset-0.25em decoration-wavy decoration-red';
+}
+html.dark .heti :where(u) {
+  --at-apply: 'decoration-#A14F50';
+}
+
 /* Keyboard Input */
 .heti :where(kbd) {
-  --at-apply: 'rounded border border-solid border-secondary/40 text-secondary tracking-0';
-  --at-apply: 'inline-block text-0.85em font-bold leading-none px-1 py-0.75 whitespace-nowrap';
+  --at-apply: 'inline-block px-0.4em py-0.3em text-0.85em font-bold leading-none tracking-0 whitespace-nowrap';
+  --at-apply: 'rounded border border-solid border-secondary/40 text-secondary';
 }
 
 /* Highlighted Text */
 .heti :where(mark) {
-  --at-apply: 'mx-0.25 px-0.25 py-0.5 text-inherit bg-#ff0';
+  --at-apply: 'mx-0.06em p-0.06em text-inherit bg-#ff0';
 }
 html.dark .heti :where(mark) {
   --at-apply: 'bg-#4d4a00e0';
@@ -242,31 +242,31 @@ html.dark .heti :where(mark) {
 /* Footnotes */
 .footnotes > h2,
 .footnotes > h3 {
-  display: none;
+  --at-apply: 'hidden';
 }
 .footnotes:lang(zh-CN)::before {
   content: "脚注";
-  --at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
+  --at-apply: 'block mt-7.4 mb-4.2 text-6 font-semibold tracking-0.05em';
 }
 .footnotes:lang(zh-TW)::before {
   content: "腳註";
-  --at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
+  --at-apply: 'block mt-7.4 mb-4.2 text-6 font-semibold tracking-0.05em';
 }
 .footnotes:lang(ja)::before {
   content: "脚注";
-  --at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
+  --at-apply: 'block mt-7.4 mb-4.2 text-6 font-semibold tracking-0.05em';
 }
 .footnotes:lang(en)::before {
   content: "Footnotes";
-  --at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
+  --at-apply: 'block mt-7.4 mb-4.2 text-6 font-semibold';
 }
 .footnotes:lang(es)::before {
   content: "Notas al pie";
-  --at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
+  --at-apply: 'block mt-7.4 mb-4.2 text-6 font-semibold';
 }
 .footnotes:lang(ru)::before {
   content: "Сноски";
-  --at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
+  --at-apply: 'block mt-7.4 mb-4.2 text-6 font-semibold';
 }
 .heti :where(.data-footnote-backref) {
   --at-apply: 'no-underline';
@@ -275,15 +275,10 @@ html.dark .heti :where(mark) {
 /* Bold */
 .heti :where(b),
 .heti :where(strong) {
-  --at-apply: 'font-semibold';
+  --at-apply: 'font-bold';
 }
 
 /* Italic */
-.heti :where(i) {
-  --at-apply: 'font-italic';
-}
-
-/* Emphasized */
 .heti :where(em) {
   --at-apply: 'italic';
 }
@@ -297,18 +292,9 @@ html.dark .heti :where(mark) {
   quotes: auto;
 }
 
-/* Wavy Underline */
-.heti :where(u) {
-  --at-apply: 'mx-0.25 underline decoration-wavy decoration-red underline-offset-4';
-}
-html.dark .heti :where(u) {
-  --at-apply: 'decoration-#A14F50';
-}
-
-/* Strikethrough */
-.heti :where(del),
-.heti :where(s) {
-  --at-apply: 'mx-0.25';
+/* Horizontal Rules */
+.heti :where(hr) {
+  --at-apply: 'my-6 border-t-2 border-secondary/25';
 }
 
 /* KaTeX Mathematical */
@@ -319,8 +305,8 @@ html.dark .heti :where(u) {
   display: none;
 }
 
-/* Markdown Extensions Style >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
-.heti :where(details) {
+/* Markdown Extensions Style >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
+/* .heti :where(details) {
   --at-apply: 'my-4 px-4 py-3 border border-solid border-secondary/25 rounded cursor-pointer';
 }
 .heti details :where(summary) {
@@ -328,7 +314,8 @@ html.dark .heti :where(u) {
 }
 .heti details[open] :where(summary) {
   --at-apply: 'border-b border-solid border-secondary/25 mb-3 pb-3';
-}
+} */
+
 /* .heti details :where(summary) {
   list-style: none;
 }