chore: add simplified chinese typography guide in README.md

5 files changed, 21 insertions, 4 deletions

diff --git a/README.md b/README.md
index 6f6458f..cfa3aa5 100644
--- a/README.md
+++ b/README.md
@@ -8,7 +8,7 @@ A minimal, latex-style hugo theme for personal blogging.
 
 - [Disqus](https://disqus.com/) & Google Analytics included
 - Responsive design for mobile devices
-- Optimized typography for Simplified Chinese
+- Customize the site with your own styles
 - Math equations powered by [MathJax](https://www.mathjax.org/)
 - Minimal CSS, No JavaScript, Blazing Fast!
 
@@ -20,6 +20,16 @@ git clone https://github.com/queensferryme/hugo-theme-texify.git themes/hugo-the
 
 See `exampleSite/config.toml` for an example configuration.
 
+Note that for Simplified Chinese users, it is generally recommended to use [Noto Serif SC](https://fonts.google.com/specimen/Noto+Serif+SC) via Google Fonts. For instance, put the following codes in your `static/css/custom.css`:
+
+```css
+@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300&display=swap');
+
+#wrapper {
+    font-family: 'Latin Modern Roman', 'Times New Roman', 'Noto Serif SC', serif;
+}
+```
+
 ## Development
 
 ```bash
diff --git a/static/css/common.css b/static/css/common.css
index 9e54258..5b34e0a 100644
--- a/static/css/common.css
+++ b/static/css/common.css
@@ -127,6 +127,10 @@ time {
     flex-direction: column;
 }
 
+#header > h1 {
+    text-align: center;
+}
+
 @media screen and (min-width: 768px) {
     #header > h1 {
         font-size: 2.8rem;
diff --git a/static/css/content.css b/static/css/content.css
index fa0fc31..bc07997 100644
--- a/static/css/content.css
+++ b/static/css/content.css
@@ -1,5 +1,6 @@
 .content .MathJax {
     overflow-x: auto;
+    overflow-y: hidden;
 }
 
 .content :last-child {
diff --git a/static/css/index.css b/static/css/index.css
index 65e9e83..8b2c6d7 100644
--- a/static/css/index.css
+++ b/static/css/index.css
@@ -1,5 +1,5 @@
 #main > .post + .post {
-    margin-top: 1rem;
+    margin-top: 2rem;
 }
 
 #main > .post > h2 {
diff --git a/static/css/list.css b/static/css/list.css
index 434fe7f..3488006 100644
--- a/static/css/list.css
+++ b/static/css/list.css
@@ -1,6 +1,8 @@
 #main > .post-group > ul {
+    border-left: gray solid 1px;
     list-style-type: none;
-    padding-left: 2rem;
+    margin-left: .5rem;
+    padding-left: 1rem;
 }
 
 #main > .post-group > ul > li {
@@ -18,7 +20,7 @@
 
 @media screen and (min-width: 768px) {
     #main > .post-group > ul {
-        border-left: gray solid 1px;
         margin-left: 1rem;
+        padding-left: 2rem;
     }
 }