chore: add more README and resoures folder

.gitignore

@@ -1,6 +1,6 @@
 # Hugo default output directory
 public
-resources
+/exampleSite/zh/resources
 
 ## OS Files
 # Windows

README.md

@@ -2,43 +2,74 @@
 
 [![Netlify Status](https://api.netlify.com/api/v1/badges/e60303f2-862c-4342-bf59-7c9adb10812e/deploy-status)](https://app.netlify.com/sites/hugo-loveit-en/deploys)
 
-[中文 README](README.zh.md) | [Demo Site](https://hugo-loveit-en.netlify.com)
+English README | [中文说明](README.zh.md)
 
 **LoveIt** is a **clean**, **elegant** but **advanced** blog theme for [Hugo](https://gohugo.io/).
 
 It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) and [KeepIt Theme](https://github.com/liuzc/LeaveIt/).
 
+Since the three themes have a similar look, if you have questions about their differences,
+read [Why choose LoveIt](#why-choose-loveit) so that you can choose the one that works best for you.
+
 ![Hugo Theme LoveIt](exampleSite/static/images/Apple-Devices-Preview.png)
 
-## Demo
+## [Demo Site](https://hugo-loveit-en.netlify.com)
 
 To see this theme in action, here is a live [demo site](https://hugo-loveit-en.netlify.com) which is rendered with **LoveIt** theme.
 
-Websites using **LoveIt** theme:
+## Why choose LoveIt
 
-* [Dillon](https://dillonzq.com)
+Compared to the original LeaveIt theme and the KeepIt theme, the LoveIt theme has the following modifications.
-* Yours
 
-### Features
+* Fixed title bar
+* System native fonts
+* Home subtitles typewriter effect
+* A new list of home posts, compatible with the latest version of Hugo
+* Replace all theme icons with [Font Awesome](https://fontawesome.com/)
+* A lot of style detail adjustments, including color, font size, margins, code preview style
+* More readable dark mode
+* Some beautiful CSS animations
+* Easy-to-use and self-expanding article catalog, while adapting to the mobile side
+* More suitable as a blog theme, the gallery function has been removed, but the image is lazy loaded to improve performance
+* Extended markdown syntax for [Font Awesome](https://fontawesome.com/) icons
+* Math formula support by [Katex](https://katex.org/)
+* Diagram syntax shortcode support by [mermaid](https://github.com/knsv/mermaid)
+* Embedded music player support by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
+* Bilibili player support
+* Kinds of admonitions shortcode support
+* Custom align and float style shortcodes support
+* CDN for all third-party libraries support
 
-#### Performance and SEO
+In short,
+if you prefer the design language and freedom of the LoveIt theme,
+if you want to use the extended Font Awesome icons conveniently,
+if you want to embed math formulas, flowcharts, music or Bilibili videos in your posts,
+the LoveIt theme may be more suitable for you.
+
+I hope you will LoveIt ❤️!
+
+## Features
+
+### Performance and SEO
 
 * Optimized for performance: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
 * Optimized SEO performance with a correct SEO SCHEMA based on JSON-LD
 * [Google Analytics](https://analytics.google.com/analytics) support
 * Search engine verification support (Google, Bind, Yandex and Baidu)
-* CDN support
+* CDN for all third-party libraries support
 * Automatically converted images with Lazy Load by [lazysizes](https://github.com/aFarkas/lazysizes)
 
-#### Appearance and Layout
+### Appearance and Layout
 
 * Desktops/Mobiles Responsive layout
 * Dark/Light Mode
 * A More coerent style beetwen page and sections
 * Pagination support
+* Easy-to-use and self-expanding article catalog, while adapting to the mobile side
 * Multilanguage support and I18N ready
+* Beautiful CSS animation
 
-#### Social and Comment Systems
+### Social and Comment Systems
 
 * Gravatar support by [Gravatar](https://gravatar.com)
 * Local Avatar support
@@ -48,7 +79,7 @@ Websites using **LoveIt** theme:
 * Gitalk comment system support by [Gitalk](https://github.com/gitalk/gitalk)
 * Valine comment system support by [Valine](https://valine.js.org/)
 
-#### Extended Features
+### Extended Features
 
 * Automatically highlighting code by chroma in Hugo
 * Extended markdown syntax for [Font Awesome](https://fontawesome.com/) icons
@@ -140,7 +171,7 @@ Because some features are only in production mode, so you need to add a `product
 * You can click the circle icon to toggle dark-light mode. In the desktop version the circle icon is to the right and in the mobile version is positioned to the left, close to the site title.
 * If you want to make your own theme toggle-able element, you can create an element with a class `.theme-switch`. See [here](https://github.com/dillonzq/LoveIt/blob/master/assets/js/blog.js#L14)
 
-## Home Post model
+### Home Post model
 
 If you want to show posts on index instead of a personal profile, just open `config.toml`, add the following line:
 
@@ -149,7 +180,7 @@ If you want to show posts on index instead of a personal profile, just open `con
     home_mode = "post"
 ```
 
-## Add logo and cover for SEO
+### Add logo and cover for SEO
 
 Add a logo image (127x40) and a cover image (800x600) in the `static` directory.
 

README.zh.md

@@ -2,43 +2,70 @@
 
 [![Netlify Status](https://api.netlify.com/api/v1/badges/c51d4765-deb8-43d2-954c-720527879667/deploy-status)](https://app.netlify.com/sites/hugo-loveit-zh/deploys)
 
-[English README](README.md) | [预览网站](https://hugo-loveit-zh.netlify.com)
+[English README](README.md) | 中文说明
 
 [LoveIt](https://github.com/dillonzq/LoveIt) 是一个**简洁**、**优雅**且**高效**的 [Hugo](https://gohugo.io/) 博客主题。
 
 它的原型基于 [LeaveIt 主题](https://github.com/liuzc/LeaveIt/) 和 [KeepIt 主题](https://github.com/liuzc/LeaveIt/)。
 
+由于三个主题外观的相似性，如果你对于它们的不同之处有疑问，请阅读 [为什么选择 LoveIt](#为什么选择-LoveIt)，以便你能选择最适合你的一个。
+
 ![Hugo 主题 LoveIt](exampleSite/static/images/Apple-Devices-Preview.png)
 
-## 主题预览
+## 主题[预览](https://hugo-loveit-zh.netlify.com)
 
 为了直观地浏览主题特性，这里有一个基于 **LoveIt** 主题渲染的 [预览网站](https://hugo-loveit-zh.netlify.com)。
 
-使用 **LoveIt** 主题的网站：
+## 为什么选择 LoveIt
 
-* [Dillon](https://dillonzq.com)
+相较于 LeaveIt 主题 和 KeepIt 主题，LoveIt 主题主要有以下修改
-* 你的网站
 
-### 特性
+* 固定的标题栏
+* 系统原生字体
+* 主页副标题的打字机效果
+* 焕然一新的主页文章列表，已经兼容最新版 Hugo
+* 所有主题图标替换为 [Font Awesome](https://fontawesome.com/)
+* 大量的样式细节调整，包括颜色、字体大小、边距、代码预览样式
+* 可读性更强的暗黑模式
+* 一些美观的 CSS 动画
+* 易用和自动展开的文章目录，同时适配移动端
+* 为了更适合作为博客主题，去除了画廊功能，但保留了图片懒加载以提高性能
+* 使用 [Font Awesome](https://fontawesome.com/) 图标的扩展 Markdown 语法
+* 支持基于 [Katex](https://katex.org/) 的数学公式
+* 支持基于 [mermaid](https://github.com/knsv/mermaid) 的图表和流程图生成功能
+* 支持基于 [APlayer](https://github.com/MoePlayer/APlayer) 和 [MetingJS](https://github.com/metowolf/MetingJS) 的内嵌音乐播放器
+* 支持内嵌 Bilibili 视频
+* 支持多种提醒样式的 shortcode
+* 支持自定义对齐和浮动方式的 shortcode
+* 支持所有第三方库的 CDN
+* 更加丰富的自定义设置
 
-#### 性能和 SEO
+所以，如果你更偏好 LoveIt 主题的设计语言和自由度，如果你想便捷地使用扩展的 Font Awesome 图标，如果你想在文章内嵌数学公式、流程图、音乐或是 Bilibili 视频，
+那么，LoveIt 主题可能是更适合你。
+希望你会 LoveIt ❤️!
+
+## 特性
+
+### 性能和 SEO
 
 * 性能优化：在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中， 99/100 的移动设备得分和 100/100 的桌面设备得分
 * 使用基于 JSON-LD 格式 的 SEO SCHEMA 文件进行 SEO 优化
 * 支持 [Google Analytics](https://analytics.google.com/analytics)
 * 支持搜索引擎的网站验证 (Google, Bind, Yandex and Baidu)
-* 支持 CDN
+* 支持所有第三方库的 CDN
 * 基于 [lazysizes](https://github.com/aFarkas/lazysizes) 自动转换图片为懒加载
 
-#### 外观和布局
+### 外观和布局
 
 * 桌面设备/移动设备 响应式布局
 * 暗黑/明亮 模式
 * 页面和列表保持一致的视觉样式
 * 支持分页
+* 易用和自动展开的文章目录，同时适配移动端
 * 支持多语言和国际化
+* 美观的 CSS 动画
 
-#### 社交和评论系统
+### 社交和评论系统
 
 * 支持 [Gravatar](https://gravatar.com) 头像
 * 支持本地头像
@@ -48,7 +75,7 @@
 * 支持 [Gitalk](https://github.com/gitalk/gitalk) 评论系统
 * 支持 [Valine](https://valine.js.org/) 评论系统
 
-#### 扩展功能
+### 扩展功能
 
 * 基于 Hugo 使用的 chroma 进行代码高亮
 * 使用 [Font Awesome](https://fontawesome.com/) 图标的扩展 Markdown 语法
@@ -139,7 +166,7 @@
 * 你可以点击圆形图标来切换网站 暗黑-明亮 模式。桌面模式下圆形图标在网页右上角，移动设备模式下在网站左上角标题旁边
 * 如果你想自定义切换网站 暗黑-明亮 模式的元素，可以使用一个 class 包含 `.theme-switch` 的元素，详见[此处](https://github.com/dillonzq/LoveIt/blob/master/assets/js/blog.js#L14)
 
-## 主页预览文章模式
+### 主页预览文章模式
 
 如果你想在主页显示文章而不仅仅是个人信息，请打开配置文件 `config.toml`，并增加下面一行：
 
@@ -148,7 +175,7 @@
     home_mode = "post"
 ```
 
-## 增加网站 logo 和封面用于 SEO 优化
+### 增加网站 logo 和封面用于 SEO 优化
 
 增加一个 logo 图片 (127x40) 和一个封面图片 (800x600) 在 `static` 目录。
 

exampleSite/content/about.md

@@ -18,7 +18,7 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
 * :(fab fa-searchengin): Optimized SEO performance with a correct SEO SCHEMA based on JSON-LD
 * :(fab fa-google): [Google Analytics](https://analytics.google.com/analytics) support
 * :(fas fa-search): Search engine verification support (Google, Bind, Yandex and Baidu)
-* :(fas fa-tachometer-alt): CDN support
+* :(fas fa-tachometer-alt): CDN for all third-party libraries support
 * :(far fa-images): Automatically converted images with Lazy Load by [lazysizes](https://github.com/aFarkas/lazysizes)
 
 #### Appearance and Layout
@@ -27,7 +27,9 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
 * :(fas fa-moon): / :(fas fa-sun): Mode
 * :(fas fa-layer-group): A More coerent style beetwen page and sections
 * :(fas fa-ellipsis-h): Pagination support
+* :(far fa-list-alt): Easy-to-use and self-expanding article catalog, while adapting to the mobile side
 * :(fas fa-language): Multilanguage support and I18N ready
+* :(fab fa-css3-alt): Beautiful CSS animation
 
 #### Social and Comment Systems
 

exampleSite/resources/_gen/assets/scss/css/style.scss_b95b077eb505d5c0aff8055eaced30ad.json

@@ -0,0 +1 @@
+{"Target":"css/style.min.css","MediaType":"text/css","Data":{}}

exampleSite/zh/content/about.md

@@ -18,7 +18,7 @@ draft: false
 * :(fab fa-searchengin): 使用基于 JSON-LD 格式 的 SEO SCHEMA 文件进行 SEO 优化
 * :(fab fa-google): 支持 [Google Analytics](https://analytics.google.com/analytics)
 * :(fas fa-search): 支持搜索引擎的网站验证 (Google, Bind, Yandex and Baidu)
-* :(fas fa-tachometer-alt): 支持 CDN
+* :(fas fa-tachometer-alt): 支持所有第三方库的 CDN
 * :(far fa-images): 基于 [lazysizes](https://github.com/aFarkas/lazysizes) 自动转换图片为懒加载
 
 #### 外观和布局
@@ -27,7 +27,9 @@ draft: false
 * :(fas fa-moon): / :(fas fa-sun): 模式
 * :(fas fa-layer-group): 页面和列表保持一致的视觉样式
 * :(fas fa-ellipsis-h): 支持分页
+* :(far fa-list-alt): 易用和自动展开的文章目录，同时适配移动端
 * :(fas fa-language): 支持多语言和国际化
+* :(fab fa-css3-alt): 美观的 CSS 动画
 
 #### 社交和评论系统